sp-color-loupe
NPM
1.0.1
Storybook
View Storybook
Try it on
webcomponents.dev
1.0.1 (2024-11-11) #
Note: Version bump only for package @spectrum-web-components/color-loupe
1.0.0 (2024-10-31) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.49.0 (2024-10-15) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.48.1 (2024-10-01) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.48.0 (2024-09-17) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.47.2 (2024-09-03) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.47.1 (2024-08-27) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.47.0 (2024-08-20) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.46.0 (2024-08-08) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.45.0 (2024-07-30) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.44.0 (2024-07-15) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.43.0 (2024-06-11) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.42.5 (2024-05-24) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.42.4 (2024-05-14) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.42.3 (2024-05-01) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.42.2 (2024-04-03) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.42.1 (2024-04-02) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.42.0 (2024-03-19) #
Features #
- asset: use core tokens (
99e76f4 )
0.41.2 (2024-03-05) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.41.1 (2024-02-22) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.41.0 (2024-02-13) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.40.5 (2024-02-05) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.40.4 (2024-01-29) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.40.3 (2024-01-11) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.40.2 (2023-12-18) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.40.1 (2023-12-05) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.40.0 (2023-11-16) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.39.4 (2023-11-02) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.39.3 (2023-10-18) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.39.2 (2023-10-13) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.39.1 (2023-10-06) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.39.0 (2023-09-25) #
Bug Fixes #
- color-handle,color-loupe,swatch,thumbnail: use the Opacity Checkerboard package (
47e1fc4 ) - opacity checkerboard inclusion order (
#3651 ) (4f417dc )
0.38.0 (2023-09-05) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.37.0 (2023-08-18) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.36.0 (2023-08-18) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.35.0 (2023-07-31) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.34.0 (2023-07-11) #
Bug Fixes #
- color-loupe: hide svg from screen readers (
#3318 ) (01e75b7 )
0.33.2 (2023-06-14) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.33.0 (2023-06-08) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.32.0 (2023-06-01) #
Bug Fixes #
- color-handle,color-loupe: accept updated CSS token names (
8c28f6d )
0.31.0 (2023-05-17) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.30.0 (2023-05-03) #
Bug Fixes #
- address westbrooks comments (
634af60 )
Features #
- adopt DNA@7 base Spectrum CSS (
e08cafd ) - color-loupe: add color-loupe pattern (
e2f0d15 ) - color-loupe: use core tokens (
149165c ) - include all Dev Mode files in side effects (
f70817c ) - shared pkg versions, devmode define warning, registry-conflicts docs (
6e49565 )
0.5.0 (2023-04-24) #
Features #
- color-loupe: use core tokens (
149165c )
0.4.8 (2023-04-05) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.7 (2023-03-22) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.6 (2023-02-08) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.5 (2023-01-23) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.4 (2023-01-09) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.3 (2022-12-08) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.2 (2022-11-21) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.1 (2022-11-14) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.4.0 (2022-08-09) #
Features #
- include all Dev Mode files in side effects (
f70817c )
0.3.11 (2022-08-04) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.10 (2022-07-18) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.9 (2022-06-29) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.8 (2022-06-07) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.7 (2022-05-12) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.6 (2022-04-21) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.5 (2022-03-08) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.4 (2022-03-04) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.3 (2022-02-22) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.2 (2022-01-26) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.1 (2021-12-13) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.3.0 (2021-11-08) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.2.1 (2021-11-08) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.2.0 (2021-11-02) #
Features #
- adopt DNA@7 base Spectrum CSS (
e08cafd )
0.1.7 (2021-09-20) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.1.6 (2021-07-22) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.1.5 (2021-06-16) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.1.4 (2021-05-12) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.1.3 (2021-04-09) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.1.2 (2021-03-29) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.1.1 (2021-03-22) #
Note: Version bump only for package @spectrum-web-components/color-loupe
0.1.0 (2021-03-05) #
Bug Fixes #
- address westbrooks comments (
634af60 )
Features #
- color-loupe: add color-loupe pattern (
e2f0d15 )
Attributes and Properties #
color
color
string
'rgba(255, 0, 0, 0.5)'
open
open
boolean
false
Description #
An <sp-color-loupe>
shows the output color that would otherwise be covered by a cursor, stylus, or finger during color selection.
Usage #
yarn add @spectrum-web-components/color-loupe
Import the side effectful registration of <sp-color-loupe>
via:
import '@spectrum-web-components/color-loupe/sp-color-loupe.js';
When looking to leverage the ColorLoupe
base class as a type and/or for extension purposes, do so via:
import { ColorLoupe } from '@spectrum-web-components/color-loupe';
Example #
<div style="padding: 100px 0 0;"> <div style="position:relative"> <sp-color-loupe open="" dir="ltr"></sp-color-loupe> </div> </div>