@semcore/feature-highlight 17.0.1 → 17.1.0-prerelease.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (78) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/lib/cjs/components/badge/Badge.js +5 -5
  3. package/lib/cjs/components/badge/badge.shadow.css +2 -2
  4. package/lib/cjs/components/button/Button.js +9 -9
  5. package/lib/cjs/components/button/button.shadow.css +24 -24
  6. package/lib/cjs/components/checkbox/Checkbox.js +3 -3
  7. package/lib/cjs/components/checkbox/Checkbox.js.map +1 -1
  8. package/lib/cjs/components/checkbox/Checkbox.type.js.map +1 -1
  9. package/lib/cjs/components/checkbox/checkbox.shadow.css +8 -5
  10. package/lib/cjs/components/input/Input.js +8 -8
  11. package/lib/cjs/components/input/input.shadow.css +2 -2
  12. package/lib/cjs/components/notice/Notice.js +6 -6
  13. package/lib/cjs/components/notice/notice.shadow.css +6 -6
  14. package/lib/cjs/components/pills/Pills.js +7 -7
  15. package/lib/cjs/components/pills/pills.shadow.css +6 -6
  16. package/lib/cjs/components/radio/Radio.js +3 -3
  17. package/lib/cjs/components/radio/Radio.js.map +1 -1
  18. package/lib/cjs/components/radio/Radio.type.js.map +1 -1
  19. package/lib/cjs/components/radio/radio.shadow.css +3 -3
  20. package/lib/cjs/components/switch/Switch.js +4 -4
  21. package/lib/cjs/components/switch/switch.shadow.css +4 -3
  22. package/lib/cjs/components/tab-line/TabLine.js +4 -4
  23. package/lib/cjs/components/tab-line/tabLine.shadow.css +3 -3
  24. package/lib/cjs/inner-components/button-trigger/ButtonTrigger.js +8 -8
  25. package/lib/cjs/inner-components/button-trigger/buttonTrigger.shadow.css +5 -5
  26. package/lib/cjs/inner-components/sparkle/Sparkle.js +13 -13
  27. package/lib/cjs/inner-components/sparkle/style/sparkle.shadow.css +1 -1
  28. package/lib/es6/components/badge/Badge.js +5 -5
  29. package/lib/es6/components/badge/badge.shadow.css +2 -2
  30. package/lib/es6/components/button/Button.js +9 -9
  31. package/lib/es6/components/button/button.shadow.css +24 -24
  32. package/lib/es6/components/checkbox/Checkbox.js +3 -3
  33. package/lib/es6/components/checkbox/Checkbox.js.map +1 -1
  34. package/lib/es6/components/checkbox/Checkbox.type.js.map +1 -1
  35. package/lib/es6/components/checkbox/checkbox.shadow.css +8 -5
  36. package/lib/es6/components/input/Input.js +8 -8
  37. package/lib/es6/components/input/input.shadow.css +2 -2
  38. package/lib/es6/components/notice/Notice.js +6 -6
  39. package/lib/es6/components/notice/notice.shadow.css +6 -6
  40. package/lib/es6/components/pills/Pills.js +7 -7
  41. package/lib/es6/components/pills/pills.shadow.css +6 -6
  42. package/lib/es6/components/radio/Radio.js +3 -3
  43. package/lib/es6/components/radio/Radio.js.map +1 -1
  44. package/lib/es6/components/radio/Radio.type.js.map +1 -1
  45. package/lib/es6/components/radio/radio.shadow.css +3 -3
  46. package/lib/es6/components/switch/Switch.js +4 -4
  47. package/lib/es6/components/switch/switch.shadow.css +4 -3
  48. package/lib/es6/components/tab-line/TabLine.js +4 -4
  49. package/lib/es6/components/tab-line/tabLine.shadow.css +3 -3
  50. package/lib/es6/inner-components/button-trigger/ButtonTrigger.js +8 -8
  51. package/lib/es6/inner-components/button-trigger/buttonTrigger.shadow.css +5 -5
  52. package/lib/es6/inner-components/sparkle/Sparkle.js +13 -13
  53. package/lib/es6/inner-components/sparkle/style/sparkle.shadow.css +1 -1
  54. package/lib/esm/components/badge/Badge.mjs +6 -6
  55. package/lib/esm/components/badge/badge.shadow.css +2 -2
  56. package/lib/esm/components/button/Button.mjs +10 -10
  57. package/lib/esm/components/button/button.shadow.css +24 -24
  58. package/lib/esm/components/checkbox/Checkbox.mjs +4 -4
  59. package/lib/esm/components/checkbox/checkbox.shadow.css +8 -5
  60. package/lib/esm/components/input/Input.mjs +9 -9
  61. package/lib/esm/components/input/input.shadow.css +2 -2
  62. package/lib/esm/components/notice/Notice.mjs +7 -7
  63. package/lib/esm/components/notice/notice.shadow.css +6 -6
  64. package/lib/esm/components/pills/Pills.mjs +8 -8
  65. package/lib/esm/components/pills/pills.shadow.css +6 -6
  66. package/lib/esm/components/radio/Radio.mjs +4 -4
  67. package/lib/esm/components/radio/radio.shadow.css +3 -3
  68. package/lib/esm/components/switch/Switch.mjs +5 -5
  69. package/lib/esm/components/switch/switch.shadow.css +4 -3
  70. package/lib/esm/components/tab-line/TabLine.mjs +5 -5
  71. package/lib/esm/components/tab-line/tabLine.shadow.css +3 -3
  72. package/lib/esm/inner-components/button-trigger/ButtonTrigger.mjs +9 -9
  73. package/lib/esm/inner-components/button-trigger/buttonTrigger.shadow.css +5 -5
  74. package/lib/esm/inner-components/sparkle/Sparkle.mjs +14 -14
  75. package/lib/esm/inner-components/sparkle/style/sparkle.shadow.css +1 -1
  76. package/lib/types/components/checkbox/Checkbox.type.d.ts +4 -4
  77. package/lib/types/components/radio/Radio.type.d.ts +3 -3
  78. package/package.json +19 -19
@@ -14,7 +14,7 @@ SHighlightedItem {
14
14
  }
15
15
  &[selected]::after, &:hover:not(:focus-visible)::after {
16
16
  opacity: 1;
17
- background: var(--intergalactic-border-feature-highlight-active, linear-gradient(90deg, #ab6cfe, #008ff8));
17
+ background: var(--intergalactic-border-feature-highlight-active, linear-gradient(90deg in oklch, oklch(0.74 0.17 303), oklch(0.74 0.117 274.1)));
18
18
  }
19
19
 
20
20
  &::before {
@@ -27,7 +27,7 @@ SHighlightedItem {
27
27
  margin: -4px;
28
28
  padding: 2px;
29
29
  box-sizing: content-box;
30
- background-image: var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg, #ab6cfe, #008ff8));
30
+ background-image: var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg in oklch, oklch(0.74 0.17 303), oklch(0.58 0.168 278.2)));
31
31
 
32
32
  mask: linear-gradient(0deg, #fff, #fff) content-box, linear-gradient(0deg, #fff, #fff);
33
33
  mask-composite: exclude;
@@ -42,5 +42,5 @@ SHighlightedItem {
42
42
  }
43
43
 
44
44
  SHighlightedCaret {
45
- background: var(--intergalactic-border-feature-highlight-active, linear-gradient(90deg, #ab6cfe, #008ff8));
45
+ background: var(--intergalactic-border-feature-highlight-active, linear-gradient(90deg in oklch, oklch(0.74 0.17 303), oklch(0.74 0.117 274.1)));
46
46
  }
@@ -8,18 +8,18 @@ const style = (
8
8
  /*__reshadow_css_start__*/
9
9
  (sstyled.insert(
10
10
  /*__inner_css_start__*/
11
- '.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_){border:1px solid transparent;background:linear-gradient(white,white) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg, #c695ff, #2bb3ff)) border-box;background-origin:border-box;background-clip:padding-box,border-box;position:relative;z-index:1}.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_)::before{content:"";position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;margin:-5px;padding:2px;border-radius:calc(var(--intergalactic-control-rounded, 6px) + 3px);background-image:var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg, #ab6cfe, #008ff8));-webkit-mask:linear-gradient(0deg,#fff,#fff) content-box,linear-gradient(0deg,#fff,#fff);mask:linear-gradient(0deg,#fff,#fff) content-box,linear-gradient(0deg,#fff,#fff);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transform:scale(.96);pointer-events:none;transition:opacity calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out,transform calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out}@media (hover:hover){.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_):hover{background:var(--intergalactic-bg-primary-feature-highlight-hover-active, linear-gradient(90deg, #f9f2ff, #e9f7ff)) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg, #c695ff, #2bb3ff)) border-box}}.___SHighlightedButtonTrigger_1vlbt_gg_.__active_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_),.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_):active{background:linear-gradient(white,white) padding-box,var(--intergalactic-control-primary-feature-highlight-hover, linear-gradient(90deg, #8649e1, #006dca)) border-box;background-origin:border-box;background-clip:padding-box,border-box;border-color:transparent}.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_):focus-visible{outline:0;border-color:transparent}.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_):focus-visible::before{opacity:1;transform:scale(1)}.___SHighlightedButtonTrigger_1vlbt_gg_._neighborLocation_left_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_)::before{border-top-left-radius:0;border-bottom-left-radius:0}.___SHighlightedButtonTrigger_1vlbt_gg_._neighborLocation_right_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_)::before{border-top-right-radius:0;border-bottom-right-radius:0}.___SHighlightedButtonTrigger_1vlbt_gg_._neighborLocation_both_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_)::before{border-radius:0}@supports not (-webkit-mask-composite:xor){.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_):focus-visible{outline:0;box-shadow:0 0 0 2px #fff,0 0 0 4px #7078fc}.___SHighlightedButtonTrigger_1vlbt_gg_:not(._state_invalid_1vlbt_gg_):not(._state_valid_1vlbt_gg_):focus-visible::before{display:none}}',
11
+ '.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_){border:1px solid transparent;background:linear-gradient(white,white) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, rgb(210, 179, 255), rgb(176, 193, 254))) border-box;background-origin:border-box;background-clip:padding-box,border-box;position:relative;z-index:1}@supports (background:linear-gradient(in oklch,red 0%,red 0% 1%,red 2%)) and (color:color(display-p3 0 0 0%)){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_){background:linear-gradient(white,white) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, rgb(210, 179, 255), rgb(176, 193, 254))) border-box}@media (color-gamut:p3){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_){background:linear-gradient(white,white) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, color(display-p3 0.80738 0.70018 0.99486), rgb(176, 193, 254))) border-box}}}.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_)::before{content:"";position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;margin:-5px;padding:2px;border-radius:calc(var(--intergalactic-control-rounded, 6px) + 3px);background-image:var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg in oklch, rgb(192, 142, 255), rgb(102, 107, 219)));-webkit-mask:linear-gradient(0deg,#fff,#fff) content-box,linear-gradient(0deg,#fff,#fff);mask:linear-gradient(0deg,#fff,#fff) content-box,linear-gradient(0deg,#fff,#fff);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transform:scale(.96);pointer-events:none;transition:opacity calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out,transform calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out}@supports (background:linear-gradient(in oklch,red 0%,red 0% 1%,red 2%)) and (color:color(display-p3 0 0 0%)){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_)::before{background-image:var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg in oklch, rgb(192, 142, 255), rgb(102, 107, 219)))}@media (color-gamut:p3){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_)::before{background-image:var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg in oklch, color(display-p3 0.72564 0.56096 0.98326), rgb(102, 107, 219)))}}}@media (hover:hover){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):hover{background:var(--intergalactic-bg-primary-feature-highlight-hover-active, linear-gradient(90deg in oklch, rgb(247, 243, 255), rgb(222, 231, 255))) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, rgb(210, 179, 255), rgb(176, 193, 254))) border-box}@supports (background:linear-gradient(in oklch,red 0%,red 0% 1%,red 2%)) and (color:color(display-p3 0 0 0%)){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):hover{background:var(--intergalactic-bg-primary-feature-highlight-hover-active, linear-gradient(90deg in oklch, rgb(247, 243, 255), rgb(222, 231, 255))) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, rgb(210, 179, 255), rgb(176, 193, 254))) border-box}@media (color-gamut:p3){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):hover{background:var(--intergalactic-bg-primary-feature-highlight-hover-active, linear-gradient(90deg in oklch, color(display-p3 0.96716 0.95079 0.99961), color(display-p3 0.87344 0.9059 0.99962))) padding-box,var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, color(display-p3 0.80738 0.70018 0.99486), rgb(176, 193, 254))) border-box}}}}.___SHighlightedButtonTrigger_gqbwh_gg_.__active_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_),.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):active{background:linear-gradient(white,white) padding-box,var(--intergalactic-control-primary-feature-highlight-hover, linear-gradient(90deg in oklch, rgb(162, 97, 253), rgb(148, 165, 245))) border-box;background-origin:border-box;background-clip:padding-box,border-box;border-color:transparent}.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):focus-visible{outline:0;border-color:transparent}.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):focus-visible::before{opacity:1;transform:scale(1)}.___SHighlightedButtonTrigger_gqbwh_gg_._neighborLocation_left_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_)::before{border-top-left-radius:0;border-bottom-left-radius:0}.___SHighlightedButtonTrigger_gqbwh_gg_._neighborLocation_right_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_)::before{border-top-right-radius:0;border-bottom-right-radius:0}.___SHighlightedButtonTrigger_gqbwh_gg_._neighborLocation_both_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_)::before{border-radius:0}@supports not (-webkit-mask-composite:xor){.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):focus-visible{outline:0;box-shadow:0 0 0 2px #fff,0 0 0 4px #7078fc}.___SHighlightedButtonTrigger_gqbwh_gg_:not(._state_invalid_gqbwh_gg_):not(._state_valid_gqbwh_gg_):focus-visible::before{display:none}}',
12
12
  /*__inner_css_end__*/
13
- "1vlbt_gg_"
13
+ "gqbwh_gg_"
14
14
  ), /*__reshadow_css_end__*/
15
15
  {
16
- "__SHighlightedButtonTrigger": "___SHighlightedButtonTrigger_1vlbt_gg_",
17
- "_state_invalid": "_state_invalid_1vlbt_gg_",
18
- "_state_valid": "_state_valid_1vlbt_gg_",
19
- "_active": "__active_1vlbt_gg_",
20
- "_neighborLocation_left": "_neighborLocation_left_1vlbt_gg_",
21
- "_neighborLocation_right": "_neighborLocation_right_1vlbt_gg_",
22
- "_neighborLocation_both": "_neighborLocation_both_1vlbt_gg_"
16
+ "__SHighlightedButtonTrigger": "___SHighlightedButtonTrigger_gqbwh_gg_",
17
+ "_state_invalid": "_state_invalid_gqbwh_gg_",
18
+ "_state_valid": "_state_valid_gqbwh_gg_",
19
+ "_active": "__active_gqbwh_gg_",
20
+ "_neighborLocation_left": "_neighborLocation_left_gqbwh_gg_",
21
+ "_neighborLocation_right": "_neighborLocation_right_gqbwh_gg_",
22
+ "_neighborLocation_both": "_neighborLocation_both_gqbwh_gg_"
23
23
  })
24
24
  );
25
25
  class ButtonTriggerFHRoot extends Component {
@@ -2,7 +2,7 @@ SHighlightedButtonTrigger:not([state="invalid"]):not([state="valid"]) {
2
2
  border: 1px solid transparent;
3
3
  background:
4
4
  linear-gradient(white, white) padding-box,
5
- var(--intergalactic-border-feature-highlight, linear-gradient(90deg, #c695ff, #2bb3ff)) border-box;
5
+ var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, oklch(0.82 0.118 303), oklch(0.82 0.088 272.1))) border-box;
6
6
  background-origin: border-box;
7
7
  background-clip: padding-box, border-box;
8
8
  position: relative;
@@ -16,7 +16,7 @@ SHighlightedButtonTrigger:not([state="invalid"]):not([state="valid"]) {
16
16
  margin: -5px;
17
17
  padding: 2px;
18
18
  border-radius: calc(var(--intergalactic-control-rounded, 6px) + 3px);
19
- background-image: var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg, #ab6cfe, #008ff8));
19
+ background-image: var(--intergalactic-keyboard-focus-feature-highlight-outline, linear-gradient(90deg in oklch, oklch(0.74 0.17 303), oklch(0.58 0.168 278.2)));
20
20
 
21
21
  mask: linear-gradient(0deg, #fff, #fff) content-box, linear-gradient(0deg, #fff, #fff);
22
22
  mask-composite: exclude;
@@ -31,15 +31,15 @@ SHighlightedButtonTrigger:not([state="invalid"]):not([state="valid"]) {
31
31
  }
32
32
 
33
33
  &:hover {
34
- background: var(--intergalactic-bg-primary-feature-highlight-hover-active, linear-gradient(90deg, #f9f2ff, #e9f7ff)) padding-box,
35
- var(--intergalactic-border-feature-highlight, linear-gradient(90deg, #c695ff, #2bb3ff)) border-box;
34
+ background: var(--intergalactic-bg-primary-feature-highlight-hover-active, linear-gradient(90deg in oklch, oklch(0.97 0.019 303.4), oklch(0.929 0.037 268))) padding-box,
35
+ var(--intergalactic-border-feature-highlight, linear-gradient(90deg in oklch, oklch(0.82 0.118 303), oklch(0.82 0.088 272.1))) border-box;
36
36
  }
37
37
 
38
38
  &:active,
39
39
  &[active] {
40
40
  background:
41
41
  linear-gradient(white, white) padding-box,
42
- var(--intergalactic-control-primary-feature-highlight-hover, linear-gradient(90deg, #8649e1, #006dca)) border-box;
42
+ var(--intergalactic-control-primary-feature-highlight-hover, linear-gradient(90deg in oklch, oklch(0.64 0.223 299.3), oklch(0.74 0.117 274.1))) border-box;
43
43
  background-origin: border-box;
44
44
  background-clip: padding-box, border-box;
45
45
  border-color: transparent;
@@ -5,23 +5,23 @@ const styles = (
5
5
  /*__reshadow_css_start__*/
6
6
  (sstyled.insert(
7
7
  /*__inner_css_start__*/
8
- "@keyframes sparkles_1gy26{50%{transform:rotate(calc(1deg*var(--angle_1gy26))) translateY(200%) scale(var(--scale_1gy26))}to{transform:rotate(calc(1deg*var(--angle_1gy26))) translateY(200%) scale(0)}}.___SSparkle_1gy26_gg_{position:absolute}.___SSparkle_1gy26_gg_ path{fill:var(--intergalactic-icon-primary-feature-highlight, #8649e1)}.___SSparkle_1gy26_gg_.__angle_1gy26_gg_.__scale_1gy26_gg_.__duration_1gy26_gg_{transform:rotate(calc(1deg*var(--angle_1gy26))) scale(var(--scale_1gy26));animation-name:sparkles_1gy26;animation-fill-mode:forwards;animation-duration:var(--duration_1gy26)}.___SSparkle_1gy26_gg_.__left_1gy26_gg_{left:var(--left_1gy26)}.___SSparkle_1gy26_gg_.__top_1gy26_gg_{top:var(--top_1gy26)}",
8
+ "@keyframes sparkles_4t4us{50%{transform:rotate(calc(1deg*var(--angle_4t4us))) translateY(200%) scale(var(--scale_4t4us))}to{transform:rotate(calc(1deg*var(--angle_4t4us))) translateY(200%) scale(0)}}.___SSparkle_4t4us_gg_{position:absolute}.___SSparkle_4t4us_gg_ path{fill:var(--intergalactic-icon-primary-feature-highlight, rgb(144, 65, 250))}.___SSparkle_4t4us_gg_.__angle_4t4us_gg_.__scale_4t4us_gg_.__duration_4t4us_gg_{transform:rotate(calc(1deg*var(--angle_4t4us))) scale(var(--scale_4t4us));animation-name:sparkles_4t4us;animation-fill-mode:forwards;animation-duration:var(--duration_4t4us)}.___SSparkle_4t4us_gg_.__left_4t4us_gg_{left:var(--left_4t4us)}.___SSparkle_4t4us_gg_.__top_4t4us_gg_{top:var(--top_4t4us)}",
9
9
  /*__inner_css_end__*/
10
- "1gy26_gg_"
10
+ "4t4us_gg_"
11
11
  ), /*__reshadow_css_end__*/
12
12
  {
13
- "__SSparkle": "___SSparkle_1gy26_gg_",
14
- "_angle": "__angle_1gy26_gg_",
15
- "_scale": "__scale_1gy26_gg_",
16
- "_duration": "__duration_1gy26_gg_",
17
- "--angle": "--angle_1gy26",
18
- "--scale": "--scale_1gy26",
19
- "--duration": "--duration_1gy26",
20
- "@sparkles": "sparkles_1gy26",
21
- "_left": "__left_1gy26_gg_",
22
- "--left": "--left_1gy26",
23
- "_top": "__top_1gy26_gg_",
24
- "--top": "--top_1gy26"
13
+ "__SSparkle": "___SSparkle_4t4us_gg_",
14
+ "_angle": "__angle_4t4us_gg_",
15
+ "_scale": "__scale_4t4us_gg_",
16
+ "_duration": "__duration_4t4us_gg_",
17
+ "--angle": "--angle_4t4us",
18
+ "--scale": "--scale_4t4us",
19
+ "--duration": "--duration_4t4us",
20
+ "@sparkles": "sparkles_4t4us",
21
+ "_left": "__left_4t4us_gg_",
22
+ "--left": "--left_4t4us",
23
+ "_top": "__top_4t4us_gg_",
24
+ "--top": "--top_4t4us"
25
25
  })
26
26
  );
27
27
  function SvgSparkle(props, ref) {
@@ -2,7 +2,7 @@ SSparkle {
2
2
  position: absolute;
3
3
 
4
4
  & path {
5
- fill: var(--intergalactic-icon-primary-feature-highlight, #8649e1);
5
+ fill: var(--intergalactic-icon-primary-feature-highlight, oklch(0.58 0.254 297.1));
6
6
  }
7
7
  }
8
8
 
@@ -1,8 +1,8 @@
1
- import type { CheckboxContext, CheckboxProps, CheckboxTextProps, CheckboxValueProps } from '@semcore/checkbox';
1
+ import type { NSCheckbox } from '@semcore/checkbox';
2
2
  import type { Intergalactic } from '@semcore/core';
3
3
  import type { AnimatedSparklesProps } from '../../inner-components/sparkle/AnimatedSparkles';
4
- export type HighlightedCheckboxComponent = Intergalactic.Component<'label', CheckboxProps, CheckboxContext> & {
5
- Text: Intergalactic.Component<'span', CheckboxTextProps>;
6
- Value: Intergalactic.Component<'input', CheckboxValueProps>;
4
+ export type HighlightedCheckboxComponent = Intergalactic.Component<'label', NSCheckbox.Props, NSCheckbox.Ctx> & {
5
+ Text: Intergalactic.Component<'span', NSCheckbox.Text.Props>;
6
+ Value: Intergalactic.Component<'input', NSCheckbox.Value.Props>;
7
7
  AnimatedSparkles: Intergalactic.Component<'div', AnimatedSparklesProps>;
8
8
  };
@@ -1,9 +1,9 @@
1
1
  import type { Intergalactic } from '@semcore/core';
2
- import type { RadioCtx, RadioProps, RadioValueProps } from '@semcore/radio';
2
+ import type { NSRadio } from '@semcore/radio';
3
3
  import type { Text } from '@semcore/typography';
4
4
  import type { AnimatedSparklesProps } from '../../inner-components/sparkle/AnimatedSparkles';
5
- export type HighlightedRadioComponent = Intergalactic.Component<'label', RadioProps, RadioCtx> & {
6
- Value: Intergalactic.Component<'input', RadioValueProps>;
5
+ export type HighlightedRadioComponent = Intergalactic.Component<'label', NSRadio.Props, NSRadio.Ctx> & {
6
+ Value: Intergalactic.Component<'input', NSRadio.Value.Props>;
7
7
  Text: typeof Text;
8
8
  AnimatedSparkles: Intergalactic.Component<'div', AnimatedSparklesProps>;
9
9
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/feature-highlight",
3
3
  "description": "Semrush toolkit for accent features",
4
- "version": "17.0.1",
4
+ "version": "17.1.0-prerelease.0",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/esm/index.mjs",
7
7
  "typings": "lib/types/index.d.ts",
@@ -10,27 +10,27 @@
10
10
  "license": "MIT",
11
11
  "exports": {
12
12
  ".": {
13
- "require": "./lib/cjs/index.js",
13
+ "types": "./lib/types/index.d.ts",
14
14
  "import": "./lib/esm/index.mjs",
15
- "types": "./lib/types/index.d.ts"
15
+ "require": "./lib/cjs/index.js"
16
16
  }
17
17
  },
18
18
  "dependencies": {
19
- "@semcore/badge": "^17.0.1",
20
- "@semcore/base-trigger": "^17.0.1",
21
- "@semcore/button": "^17.0.1",
22
- "@semcore/checkbox": "^17.0.1",
23
- "@semcore/input": "^17.0.1",
24
- "@semcore/notice": "^17.0.1",
25
- "@semcore/pills": "^17.0.1",
26
- "@semcore/radio": "^17.0.1",
27
- "@semcore/select": "^17.0.1",
28
- "@semcore/switch": "^17.0.1",
29
- "@semcore/tab-line": "^17.0.1",
30
- "@semcore/typography": "^17.0.1"
19
+ "@semcore/badge": "^17.1.0-prerelease.0",
20
+ "@semcore/base-trigger": "^17.1.0-prerelease.0",
21
+ "@semcore/button": "^17.1.0-prerelease.0",
22
+ "@semcore/checkbox": "^17.1.0-prerelease.0",
23
+ "@semcore/input": "^17.1.0-prerelease.0",
24
+ "@semcore/notice": "^17.1.0-prerelease.0",
25
+ "@semcore/pills": "^17.1.0-prerelease.0",
26
+ "@semcore/radio": "^17.1.0-prerelease.0",
27
+ "@semcore/select": "^17.1.0-prerelease.0",
28
+ "@semcore/switch": "^17.1.0-prerelease.0",
29
+ "@semcore/tab-line": "^17.1.0-prerelease.0",
30
+ "@semcore/typography": "^17.1.0-prerelease.0"
31
31
  },
32
32
  "peerDependencies": {
33
- "@semcore/base-components": "^17.0.1"
33
+ "@semcore/base-components": "^17.0.2"
34
34
  },
35
35
  "repository": {
36
36
  "type": "git",
@@ -38,9 +38,9 @@
38
38
  "directory": "semcore/feature-highlight"
39
39
  },
40
40
  "devDependencies": {
41
- "@semcore/base-components": "17.0.1",
42
- "@semcore/core": "17.0.1",
43
- "@semcore/testing-utils": "1.0.0"
41
+ "@semcore/base-components": "17.0.2-prerelease.0",
42
+ "@semcore/testing-utils": "1.0.0",
43
+ "@semcore/core": "17.1.0-prerelease.0"
44
44
  },
45
45
  "scripts": {
46
46
  "build": "pnpm semcore-builder && pnpm vite build"