Skip to content
This repository has been archived by the owner on Jun 22, 2023. It is now read-only.

Document selectedColorApplied event on Colorpicker #197

Merged
merged 4 commits into from
Jan 16, 2019
Merged

Document selectedColorApplied event on Colorpicker #197

Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
6fab368
Initial changes
Blackbaud-TrevorBurch Jan 15, 2019
031d94a
Update index.html
blackbaud-johnly Jan 15, 2019
48eb2b8
Merge branch 'master' into colorpicker-color-applied-event
blackbaud-johnly Jan 15, 2019
61cc1cc
Merge branch 'master' into colorpicker-color-applied-event
blackbaud-johnly Jan 16, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 19 additions & 13 deletions src/app/components/colorpicker/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,21 +22,27 @@
</sky-demo-page-properties>

<sky-demo-page-properties sectionHeading="Colorpicker events">
<sky-demo-page-property
propertyName="selectedColorApplied">
Fires when users click <strong>Apply</strong> in the colorpicker to apply a color.
</sky-demo-page-property>
<sky-demo-page-property
propertyName="selectedColorChanged">
Fires when users select a color. Returns an object with the following properties:
<div><pre>
{{'{'}}
hslaText: string
rgbaText: string
cmykText: string
hsva: {{'{'}} hue: number, saturation: number, value: number, alpha: number{{'}'}}
rgba: {{'{'}} red: number, green: number, blue: number, alpha: number{{'}'}}
hsla: {{'{'}} hue: number, saturation: number, lightness: number, alpha: number{{'}'}}
cmyk: {{'{'}} cyan: number, magenta: number, yellow: number, key: number {{'}'}}
hex: string
{{'}'}}</pre></div>
</sky-demo-page-property>
Fires when users select a color within the colorpicker.
<div style="margin-top: 10px;">Both events return an object with the following properties:
<pre>
{{'{'}}
hslaText: string
rgbaText: string
cmykText: string
hsva: {{'{'}} hue: number, saturation: number, value: number, alpha: number{{'}'}}
rgba: {{'{'}} red: number, green: number, blue: number, alpha: number{{'}'}}
hsla: {{'{'}} hue: number, saturation: number, lightness: number, alpha: number{{'}'}}
cmyk: {{'{'}} cyan: number, magenta: number, yellow: number, key: number {{'}'}}
hex: string
{{'}'}}
</pre></div>
</sky-demo-page-property>
</sky-demo-page-properties>

<sky-demo-page-properties sectionHeading="Colorpicker input directive properties">
Expand Down