@hopper-ui/styled-system 2.5.8 → 2.5.9

package/dist/tokens/tokenMappings.d.ts

@@ -1,4 +1,4 @@
-import { Globals, DataType, Property } from 'csstype';
+import { Property, Globals, DataType } from 'csstype';
 import { Breakpoint } from '../responsive/Breakpoints.js';
 import { ResponsiveProp } from '../responsive/useResponsiveValue.js';
 
@@ -2150,39 +2150,39 @@ declare const IconColorMapping: {
     "success-weakest": string;
     "warning-weakest": string;
 };
-declare const BoxShadowMapping: Record<"none" | "core_none" | "core_sm" | "core_md" | "core_lg" | "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 BoxShadowMapping: Record<"core_none" | "core_sm" | "core_md" | "core_lg" | "none" | "raised" | "lifted" | "floating", string>;
+declare const FontSizeMapping: Record<"core_120" | "core_140" | "core_160" | "core_180" | "core_200" | "core_240" | "core_280" | "core_320" | "core_360" | "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", string>;
+declare const FontWeightMapping: 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_400" | "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>;
-declare const FontFamilyMapping: Record<"core_primary" | "core_secondary" | "core_tertiary" | "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", string>;
-declare const BorderRadiusMapping: Record<"circle" | "core_0" | "core_1" | "core_2" | "core_3" | "core_4" | "core_9999" | "pill" | "rounded-lg" | "rounded-md" | "rounded-sm", string>;
+declare const FontFamilyMapping: 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_primary" | "core_secondary" | "core_tertiary", string>;
+declare const BorderRadiusMapping: Record<"core_0" | "core_1" | "core_2" | "core_3" | "core_4" | "core_9999" | "circle" | "pill" | "rounded-lg" | "rounded-md" | "rounded-sm", string>;
 declare const SpaceMapping: {
+    core_160: string;
+    core_240: string;
+    core_320: string;
+    core_480: string;
+    core_400: string;
     core_0: string;
     core_10: string;
     core_20: string;
     core_40: string;
     core_80: string;
-    core_160: string;
-    core_240: string;
-    core_320: string;
-    core_400: string;
-    core_480: string;
     core_640: string;
     core_800: string;
     core_960: string;
     core_1280: string;
 };
 declare const SimplePaddingMapping: {
+    core_160: string;
+    core_240: string;
+    core_320: string;
+    core_480: string;
+    core_400: string;
     core_0: string;
     core_10: string;
     core_20: string;
     core_40: string;
     core_80: string;
-    core_160: string;
-    core_240: string;
-    core_320: string;
-    core_400: string;
-    core_480: string;
     core_640: string;
     core_800: string;
     core_960: string;
@@ -2200,16 +2200,16 @@ declare const ComplexPaddingMapping: {
     "inset-stretch-sm": string;
     "inset-stretch-md": string;
     "inset-stretch-lg": string;
+    core_160: string;
+    core_240: string;
+    core_320: string;
+    core_480: string;
+    core_400: string;
     core_0: string;
     core_10: string;
     core_20: string;
     core_40: string;
     core_80: string;
-    core_160: string;
-    core_240: string;
-    core_320: string;
-    core_400: string;
-    core_480: string;
     core_640: string;
     core_800: string;
     core_960: string;
@@ -2221,16 +2221,16 @@ declare const ComplexPaddingMapping: {
     "inset-xl": string;
 };
 declare const SimpleMarginMapping: {
+    core_160: string;
+    core_240: string;
+    core_320: string;
+    core_480: string;
+    core_400: string;
     core_0: string;
     core_10: string;
     core_20: string;
     core_40: string;
     core_80: string;
-    core_160: string;
-    core_240: string;
-    core_320: string;
-    core_400: string;
-    core_480: string;
     core_640: string;
     core_800: string;
     core_960: string;
@@ -2247,16 +2247,16 @@ declare const SimpleMarginMapping: {
     "inline-xl": string;
 };
 declare const ComplexMarginMapping: {
+    core_160: string;
+    core_240: string;
+    core_320: string;
+    core_480: string;
+    core_400: string;
     core_0: string;
     core_10: string;
     core_20: string;
     core_40: string;
     core_80: string;
-    core_160: string;
-    core_240: string;
-    core_320: string;
-    core_400: string;
-    core_480: string;
     core_640: string;
     core_800: string;
     core_960: string;
@@ -2296,16 +2296,16 @@ declare const SizingMapping: {
     "3/6": string;
     "4/6": string;
     "5/6": string;
+    core_160: string;
+    core_240: string;
+    core_320: string;
+    core_480: string;
+    core_400: string;
     core_0: string;
     core_10: string;
     core_20: string;
     core_40: string;
     core_80: string;
-    core_160: string;
-    core_240: string;
-    core_320: string;
-    core_400: string;
-    core_480: string;
     core_640: string;
     core_800: string;
     core_960: string;

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___X67pb:hover {
+.UseStyledSystem-module__hop-b-hover___-uv5U:hover {
   --hop-b-hover: initial;
   border: var(--hop-b-hover) !important;
 }
-.UseStyledSystem-module__hop-bb-hover___MfJWq:hover {
+.UseStyledSystem-module__hop-bb-hover___Nw9pk:hover {
   --hop-bb-hover: initial;
   border-bottom: var(--hop-bb-hover) !important;
 }
-.UseStyledSystem-module__hop-bl-hover___nWtAM:hover {
+.UseStyledSystem-module__hop-bl-hover___ScFa8:hover {
   --hop-bl-hover: initial;
   border-left: var(--hop-bl-hover) !important;
 }
-.UseStyledSystem-module__hop-br-hover___BXYMY:hover {
+.UseStyledSystem-module__hop-br-hover___nyZRP:hover {
   --hop-br-hover: initial;
   border-right: var(--hop-br-hover) !important;
 }
-.UseStyledSystem-module__hop-bt-hover___mUbSk:hover {
+.UseStyledSystem-module__hop-bt-hover___mIvCc:hover {
   --hop-bt-hover: initial;
   border-top: var(--hop-bt-hover) !important;
 }
-.UseStyledSystem-module__hop-b-focus___aP7Oi:focus-visible {
+.UseStyledSystem-module__hop-b-focus___QVDv2:focus-visible {
   --hop-b-focus: initial;
   border: var(--hop-b-focus) !important;
 }
-.UseStyledSystem-module__hop-bb-focus___XF9lp:focus-visible {
+.UseStyledSystem-module__hop-bb-focus___2wtGI:focus-visible {
   --hop-bb-focus: initial;
   border-bottom: var(--hop-bb-focus) !important;
 }
-.UseStyledSystem-module__hop-bl-focus___aJJ2P:focus-visible {
+.UseStyledSystem-module__hop-bl-focus___DdQyO:focus-visible {
   --hop-bl-focus: initial;
   border-left: var(--hop-bl-focus) !important;
 }
-.UseStyledSystem-module__hop-br-focus___gES2N:focus-visible {
+.UseStyledSystem-module__hop-br-focus___l6hbv:focus-visible {
   --hop-br-focus: initial;
   border-right: var(--hop-br-focus) !important;
 }
-.UseStyledSystem-module__hop-bt-focus___0n1z3:focus-visible {
+.UseStyledSystem-module__hop-bt-focus___lIHzR:focus-visible {
   --hop-bt-focus: initial;
   border-top: var(--hop-bt-focus) !important;
 }
-.UseStyledSystem-module__hop-b-active___kOfhP:active {
+.UseStyledSystem-module__hop-b-active___FX491:active {
   --hop-b-active: initial;
   border: var(--hop-b-active) !important;
 }
-.UseStyledSystem-module__hop-bb-active___Oy6gA:active {
+.UseStyledSystem-module__hop-bb-active___3p2de:active {
   --hop-bb-active: initial;
   border-bottom: var(--hop-bb-active) !important;
 }
-.UseStyledSystem-module__hop-bl-active___NH4P7:active {
+.UseStyledSystem-module__hop-bl-active___bD5ln:active {
   --hop-bl-active: initial;
   border-left: var(--hop-bl-active) !important;
 }
-.UseStyledSystem-module__hop-br-active___qU8SO:active {
+.UseStyledSystem-module__hop-br-active___Z2w-2:active {
   --hop-br-active: initial;
   border-right: var(--hop-br-active) !important;
 }
-.UseStyledSystem-module__hop-bt-active___G3GT0:active {
+.UseStyledSystem-module__hop-bt-active___cXrGo:active {
   --hop-bt-active: initial;
   border-top: var(--hop-bt-active) !important;
 }
-.UseStyledSystem-module__hop-bg-hover___DUwk1:hover {
+.UseStyledSystem-module__hop-bg-hover___IM2SP:hover {
   --hop-bg-hover: initial;
   background-color: var(--hop-bg-hover) !important;
 }
-.UseStyledSystem-module__hop-bg-focus___VU-3I:focus-visible {
+.UseStyledSystem-module__hop-bg-focus___-8NKC:focus-visible {
   --hop-bg-focus: initial;
   background-color: var(--hop-bg-focus) !important;
 }
-.UseStyledSystem-module__hop-bg-active___idxA4:active {
+.UseStyledSystem-module__hop-bg-active___PbRjo:active {
   --hop-bg-active: initial;
   background-color: var(--hop-bg-active) !important;
 }
-.UseStyledSystem-module__hop-bs-hover___9ubu-:hover {
+.UseStyledSystem-module__hop-bs-hover___uRazj:hover {
   --hop-bs-hover: initial;
   box-shadow: var(--hop-bs-hover) !important;
 }
-.UseStyledSystem-module__hop-bs-focus___k3hRq:focus-visible {
+.UseStyledSystem-module__hop-bs-focus___WPb5b:focus-visible {
   --hop-bs-focus: initial;
   box-shadow: var(--hop-bs-focus) !important;
 }
-.UseStyledSystem-module__hop-bs-active___87-J6:active {
+.UseStyledSystem-module__hop-bs-active___d-Ztc:active {
   --hop-bs-active: initial;
   box-shadow: var(--hop-bs-active) !important;
 }
-.UseStyledSystem-module__hop-c-hover___4ibV3:hover {
+.UseStyledSystem-module__hop-c-hover___jWw7H:hover {
   --hop-c-hover: initial;
   color: var(--hop-c-hover) !important;
 }
-.UseStyledSystem-module__hop-c-focus___a6fcM:focus-visible {
+.UseStyledSystem-module__hop-c-focus___Y1k28:focus-visible {
   --hop-c-focus: initial;
   color: var(--hop-c-focus) !important;
 }
-.UseStyledSystem-module__hop-c-active___76Xn2:active {
+.UseStyledSystem-module__hop-c-active___9usqR:active {
   --hop-c-active: initial;
   color: var(--hop-c-active) !important;
 }
-.UseStyledSystem-module__hop-cs-hover___aMCvn:hover {
+.UseStyledSystem-module__hop-cs-hover___1iWyj:hover {
   --hop-cs-hover: initial;
   cursor: var(--hop-cs-hover) !important;
 }
-.UseStyledSystem-module__hop-f-hover___z6hl5:hover {
+.UseStyledSystem-module__hop-f-hover___G8m3j:hover {
   --hop-f-hover: initial;
   fill: var(--hop-f-hover) !important;
 }
-.UseStyledSystem-module__hop-f-focus___Y71R2:focus-visible {
+.UseStyledSystem-module__hop-f-focus___S7xBy:focus-visible {
   --hop-f-focus: initial;
   fill: var(--hop-f-focus) !important;
 }
-.UseStyledSystem-module__hop-o-hover___FtsIM:hover {
+.UseStyledSystem-module__hop-o-hover___TuFfD:hover {
   --hop-o-hover: initial;
   opacity: var(--hop-o-hover) !important;
 }
-.UseStyledSystem-module__hop-o-focus___7KGdn:focus-visible {
+.UseStyledSystem-module__hop-o-focus___CYGDn:focus-visible {
   --hop-o-focus: initial;
   opacity: var(--hop-o-focus) !important;
 }
-.UseStyledSystem-module__hop-o-active___DiuAQ:active {
+.UseStyledSystem-module__hop-o-active___z5Riy:active {
   --hop-o-active: initial;
   opacity: var(--hop-o-active) !important;
 }
-.UseStyledSystem-module__hop-ol-focus___ScZWG:focus-visible {
+.UseStyledSystem-module__hop-ol-focus___-9JTf:focus-visible {
   --hop-ol-focus: initial;
   color: var(--hop-ol-focus) !important;
 }

package/dist/useStyledSystem.d.ts

@@ -1,12 +1,13 @@
 import { CSSProperties } from 'react';
 import { Breakpoint } from './responsive/Breakpoints.js';
 import { ResponsiveProp } from './responsive/useResponsiveValue.js';
-import { StyledSystemProps } from './styledSystemProps.js';
+import { StyledSystemProps, UnsafeStyledSystemProps } from './styledSystemProps.js';
 import 'csstype';
 import './tokens/tokenMappings.js';
 
 type PropHandler = (name: string, value: ResponsiveProp<string | number | string[]>, context: StylingContext) => void;
-declare const PropsHandlers: Record<string, PropHandler>;
+type PropsHandlersKey = keyof Omit<StyledSystemProps, keyof UnsafeStyledSystemProps>;
+declare const PropsHandlers: Record<PropsHandlersKey, PropHandler>;
 declare function isStyledSystemProp(name: string): name is keyof typeof PropsHandlers;
 declare class StylingContext {
     #private;

package/dist/useStyledSystem.js

@@ -1,4 +1,4 @@
-export { isStyledSystemProp, useStyledSystem } from './chunk-KJNJQLNN.js';
+export { isStyledSystemProp, useStyledSystem } from './chunk-VQE64NVW.js';
 import './chunk-7TNCJ3OQ.js';
 import './chunk-MSH55T2T.js';
 import './chunk-SFOVKOPG.js';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hopper-ui/styled-system",
   "author": "Workleap",
-  "version": "2.5.8",
+  "version": "2.5.9",
   "description": "The styled-system package.",
   "license": "Apache-2.0",
   "repository": {