@hopper-ui/styled-system 3.1.3 → 3.1.5

package/dist/theme/generated/workleap/light.css

@@ -2,7 +2,14 @@
  * This file is generated by Style Dictionary. Do not edit directly.
  */
 
-.hop-5-1-3-workleap {
+.hop-5-1-5-workleap {
+  --hop-comp-switch-thumb-filter-selected: none;
+  --hop-comp-switch-thumb-filter: none;
+  --hop-comp-switch-track-box-shadow: none;
+  --hop-comp-switch-track-filter: none;
+  --hop-comp-segmented-control-item-box-shadow-disabled: none;
+  --hop-comp-segmented-control-item-box-shadow-selected: none;
+  --hop-comp-segmented-control-box-shadow: none;
   --hop-comp-button-ghost-disabled-border-color: transparent;
   --hop-comp-button-ghost-disabled-background-color: transparent;
   --hop-comp-button-ghost-danger-border-color: transparent;
@@ -345,7 +352,9 @@
   --hop-font-family-tertiary: 'ABC Favorit Mono', Consolas, 'SF Mono', monospace;
   --hop-font-family-secondary: 'Inter', Helvetica, Arial, sans-serif;
   --hop-font-family-primary: 'ABC Favorit', Helvetica, Arial, sans-serif;
-  --hop-shadow-inset-bevel: 0 2px 1px 0 rgba(255, 255, 255, 0.25) inset, 0 -2px 2px 0 rgba(0, 0, 0, 0.25) inset;
+  --hop-shadow-tactility-control: 1.5px 1.5px 1.5px 0 rgba(0, 0, 0, 0.03), -5px -5px 20px 0 rgba(255, 255, 255, 0.2), 0.5px 1.5px 5px 0 rgba(0, 0, 0, 0.1) inset, -2.5px 2.5px 5px 0 rgba(255, 255, 255, 0.5) inset;
+  --hop-shadow-tactility-card: 0 12px 12px 0 rgba(0, 0, 0, 0.05);
+  --hop-shadow-tactility-button: 0 2px 1px 0 rgba(255, 255, 255, 0.25) inset, 0 -2px 2px 0 rgba(0, 0, 0, 0.25) inset;
   --hop-shadow-lg: 0 10px 18px 8px rgba(60, 60, 60, 0.08);
   --hop-shadow-md: 0 4px 10px 4px rgba(60, 60, 60, 0.08);
   --hop-shadow-sm: 0 1px 6px 0 rgba(60, 60, 60, 0.10);
@@ -521,6 +530,8 @@
   --hop-coastal-75: #bae6ff;
   --hop-coastal-50: #d9efff;
   --hop-coastal-25: #f0f8ff;
+  --hop-comp-radio-box-shadow: var(--hop-shadow-none);
+  --hop-comp-checkbox-box-shadow: var(--hop-shadow-none);
   --hop-comp-card-second-level-box-shadow: var(--hop-shadow-none);
   --hop-comp-card-main-box-shadow: var(--hop-shadow-none);
   --hop-comp-button-ghost-danger-box-shadow: var(--hop-shadow-none);
@@ -1234,6 +1245,47 @@
   --hop-space-stack-md: var(--hop-space-160);
   --hop-space-stack-sm: var(--hop-space-80);
   --hop-space-stack-xs: var(--hop-space-40);
+  --hop-comp-mark-indicator-color-error: var(--hop-danger-icon-strong);
+  --hop-comp-mark-indicator-color-disabled: var(--hop-neutral-icon-disabled);
+  --hop-comp-mark-indicator-color: var(--hop-neutral-icon-selected);
+  --hop-comp-mark-border-color-error-focus: var(--hop-danger-border-press);
+  --hop-comp-mark-background-color-error-focus: var(--hop-danger-surface);
+  --hop-comp-mark-background-color-error-press: var(--hop-danger-surface-weak-press);
+  --hop-comp-mark-background-color-error-hover: var(--hop-danger-surface-weak-hover);
+  --hop-comp-mark-border-color-error-press: var(--hop-danger-border-press);
+  --hop-comp-mark-border-color-error: var(--hop-danger-border-strong);
+  --hop-comp-mark-border-color-disabled: var(--hop-neutral-border-disabled);
+  --hop-comp-mark-border-color-focus: var(--hop-primary-border-focus);
+  --hop-comp-mark-border-color-selected: var(--hop-neutral-border-selected);
+  --hop-comp-mark-border-color-press: var(--hop-neutral-border-press);
+  --hop-comp-mark-border-color-hover: var(--hop-neutral-border-hover);
+  --hop-comp-mark-border-color: var(--hop-neutral-border);
+  --hop-comp-mark-background-color-error: var(--hop-danger-surface-strong);
+  --hop-comp-mark-background-color-disabled: var(--hop-neutral-surface-disabled);
+  --hop-comp-mark-background-color-selected: var(--hop-neutral-surface-selected);
+  --hop-comp-mark-background-color-press: var(--hop-neutral-surface-press);
+  --hop-comp-mark-background-color-hover: var(--hop-neutral-surface-hover);
+  --hop-comp-mark-background-color: var(--hop-neutral-surface);
+  --hop-comp-radio-border-radius: var(--hop-shape-circle);
+  --hop-comp-checkbox-border-radius: var(--hop-shape-rounded-sm);
+  --hop-comp-label-icon-color-error-press: var(--hop-danger-icon-weak-press);
+  --hop-comp-label-icon-color-error-hover: var(--hop-danger-icon-weak-hover);
+  --hop-comp-label-icon-color-error: var(--hop-danger-icon-weak);
+  --hop-comp-label-icon-color-focus: var(--hop-neutral-icon-hover);
+  --hop-comp-label-icon-color-disabled: var(--hop-neutral-icon-disabled);
+  --hop-comp-label-icon-color-selected: var(--hop-neutral-icon);
+  --hop-comp-label-icon-color-press: var(--hop-neutral-icon-press);
+  --hop-comp-label-icon-color-hover: var(--hop-neutral-icon-hover);
+  --hop-comp-label-icon-color: var(--hop-neutral-icon);
+  --hop-comp-label-text-color-error-press: var(--hop-danger-text-weak-press);
+  --hop-comp-label-text-color-error-hover: var(--hop-danger-text-weak-hover);
+  --hop-comp-label-text-color-error: var(--hop-danger-text-weak);
+  --hop-comp-label-text-color-focus: var(--hop-neutral-text-hover);
+  --hop-comp-label-text-color-disabled: var(--hop-neutral-text-disabled);
+  --hop-comp-label-text-color-selected: var(--hop-neutral-text);
+  --hop-comp-label-text-color-press: var(--hop-neutral-text-press);
+  --hop-comp-label-text-color-hover: var(--hop-neutral-text-hover);
+  --hop-comp-label-text-color: var(--hop-neutral-text);
   --hop-comp-field-prefill-color: var(--hop-neutral-text-weak);
   --hop-comp-field-placeholder-color: var(--hop-neutral-text-weakest);
   --hop-comp-field-icon-color-disabled: var(--hop-neutral-icon-disabled);
@@ -1255,6 +1307,32 @@
   --hop-comp-select-text-color-hover: var(--hop-neutral-text-hover);
   --hop-comp-select-border-color-active: var(--hop-neutral-border-selected);
   --hop-comp-select-background-color-active: var(--hop-neutral-surface);
+  --hop-comp-control-border-color-error: var(--hop-danger-border-strong);
+  --hop-comp-control-border-color-disabled: var(--hop-neutral-border-disabled);
+  --hop-comp-control-border-color-focus: var(--hop-primary-border-focus);
+  --hop-comp-control-border-color-selected: var(--hop-neutral-border-selected);
+  --hop-comp-control-border-color-press: var(--hop-neutral-border-press);
+  --hop-comp-control-border-color-hover: var(--hop-neutral-border-hover);
+  --hop-comp-control-border-color: var(--hop-neutral-border);
+  --hop-comp-control-background-color-error: var(--hop-danger-surface-strong);
+  --hop-comp-control-background-color-disabled: var(--hop-neutral-surface);
+  --hop-comp-control-background-color-selected: var(--hop-neutral-surface-selected);
+  --hop-comp-control-background-color-press: var(--hop-neutral-surface-press);
+  --hop-comp-control-background-color-hover: var(--hop-neutral-surface-hover);
+  --hop-comp-control-background-color: var(--hop-neutral-surface);
+  --hop-comp-switch-icon-color-disabled: var(--hop-neutral-icon-disabled);
+  --hop-comp-switch-icon-color-selected: var(--hop-neutral-icon-selected);
+  --hop-comp-switch-icon-color-press: var(--hop-neutral-icon-press);
+  --hop-comp-switch-icon-color-hover: var(--hop-neutral-icon-hover);
+  --hop-comp-switch-icon-color: var(--hop-neutral-icon);
+  --hop-comp-switch-background-color-selected: var(--hop-neutral-surface-selected);
+  --hop-comp-switch-border-radius: var(--hop-shape-pill);
+  --hop-comp-segmented-control-item-border-radius: var(--hop-shape-rounded-sm);
+  --hop-comp-segmented-control-icon-color-selected: var(--hop-neutral-icon-selected);
+  --hop-comp-segmented-control-icon-color: var(--hop-neutral-icon);
+  --hop-comp-segmented-control-text-color-selected: var(--hop-neutral-text-selected);
+  --hop-comp-segmented-control-text-color: var(--hop-neutral-text);
+  --hop-comp-segmented-control-border-radius: var(--hop-shape-rounded-md);
   --hop-comp-card-second-level-border-color: var(--hop-neutral-surface-weakest);
   --hop-comp-card-second-level-background-color: var(--hop-neutral-surface-weakest);
   --hop-comp-card-main-border-color: var(--hop-neutral-border-weak);

package/dist/tokens/generated/styledSystemConstants.d.ts

@@ -1,5 +1,5 @@
 declare const HopperRootCssClass = "hop";
-declare const StyledSystemRootCssClass = "hop-5-1-3";
+declare const StyledSystemRootCssClass = "hop-5-1-5";
 declare const HopperVariablePrefix = "--hop";
 type Theme = "sharegate" | "workleap";
 

package/dist/tokens/generated/styledSystemConstants.js

@@ -1,2 +1,2 @@
-export { HopperRootCssClass, HopperVariablePrefix, StyledSystemRootCssClass } from '../../chunk-6GS36OEX.js';
+export { HopperRootCssClass, HopperVariablePrefix, StyledSystemRootCssClass } from '../../chunk-OYD4MUW4.js';
 import '../../chunk-AQ5VUG5P.js';

package/dist/tokens/generated/styledSystemToTokenMappings.d.ts

@@ -991,7 +991,9 @@ declare const Elevation: {
     readonly core_sm: "shadow-sm";
     readonly core_md: "shadow-md";
     readonly core_lg: "shadow-lg";
-    readonly "core_inset-bevel": "shadow-inset-bevel";
+    readonly "core_tactility-button": "shadow-tactility-button";
+    readonly "core_tactility-card": "shadow-tactility-card";
+    readonly "core_tactility-control": "shadow-tactility-control";
     readonly none: "elevation-none";
     readonly raised: "elevation-raised";
     readonly lifted: "elevation-lifted";

package/dist/tokens/generated/styledSystemToTokenMappings.js

@@ -1,2 +1,2 @@
-export { BackgroundColors, BorderColors, CoreSpace, DataVizColors, Elevation, FontFamily, FontOffset, FontSize, FontWeight, HopperColors, IconColors, LineHeight, Motions, SemanticComplexMarginSpace, SemanticComplexPaddingSpace, SemanticSimpleMarginSpace, SemanticSimplePaddingSpace, Shape, TextColors } from '../../chunk-LMCQIGNN.js';
+export { BackgroundColors, BorderColors, CoreSpace, DataVizColors, Elevation, FontFamily, FontOffset, FontSize, FontWeight, HopperColors, IconColors, LineHeight, Motions, SemanticComplexMarginSpace, SemanticComplexPaddingSpace, SemanticSimpleMarginSpace, SemanticSimplePaddingSpace, Shape, TextColors } from '../../chunk-J7KRNWQE.js';
 import '../../chunk-AQ5VUG5P.js';

package/dist/tokens/tokenMappings.d.ts

@@ -2831,7 +2831,7 @@ declare const IconColorMapping: {
     "success-weakest": string;
     "warning-weakest": string;
 };
-declare const BoxShadowMapping: Record<"none" | "core_none" | "core_sm" | "core_md" | "core_lg" | "core_inset-bevel" | "raised" | "lifted" | "floating", string>;
+declare const BoxShadowMapping: Record<"none" | "core_none" | "core_sm" | "core_md" | "core_lg" | "core_tactility-button" | "core_tactility-card" | "core_tactility-control" | "raised" | "lifted" | "floating", string>;
 declare const FontSizeMapping: Record<"core_160" | "core_240" | "core_320" | "core_480" | "heading-3xl" | "heading-2xl" | "heading-xl" | "heading-lg" | "heading-md" | "heading-sm" | "heading-xs" | "heading-xs-medium" | "overline" | "body-2xl" | "body-xl" | "body-lg" | "body-lg-medium" | "body-lg-semibold" | "body-lg-bold" | "body-lg-underline" | "body-md" | "body-md-medium" | "body-md-semibold" | "body-md-bold" | "body-md-underline" | "body-sm" | "body-sm-medium" | "body-sm-semibold" | "body-sm-bold" | "body-sm-underline" | "body-xs" | "body-xs-medium" | "body-xs-semibold" | "body-xs-bold" | "body-xs-underline" | "accent-lg" | "accent-sm" | "core_120" | "core_140" | "core_180" | "core_200" | "core_280" | "core_360", string>;
 declare const FontWeightMapping: Record<"core_400" | "heading-3xl" | "heading-2xl" | "heading-xl" | "heading-lg" | "heading-md" | "heading-sm" | "heading-xs" | "heading-xs-medium" | "overline" | "body-2xl" | "body-xl" | "body-lg" | "body-lg-medium" | "body-lg-semibold" | "body-lg-bold" | "body-lg-underline" | "body-md" | "body-md-medium" | "body-md-semibold" | "body-md-bold" | "body-md-underline" | "body-sm" | "body-sm-medium" | "body-sm-semibold" | "body-sm-bold" | "body-sm-underline" | "body-xs" | "body-xs-medium" | "body-xs-semibold" | "body-xs-bold" | "body-xs-underline" | "accent-lg" | "accent-sm" | "core_410" | "core_505" | "core_580" | "core_590" | "core_680" | "core_690", string>;
 declare const LineHeightMapping: Record<"heading-3xl" | "heading-2xl" | "heading-xl" | "heading-lg" | "heading-md" | "heading-sm" | "heading-xs" | "heading-xs-medium" | "overline" | "body-2xl" | "body-xl" | "body-lg" | "body-lg-medium" | "body-lg-semibold" | "body-lg-bold" | "body-lg-underline" | "body-md" | "body-md-medium" | "body-md-semibold" | "body-md-bold" | "body-md-underline" | "body-sm" | "body-sm-medium" | "body-sm-semibold" | "body-sm-bold" | "body-sm-underline" | "body-xs" | "body-xs-medium" | "body-xs-semibold" | "body-xs-bold" | "body-xs-underline" | "accent-lg" | "accent-sm" | "core_1-125" | "core_1-14" | "core_1-20" | "core_1-25" | "core_1-33" | "core_1-4285" | "core_1-50", string>;

package/dist/tokens/tokenMappings.js

@@ -1,8 +1,8 @@
-export { BackgroundColorMapping, BorderMapping, BorderRadiusMapping, BoxShadowMapping, ColorExpressionTypes, ColorMapping, ComplexMarginMapping, ComplexPaddingMapping, DataVizColorMapping, DefaultBorderWidthAndStyle, DefaultOutlineWidthAndStyle, FontFamilyMapping, FontSizeMapping, FontWeightMapping, IconColorMapping, LineHeightMapping, OutlineMapping, SimpleMarginMapping, SimplePaddingMapping, SizingMapping, SpaceMapping, TextColorMapping, getSizingValue, getSystemValue, parseResponsiveSystemValue } from '../chunk-4YFSACW6.js';
-import '../chunk-LMCQIGNN.js';
+export { BackgroundColorMapping, BorderMapping, BorderRadiusMapping, BoxShadowMapping, ColorExpressionTypes, ColorMapping, ComplexMarginMapping, ComplexPaddingMapping, DataVizColorMapping, DefaultBorderWidthAndStyle, DefaultOutlineWidthAndStyle, FontFamilyMapping, FontSizeMapping, FontWeightMapping, IconColorMapping, LineHeightMapping, OutlineMapping, SimpleMarginMapping, SimplePaddingMapping, SizingMapping, SpaceMapping, TextColorMapping, getSizingValue, getSystemValue, parseResponsiveSystemValue } from '../chunk-K73UXYAA.js';
+import '../chunk-J7KRNWQE.js';
 import '../chunk-FTYK7Z7Q.js';
 import '../chunk-U5R6ZXH3.js';
 import '../chunk-VBKLISDI.js';
 import '../chunk-XUHDFZZL.js';
-import '../chunk-6GS36OEX.js';
+import '../chunk-OYD4MUW4.js';
 import '../chunk-AQ5VUG5P.js';

package/dist/useStyledSystem.css

@@ -1,125 +1,125 @@
 /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/styled-system/src/UseStyledSystem.module.css/#css-module-data */
-.UseStyledSystem-module__hop-b-hover___7UYnl:hover {
+.UseStyledSystem-module__hop-b-hover___JbPD9:hover {
   --hop-b-hover: initial;
   border: var(--hop-b-hover) !important;
 }
-.UseStyledSystem-module__hop-bb-hover___VFe-p:hover {
+.UseStyledSystem-module__hop-bb-hover___ZNZIs:hover {
   --hop-bb-hover: initial;
   border-bottom: var(--hop-bb-hover) !important;
 }
-.UseStyledSystem-module__hop-bl-hover___2hEx8:hover {
+.UseStyledSystem-module__hop-bl-hover___Cxgiy:hover {
   --hop-bl-hover: initial;
   border-left: var(--hop-bl-hover) !important;
 }
-.UseStyledSystem-module__hop-br-hover___bhZSx:hover {
+.UseStyledSystem-module__hop-br-hover___KSMwR:hover {
   --hop-br-hover: initial;
   border-right: var(--hop-br-hover) !important;
 }
-.UseStyledSystem-module__hop-bt-hover___xvVmw:hover {
+.UseStyledSystem-module__hop-bt-hover___GkQgc:hover {
   --hop-bt-hover: initial;
   border-top: var(--hop-bt-hover) !important;
 }
-.UseStyledSystem-module__hop-b-focus___amXV7:focus-visible {
+.UseStyledSystem-module__hop-b-focus___qwSk2:focus-visible {
   --hop-b-focus: initial;
   border: var(--hop-b-focus) !important;
 }
-.UseStyledSystem-module__hop-bb-focus___EKGLM:focus-visible {
+.UseStyledSystem-module__hop-bb-focus___GDdZH:focus-visible {
   --hop-bb-focus: initial;
   border-bottom: var(--hop-bb-focus) !important;
 }
-.UseStyledSystem-module__hop-bl-focus___GGhCs:focus-visible {
+.UseStyledSystem-module__hop-bl-focus___oZPQM:focus-visible {
   --hop-bl-focus: initial;
   border-left: var(--hop-bl-focus) !important;
 }
-.UseStyledSystem-module__hop-br-focus___OLvow:focus-visible {
+.UseStyledSystem-module__hop-br-focus___pHZT9:focus-visible {
   --hop-br-focus: initial;
   border-right: var(--hop-br-focus) !important;
 }
-.UseStyledSystem-module__hop-bt-focus___U-7xq:focus-visible {
+.UseStyledSystem-module__hop-bt-focus___luqF5:focus-visible {
   --hop-bt-focus: initial;
   border-top: var(--hop-bt-focus) !important;
 }
-.UseStyledSystem-module__hop-b-active___Ig-pe:active {
+.UseStyledSystem-module__hop-b-active___GIaBd:active {
   --hop-b-active: initial;
   border: var(--hop-b-active) !important;
 }
-.UseStyledSystem-module__hop-bb-active___TANtl:active {
+.UseStyledSystem-module__hop-bb-active___aaiZB:active {
   --hop-bb-active: initial;
   border-bottom: var(--hop-bb-active) !important;
 }
-.UseStyledSystem-module__hop-bl-active___2jpqi:active {
+.UseStyledSystem-module__hop-bl-active___pR4b6:active {
   --hop-bl-active: initial;
   border-left: var(--hop-bl-active) !important;
 }
-.UseStyledSystem-module__hop-br-active___lKucv:active {
+.UseStyledSystem-module__hop-br-active___NU1TR:active {
   --hop-br-active: initial;
   border-right: var(--hop-br-active) !important;
 }
-.UseStyledSystem-module__hop-bt-active___NjTOr:active {
+.UseStyledSystem-module__hop-bt-active___JJr00:active {
   --hop-bt-active: initial;
   border-top: var(--hop-bt-active) !important;
 }
-.UseStyledSystem-module__hop-bg-hover___uaPPv:hover {
+.UseStyledSystem-module__hop-bg-hover___ZWN81:hover {
   --hop-bg-hover: initial;
   background-color: var(--hop-bg-hover) !important;
 }
-.UseStyledSystem-module__hop-bg-focus___5LL2V:focus-visible {
+.UseStyledSystem-module__hop-bg-focus___-AjM1:focus-visible {
   --hop-bg-focus: initial;
   background-color: var(--hop-bg-focus) !important;
 }
-.UseStyledSystem-module__hop-bg-active___cWUnb:active {
+.UseStyledSystem-module__hop-bg-active___u3W0-:active {
   --hop-bg-active: initial;
   background-color: var(--hop-bg-active) !important;
 }
-.UseStyledSystem-module__hop-bs-hover___wKXdo:hover {
+.UseStyledSystem-module__hop-bs-hover___KMVTR:hover {
   --hop-bs-hover: initial;
   box-shadow: var(--hop-bs-hover) !important;
 }
-.UseStyledSystem-module__hop-bs-focus___w-oVC:focus-visible {
+.UseStyledSystem-module__hop-bs-focus___CXTRf:focus-visible {
   --hop-bs-focus: initial;
   box-shadow: var(--hop-bs-focus) !important;
 }
-.UseStyledSystem-module__hop-bs-active___xSSTV:active {
+.UseStyledSystem-module__hop-bs-active___xIuFh:active {
   --hop-bs-active: initial;
   box-shadow: var(--hop-bs-active) !important;
 }
-.UseStyledSystem-module__hop-c-hover___s2N6i:hover {
+.UseStyledSystem-module__hop-c-hover___GTTlF:hover {
   --hop-c-hover: initial;
   color: var(--hop-c-hover) !important;
 }
-.UseStyledSystem-module__hop-c-focus___vLJLj:focus-visible {
+.UseStyledSystem-module__hop-c-focus___W7fXj:focus-visible {
   --hop-c-focus: initial;
   color: var(--hop-c-focus) !important;
 }
-.UseStyledSystem-module__hop-c-active___xKbby:active {
+.UseStyledSystem-module__hop-c-active___D442p:active {
   --hop-c-active: initial;
   color: var(--hop-c-active) !important;
 }
-.UseStyledSystem-module__hop-cs-hover___L3S-l:hover {
+.UseStyledSystem-module__hop-cs-hover___rUkdT:hover {
   --hop-cs-hover: initial;
   cursor: var(--hop-cs-hover) !important;
 }
-.UseStyledSystem-module__hop-f-hover___-TCRu:hover {
+.UseStyledSystem-module__hop-f-hover___y-NrN:hover {
   --hop-f-hover: initial;
   fill: var(--hop-f-hover) !important;
 }
-.UseStyledSystem-module__hop-f-focus___CyUOu:focus-visible {
+.UseStyledSystem-module__hop-f-focus___ihuXm:focus-visible {
   --hop-f-focus: initial;
   fill: var(--hop-f-focus) !important;
 }
-.UseStyledSystem-module__hop-o-hover___RScKv:hover {
+.UseStyledSystem-module__hop-o-hover___dx-7-:hover {
   --hop-o-hover: initial;
   opacity: var(--hop-o-hover) !important;
 }
-.UseStyledSystem-module__hop-o-focus___Fpq28:focus-visible {
+.UseStyledSystem-module__hop-o-focus___VW2dA:focus-visible {
   --hop-o-focus: initial;
   opacity: var(--hop-o-focus) !important;
 }
-.UseStyledSystem-module__hop-o-active___hjJJO:active {
+.UseStyledSystem-module__hop-o-active___S0v69:active {
   --hop-o-active: initial;
   opacity: var(--hop-o-active) !important;
 }
-.UseStyledSystem-module__hop-ol-focus___-DVPc:focus-visible {
+.UseStyledSystem-module__hop-ol-focus___bhpWn:focus-visible {
   --hop-ol-focus: initial;
   outline: var(--hop-ol-focus) !important;
 }

package/dist/useStyledSystem.js

@@ -1,10 +1,10 @@
-export { isStyledSystemProp, useStyledSystem } from './chunk-ETK4HNMY.js';
-import './chunk-4YFSACW6.js';
-import './chunk-LMCQIGNN.js';
+export { isStyledSystemProp, useStyledSystem } from './chunk-UC6WKY7Q.js';
+import './chunk-K73UXYAA.js';
+import './chunk-J7KRNWQE.js';
 import './chunk-FTYK7Z7Q.js';
 import './chunk-U5R6ZXH3.js';
 import './chunk-VBKLISDI.js';
 import './chunk-XUHDFZZL.js';
 import './chunk-QMDDVBCZ.js';
-import './chunk-6GS36OEX.js';
+import './chunk-OYD4MUW4.js';
 import './chunk-AQ5VUG5P.js';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hopper-ui/styled-system",
   "author": "Workleap",
-  "version": "3.1.3",
+  "version": "3.1.5",
   "description": "The styled-system package.",
   "license": "Apache-2.0",
   "repository": {
@@ -74,7 +74,7 @@
     "tsup": "8.5.0",
     "typescript": "5.5.4",
     "typescript-eslint": "8.46.2",
-    "@hopper-ui/tokens": "5.1.3"
+    "@hopper-ui/tokens": "5.1.5"
   },
   "scripts": {
     "dev": "tsup --config ./tsup.dev.ts",