@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/utils/hooks/useCSSVariables/constants.js

@@ -1 +1,321 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.baseTokens=void 0;const baseTokens=exports.baseTokens={base:{"size-12a":"4.5rem","size-13a":"7.5rem","size-16a":"12.5rem","size-full":"100%","size-0":"0rem","size-1":"0.125rem","size-2":"0.25rem","size-3":"0.5rem","size-4":"0.75rem","size-5":"1rem","size-6":"1.25rem","size-7":"1.5rem","size-8":"2rem","size-9":"2.5rem","size-10":"3rem","size-11":"3.5rem","size-12":"4rem","size-13":"6rem","size-14":"8rem","size-15":"10rem","size-16":"12rem","size-17":"14rem","size-18":"16rem","size-19":"20rem","spacing-0":"0rem","spacing-1":"0.125rem","spacing-2":"0.25rem","spacing-3":"0.5rem","spacing-4":"0.75rem","spacing-5":"1rem","spacing-6":"1.25rem","spacing-7":"1.5rem","spacing-8":"2rem","spacing-9":"2.5rem","spacing-10":"3rem","spacing-11":"3.5rem","spacing-12":"4rem","spacing-13":"6rem","spacing-14":"8rem","font-family":"Inter","font-size-100":"0.625rem","font-size-200":"0.75rem","font-size-300":"0.875rem","font-size-400":"1rem","font-size-500":"1.125rem","font-size-600":"1.25rem","font-size-650":"1.375rem","font-size-700":"1.5rem","font-size-800":"1.875rem","font-size-900":"2.5rem","font-size-1000":"3rem","font-size-1100":"4rem","font-weight-100":"100","font-weight-200":"200","font-weight-300":"300","font-weight-400":"400","font-weight-500":"500","font-weight-600":"600","font-weight-700":"700","font-weight-800":"800","font-weight-900":"900","font-lh-100":"1","font-lh-120":"1.2","font-lh-140":"1.4","font-lh-150":"1.5","font-lh-170":"1.7","legacy-font-lh-full":"100%","legacy-font-lh-100":"1.125rem","legacy-font-lh-120":"1.25rem","legacy-font-lh-140":"1.375rem","radius-100":"4px","radius-200":"8px","radius-300":"12px","radius-400":"16px","radius-500":"24px","radius-full":"9999px"},semantic:{"padding-3xs":"spacing-1","padding-2xs":"spacing-2","padding-xs":"spacing-3","padding-sm":"spacing-4","padding-md":"spacing-5","padding-lg":"spacing-7","padding-xl":"spacing-8","padding-2xl":"spacing-9","gap-2xs":"spacing-1","gap-xs":"spacing-2","gap-sm":"spacing-3","gap-md":"spacing-4","gap-lg":"spacing-5","gap-xl":"spacing-7","gap-2xl":"spacing-8","gap-3xl":"spacing-9","font-heading-size-1":"font-size-700","font-heading-size-2":"font-size-650","font-heading-size-3":"font-size-600","font-heading-size-4":"font-size-500","font-heading-size-5":"font-size-400","font-heading-size-6":"font-size-500","font-body-size-xs":"font-size-100","font-body-size-sm":"font-size-200","font-body-size-md":"font-size-300","font-body-size-lg":"font-size-400","font-metric-size-sm":"font-size-300","font-metric-size-md":"font-size-400","font-metric-size-lg":"font-size-500","font-action-size-sm":"font-size-200","font-action-size-md":"font-size-300","font-label-size-sm":"font-size-200","font-label-size-md":"font-size-300","font-weight-thin":"font-weight-100","font-weight-extralight":"font-weight-200","font-weight-light":"font-weight-300","font-weight-regular":"font-weight-400","font-weight-medium":"font-weight-500","font-weight-semibold":"font-weight-600","font-weight-bold":"font-weight-700","font-weight-extrabold":"font-weight-800","font-weight-black":"font-weight-900","font-lh-reset":"font-lh-100","font-lh-heading":"font-lh-120","font-lh-subheading":"font-lh-140","font-lh-body":"font-lh-140","font-lh-caption":"font-lh-170","legacy-font-lh-small":"legacy-font-lh-120","legacy-font-lh-xsmall":"legacy-font-lh-100","size-control-2xs":"size-5","size-control-xs":"size-7","size-control-sm":"size-8","size-control-md":"size-9","size-control-lg":"size-10","size-control-xl":"size-11","size-control-2xl":"size-12","size-control-3xl":"size-13","size-control-4xl":"size-13a","size-brand-logo-2xs":"size-11","size-brand-logo-xs":"size-12a","size-brand-logo-sm":"size-13a","size-brand-logo-md":"size-15","size-brand-logo-lg":"size-16a","size-icon-3xs":"size-4","size-icon-2xs":"size-5","size-icon-xs":"size-6","size-icon-md":"size-7","size-icon-lg":"size-8","size-icon-xl":"size-10","size-layout-3xs":"size-11","size-layout-2xs":"size-12","size-layout-sm":"size-15","size-layout-md":"size-18","size-layout-lg":"size-19","size-overlay-sm":"size-14","size-overlay-md":"size-16","size-overlay-lg":"size-18","size-overlay-xl":"size-19","size-overlay-2xl":"size-21","size-overlay-3xl":"size-23","size-overlay-full":"size-full","size-input-height-sm":"size-9","size-input-height-md":"size-10","size-input-padding-y":"spacing-3","size-input-padding-x":"spacing-5","size-input-gap":"spacing-5","size-input-radius":"radius-100","font-input-size":"font-size-400","size-input-icon":"size-6","radius-sm":"radius-100","radius-md":"radius-200","radius-lg":"radius-300","radius-xl":"radius-500"},component:{"UT-banner-buttons-gap":"gap-sm","UT-banner-gap-lg":"gap-xl","UT-banner-gap-md":"gap-lg","UT-banner-gap-sm":"gap-sm","UT-banner-icon-gap":"gap-md","UT-banner-icon-size-lg":"size-icon-md","UT-banner-icon-size-sm":"size-icon-xs","UT-banner-padding-lg":"padding-lg","UT-banner-padding-md":"padding-md","UT-banner-padding-x-sm":"padding-sm","UT-banner-padding-y-sm":"padding-xs","UT-banner-radius":"radius-md","UT-banner-text-gap":"gap-sm","UT-button-height-sm":"size-control-sm","UT-button-height-md":"size-control-md","UT-button-height-lg":"size-control-lg","UT-button-padding-xs":"padding-2xs","UT-button-padding-sm":"padding-xs","UT-button-padding-md":"padding-sm","UT-button-padding-lg":"padding-md","UT-button-gap-sm":"gap-xs","UT-button-gap-md":"gap-sm","UT-button-label-size":"font-label-size-md","UT-button-label-weight":"font-weight-600","UT-button-label-lh":"font-lh-reset","UT-button-radius":"radius-sm","UT-button-icon-size-sm":"size-icon-xs","UT-button-icon-size-md":"size-icon-md","UT-buttonGroup-padding":"padding-2xs","UT-buttonGroup-radius":"radius-md","UT-label-size-title-1":"font-heading-size-1","UT-label-size-title-2":"font-heading-size-2","UT-label-size-title-3":"font-heading-size-3","UT-label-size-subtitle-1":"font-heading-size-4","UT-label-size-subtitle-2":"font-heading-size-5","UT-label-size-body":"font-body-size-lg","UT-label-size-small":"font-body-size-md","UT-label-size-xsmall":"font-body-size-sm","UT-label-lh-heading":"font-lh-heading","UT-label-lh-subheading":"font-lh-subheading","UT-label-lh-body":"font-lh-body","UT-label-lh-small":"font-lh-140","UT-label-lh-xsmall":"font-lh-150","UT-label-weight-thin":"font-weight-thin","UT-label-weight-extralight":"font-weight-extralight","UT-label-weight-light":"font-weight-light","UT-label-weight-regular":"font-weight-regular","UT-label-weight-medium":"font-weight-medium","UT-label-weight-semibold":"font-weight-semibold","UT-label-weight-bold":"font-weight-bold","UT-label-weight-extrabold":"font-weight-extrabold","UT-label-weight-black":"font-weight-black","UT-label-markdown-margin-sm":"padding-xs","UT-label-markdown-margin-md":"padding-sm","UT-label-markdown-margin-lg":"padding-md","UT-label-markdown-margin-xl":"padding-lg","UT-label-markdown-padding-sm":"padding-xs","UT-label-markdown-padding-md":"padding-sm","UT-label-markdown-padding-lg":"padding-md","UT-label-markdown-padding-xl":"padding-lg","UT-shortcutPanel-width":"size-layout-md","UT-shortcutPanel-width-collapsed":"size-layout-3xs","UT-shortcutPanel-padding":"padding-md","UT-shortcutPanel-header-height":"size-layout-2xs","UT-shortcutPanel-header-gap":"gap-sm","UT-shortcutPanel-header-label-size":"font-heading-size-5","UT-shortcutPanel-category-height":"size-control-md","UT-shortcutPanel-category-padding":"padding-xs","UT-shortcutPanel-category-gap":"gap-lg","UT-shortcutPanel-category-label-size":"font-body-size-sm","UT-shortcutPanel-category-icon-size":"size-icon-md","UT-shortcutPanel-item-height":"size-control-md","UT-shortcutPanel-item-padding":"padding-xs","UT-shortcutPanel-item-gap":"gap-sm","UT-shortcutPanel-item-label-size":"font-body-size-md","UT-shortcutPanel-item-icon-size":"size-icon-xs","UT-snackbar-padding-x":"padding-sm","UT-snackbar-padding-y":"padding-sm","UT-snackbar-radius":"radius-sm","UT-snackbar-gap-icon":"gap-sm","UT-snackbar-gap-description":"gap-xs","UT-snackbar-gap-actions":"gap-xs","UT-snackbar-gap-action-area":"gap-md","UT-snackbar-icon-size":"size-icon-xs","UT-snackbar-icon-offset":"spacing-1","UT-dataElement-padding-md":"padding-md","UT-dataElement-padding-sm":"padding-xs","UT-dataElement-gap-md":"gap-lg","UT-dataElement-gap-sm":"gap-sm","UT-dataElement-content-gap-x":"gap-sm","UT-dataElement-content-gap-y":"gap-sm","UT-dataElement-icon-size":"size-icon-md","UT-dataElement-title-size":"font-body-size-md","UT-dataElement-title-weight":"font-weight-medium","UT-dataElement-prefix-size":"font-body-size-md","UT-dataElement-prefix-weight":"font-weight-medium","UT-dataCategory-padding":"padding-md","UT-dataCategory-gap":"gap-lg","UT-dataCategory-title-gap":"gap-sm","UT-dataCategory-title-size":"font-body-size-sm","UT-dataCategory-title-weight":"font-weight-medium","UT-dataCategory-icon-size":"size-icon-xs","UT-status-gap-large":"gap-sm","UT-status-gap-medium":"gap-sm","UT-status-gap-small":"gap-xs","UT-status-gap-xlarge":"gap-sm","UT-status-gap-xsmall":"gap-xs","UT-status-padding-y-large":"padding-2xs","UT-status-padding-x-large":"padding-xs","UT-status-padding-y-medium":"padding-2xs","UT-status-padding-x-medium":"padding-xs","UT-status-padding-y-small":"padding-2xs","UT-status-padding-x-small":"padding-xs","UT-status-padding-y-xlarge":"padding-xs","UT-status-padding-x-xlarge":"padding-sm","UT-status-padding-y-xsmall":"padding-3xs","UT-status-padding-x-xsmall":"padding-2xs","UT-status-radius":"radius-sm","UT-status-radius-rounded":"radius-full","UT-status-icon-size-3xs":"size-icon-3xs","UT-status-icon-size-2xs":"size-icon-2xs","UT-status-icon-size-xs":"size-icon-xs","UT-status-icon-size-md":"size-icon-md","UT-datepicker-root-gap":"gap-sm","UT-datepicker-adornments-gap":"gap-xs","UT-datepicker-day-padding-y":"padding-xs","UT-datepicker-day-padding-x":"padding-sm","UT-datepicker-calendar-gap":"gap-lg","UT-datepicker-calendar-padding":"padding-md","UT-datepicker-input-padding-x":"padding-sm","UT-datepicker-input-height":"size-control-sm","UT-loading-size":"size-control-4xl","UT-loading-logo-width":"size-brand-logo-2xs","UT-loading-color-start":"var(--identitySolidTone3)","UT-loading-color-end":"var(--identitySolidTone2)","UT-loading-text-size":"font-body-size-md","UT-loading-gap":"gap-lg"}};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.baseTokens = void 0;
+const baseTokens = exports.baseTokens = {
+  base: {
+    'size-12a': '4.5rem',
+    'size-13a': '7.5rem',
+    'size-16a': '12.5rem',
+    'size-full': '100%',
+    'size-0': '0rem',
+    'size-1': '0.125rem',
+    'size-2': '0.25rem',
+    'size-3': '0.5rem',
+    'size-4': '0.75rem',
+    'size-5': '1rem',
+    'size-6': '1.25rem',
+    'size-7': '1.5rem',
+    'size-8': '2rem',
+    'size-9': '2.5rem',
+    'size-10': '3rem',
+    'size-11': '3.5rem',
+    'size-12': '4rem',
+    'size-13': '6rem',
+    'size-14': '8rem',
+    'size-15': '10rem',
+    'size-16': '12rem',
+    'size-17': '14rem',
+    'size-18': '16rem',
+    'size-19': '20rem',
+    'spacing-0': '0rem',
+    'spacing-1': '0.125rem',
+    'spacing-2': '0.25rem',
+    'spacing-3': '0.5rem',
+    'spacing-4': '0.75rem',
+    'spacing-5': '1rem',
+    'spacing-6': '1.25rem',
+    'spacing-7': '1.5rem',
+    'spacing-8': '2rem',
+    'spacing-9': '2.5rem',
+    'spacing-10': '3rem',
+    'spacing-11': '3.5rem',
+    'spacing-12': '4rem',
+    'spacing-13': '6rem',
+    'spacing-14': '8rem',
+    'font-family': 'Inter',
+    'font-size-100': '0.625rem',
+    'font-size-200': '0.75rem',
+    'font-size-300': '0.875rem',
+    'font-size-400': '1rem',
+    'font-size-500': '1.125rem',
+    'font-size-600': '1.25rem',
+    'font-size-650': '1.375rem',
+    'font-size-700': '1.5rem',
+    'font-size-800': '1.875rem',
+    'font-size-900': '2.5rem',
+    'font-size-1000': '3rem',
+    'font-size-1100': '4rem',
+    'font-weight-100': '100',
+    'font-weight-200': '200',
+    'font-weight-300': '300',
+    'font-weight-400': '400',
+    'font-weight-500': '500',
+    'font-weight-600': '600',
+    'font-weight-700': '700',
+    'font-weight-800': '800',
+    'font-weight-900': '900',
+    'font-lh-100': '1',
+    'font-lh-120': '1.2',
+    'font-lh-140': '1.4',
+    'font-lh-150': '1.5',
+    'font-lh-170': '1.7',
+    'legacy-font-lh-full': '100%',
+    'legacy-font-lh-100': '1.125rem',
+    'legacy-font-lh-120': '1.25rem',
+    'legacy-font-lh-140': '1.375rem',
+    'radius-100': '4px',
+    'radius-200': '8px',
+    'radius-300': '12px',
+    'radius-400': '16px',
+    'radius-500': '24px',
+    'radius-full': '9999px'
+  },
+  semantic: {
+    'padding-3xs': 'spacing-1',
+    'padding-2xs': 'spacing-2',
+    'padding-xs': 'spacing-3',
+    'padding-sm': 'spacing-4',
+    'padding-md': 'spacing-5',
+    'padding-lg': 'spacing-7',
+    'padding-xl': 'spacing-8',
+    'padding-2xl': 'spacing-9',
+    'gap-2xs': 'spacing-1',
+    'gap-xs': 'spacing-2',
+    'gap-sm': 'spacing-3',
+    'gap-md': 'spacing-4',
+    'gap-lg': 'spacing-5',
+    'gap-xl': 'spacing-7',
+    'gap-2xl': 'spacing-8',
+    'gap-3xl': 'spacing-9',
+    'font-heading-size-1': 'font-size-700',
+    'font-heading-size-2': 'font-size-650',
+    'font-heading-size-3': 'font-size-600',
+    'font-heading-size-4': 'font-size-500',
+    'font-heading-size-5': 'font-size-400',
+    'font-heading-size-6': 'font-size-500',
+    'font-body-size-xs': 'font-size-100',
+    'font-body-size-sm': 'font-size-200',
+    'font-body-size-md': 'font-size-300',
+    'font-body-size-lg': 'font-size-400',
+    'font-metric-size-sm': 'font-size-300',
+    'font-metric-size-md': 'font-size-400',
+    'font-metric-size-lg': 'font-size-500',
+    'font-action-size-sm': 'font-size-200',
+    'font-action-size-md': 'font-size-300',
+    'font-label-size-sm': 'font-size-200',
+    'font-label-size-md': 'font-size-300',
+    'font-weight-thin': 'font-weight-100',
+    'font-weight-extralight': 'font-weight-200',
+    'font-weight-light': 'font-weight-300',
+    'font-weight-regular': 'font-weight-400',
+    'font-weight-medium': 'font-weight-500',
+    'font-weight-semibold': 'font-weight-600',
+    'font-weight-bold': 'font-weight-700',
+    'font-weight-extrabold': 'font-weight-800',
+    'font-weight-black': 'font-weight-900',
+    'font-lh-reset': 'font-lh-100',
+    'font-lh-heading': 'font-lh-120',
+    'font-lh-subheading': 'font-lh-140',
+    'font-lh-body': 'font-lh-140',
+    'font-lh-caption': 'font-lh-170',
+    'legacy-font-lh-small': 'legacy-font-lh-120',
+    'legacy-font-lh-xsmall': 'legacy-font-lh-100',
+    'size-control-2xs': 'size-5',
+    'size-control-xs': 'size-7',
+    'size-control-sm': 'size-8',
+    'size-control-md': 'size-9',
+    'size-control-lg': 'size-10',
+    'size-control-xl': 'size-11',
+    'size-control-2xl': 'size-12',
+    'size-control-3xl': 'size-13',
+    'size-control-4xl': 'size-13a',
+    'size-brand-logo-2xs': 'size-11',
+    'size-brand-logo-xs': 'size-12a',
+    'size-brand-logo-sm': 'size-13a',
+    'size-brand-logo-md': 'size-15',
+    'size-brand-logo-lg': 'size-16a',
+    'size-icon-3xs': 'size-4',
+    'size-icon-2xs': 'size-5',
+    'size-icon-xs': 'size-6',
+    'size-icon-md': 'size-7',
+    'size-icon-lg': 'size-8',
+    'size-icon-xl': 'size-10',
+    'size-layout-3xs': 'size-11',
+    'size-layout-2xs': 'size-12',
+    'size-layout-sm': 'size-15',
+    'size-layout-md': 'size-18',
+    'size-layout-lg': 'size-19',
+    'size-overlay-sm': 'size-14',
+    'size-overlay-md': 'size-16',
+    'size-overlay-lg': 'size-18',
+    'size-overlay-xl': 'size-19',
+    'size-overlay-2xl': 'size-21',
+    'size-overlay-3xl': 'size-23',
+    'size-overlay-full': 'size-full',
+    'size-input-height-sm': 'size-9',
+    'size-input-height-md': 'size-10',
+    'size-input-padding-y': 'spacing-3',
+    'size-input-padding-x': 'spacing-5',
+    'size-input-gap': 'spacing-5',
+    'size-input-radius': 'radius-100',
+    'font-input-size': 'font-size-400',
+    'size-input-icon': 'size-6',
+    'radius-sm': 'radius-100',
+    'radius-md': 'radius-200',
+    'radius-lg': 'radius-300',
+    'radius-xl': 'radius-500'
+  },
+  component: {
+    'UT-banner-buttons-gap': 'gap-sm',
+    'UT-banner-gap-lg': 'gap-xl',
+    'UT-banner-gap-md': 'gap-lg',
+    'UT-banner-gap-sm': 'gap-sm',
+    'UT-banner-icon-gap': 'gap-md',
+    'UT-banner-icon-size-lg': 'size-icon-md',
+    'UT-banner-icon-size-sm': 'size-icon-xs',
+    'UT-banner-padding-lg': 'padding-lg',
+    'UT-banner-padding-md': 'padding-md',
+    'UT-banner-padding-x-sm': 'padding-sm',
+    'UT-banner-padding-y-sm': 'padding-xs',
+    'UT-banner-radius': 'radius-md',
+    'UT-banner-text-gap': 'gap-sm',
+    'UT-button-height-sm': 'size-control-sm',
+    'UT-button-height-md': 'size-control-md',
+    'UT-button-height-lg': 'size-control-lg',
+    'UT-button-padding-xs': 'padding-2xs',
+    'UT-button-padding-sm': 'padding-xs',
+    'UT-button-padding-md': 'padding-sm',
+    'UT-button-padding-lg': 'padding-md',
+    'UT-button-gap-sm': 'gap-xs',
+    'UT-button-gap-md': 'gap-sm',
+    'UT-button-label-size': 'font-label-size-md',
+    'UT-button-label-weight': 'font-weight-600',
+    'UT-button-label-lh': 'font-lh-reset',
+    'UT-button-radius': 'radius-sm',
+    'UT-button-icon-size-sm': 'size-icon-xs',
+    'UT-button-icon-size-md': 'size-icon-md',
+    'UT-buttonGroup-padding': 'padding-2xs',
+    'UT-buttonGroup-radius': 'radius-md',
+    'UT-label-size-title-1': 'font-heading-size-1',
+    'UT-label-size-title-2': 'font-heading-size-2',
+    'UT-label-size-title-3': 'font-heading-size-3',
+    'UT-label-size-subtitle-1': 'font-heading-size-4',
+    'UT-label-size-subtitle-2': 'font-heading-size-5',
+    'UT-label-size-body': 'font-body-size-lg',
+    'UT-label-size-small': 'font-body-size-md',
+    'UT-label-size-xsmall': 'font-body-size-sm',
+    'UT-label-lh-heading': 'font-lh-heading',
+    'UT-label-lh-subheading': 'font-lh-subheading',
+    'UT-label-lh-body': 'font-lh-body',
+    'UT-label-lh-small': 'font-lh-140',
+    'UT-label-lh-xsmall': 'font-lh-150',
+    'UT-label-weight-thin': 'font-weight-thin',
+    'UT-label-weight-extralight': 'font-weight-extralight',
+    'UT-label-weight-light': 'font-weight-light',
+    'UT-label-weight-regular': 'font-weight-regular',
+    'UT-label-weight-medium': 'font-weight-medium',
+    'UT-label-weight-semibold': 'font-weight-semibold',
+    'UT-label-weight-bold': 'font-weight-bold',
+    'UT-label-weight-extrabold': 'font-weight-extrabold',
+    'UT-label-weight-black': 'font-weight-black',
+    'UT-label-markdown-margin-sm': 'padding-xs',
+    'UT-label-markdown-margin-md': 'padding-sm',
+    'UT-label-markdown-margin-lg': 'padding-md',
+    'UT-label-markdown-margin-xl': 'padding-lg',
+    'UT-label-markdown-padding-sm': 'padding-xs',
+    'UT-label-markdown-padding-md': 'padding-sm',
+    'UT-label-markdown-padding-lg': 'padding-md',
+    'UT-label-markdown-padding-xl': 'padding-lg',
+    'UT-shortcutPanel-width': 'size-layout-md',
+    'UT-shortcutPanel-width-collapsed': 'size-layout-3xs',
+    'UT-shortcutPanel-padding': 'padding-md',
+    'UT-shortcutPanel-header-height': 'size-layout-2xs',
+    'UT-shortcutPanel-header-gap': 'gap-sm',
+    'UT-shortcutPanel-header-label-size': 'font-heading-size-5',
+    'UT-shortcutPanel-category-height': 'size-control-md',
+    'UT-shortcutPanel-category-padding': 'padding-xs',
+    'UT-shortcutPanel-category-gap': 'gap-lg',
+    'UT-shortcutPanel-category-label-size': 'font-body-size-sm',
+    'UT-shortcutPanel-category-icon-size': 'size-icon-md',
+    'UT-shortcutPanel-item-height': 'size-control-md',
+    'UT-shortcutPanel-item-padding': 'padding-xs',
+    'UT-shortcutPanel-item-gap': 'gap-sm',
+    'UT-shortcutPanel-item-label-size': 'font-body-size-md',
+    'UT-shortcutPanel-item-icon-size': 'size-icon-xs',
+    'UT-snackbar-padding-x': 'padding-sm',
+    'UT-snackbar-padding-y': 'padding-sm',
+    'UT-snackbar-radius': 'radius-sm',
+    'UT-snackbar-gap-icon': 'gap-sm',
+    'UT-snackbar-gap-description': 'gap-xs',
+    'UT-snackbar-gap-actions': 'gap-xs',
+    'UT-snackbar-gap-action-area': 'gap-md',
+    'UT-snackbar-icon-size': 'size-icon-xs',
+    'UT-snackbar-icon-offset': 'spacing-1',
+    'UT-dataElement-padding-md': 'padding-md',
+    'UT-dataElement-padding-sm': 'padding-xs',
+    'UT-dataElement-gap-md': 'gap-lg',
+    'UT-dataElement-gap-sm': 'gap-sm',
+    'UT-dataElement-content-gap-x': 'gap-sm',
+    'UT-dataElement-content-gap-y': 'gap-sm',
+    'UT-dataElement-icon-size': 'size-icon-md',
+    'UT-dataElement-chevron-icon-size': 'size-icon-xs',
+    'UT-dataElement-title-size': 'font-body-size-md',
+    'UT-dataElement-title-weight': 'font-weight-medium',
+    'UT-dataElement-prefix-size': 'font-body-size-md',
+    'UT-dataElement-prefix-weight': 'font-weight-medium',
+    'UT-dataCategory-padding': 'padding-md',
+    'UT-dataCategory-gap': 'gap-lg',
+    'UT-dataCategory-title-gap': 'gap-sm',
+    'UT-dataCategory-title-size': 'font-body-size-sm',
+    'UT-dataCategory-title-weight': 'font-weight-medium',
+    'UT-dataCategory-icon-size': 'size-icon-xs',
+    'UT-status-gap-large': 'gap-sm',
+    'UT-status-gap-medium': 'gap-sm',
+    'UT-status-gap-small': 'gap-xs',
+    'UT-status-gap-xlarge': 'gap-sm',
+    'UT-status-gap-xsmall': 'gap-xs',
+    'UT-status-padding-y-large': 'padding-2xs',
+    'UT-status-padding-x-large': 'padding-xs',
+    'UT-status-padding-y-medium': 'padding-2xs',
+    'UT-status-padding-x-medium': 'padding-xs',
+    'UT-status-padding-y-small': 'padding-2xs',
+    'UT-status-padding-x-small': 'padding-xs',
+    'UT-status-padding-y-xlarge': 'padding-xs',
+    'UT-status-padding-x-xlarge': 'padding-sm',
+    'UT-status-padding-y-xsmall': 'padding-3xs',
+    'UT-status-padding-x-xsmall': 'padding-2xs',
+    'UT-status-radius': 'radius-sm',
+    'UT-status-radius-rounded': 'radius-full',
+    'UT-status-icon-size-3xs': 'size-icon-3xs',
+    'UT-status-icon-size-2xs': 'size-icon-2xs',
+    'UT-status-icon-size-xs': 'size-icon-xs',
+    'UT-status-icon-size-md': 'size-icon-md',
+    'UT-datepicker-root-gap': 'gap-sm',
+    'UT-datepicker-adornments-gap': 'gap-xs',
+    'UT-datepicker-day-padding-y': 'padding-xs',
+    'UT-datepicker-day-padding-x': 'padding-sm',
+    'UT-datepicker-calendar-gap': 'gap-lg',
+    'UT-datepicker-calendar-padding': 'padding-md',
+    'UT-datepicker-input-padding-x': 'padding-sm',
+    'UT-datepicker-input-height': 'size-control-sm',
+    'UT-loading-size': 'size-control-4xl',
+    'UT-loading-logo-width': 'size-brand-logo-2xs',
+    'UT-loading-color-start': 'var(--identitySolidTone3)',
+    'UT-loading-color-end': 'var(--identitySolidTone2)',
+    'UT-loading-text-size': 'font-body-size-md',
+    'UT-loading-gap': 'gap-lg'
+  }
+};

package/dist/utils/hooks/useCSSVariables/index.js

@@ -1 +1,66 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=require("react"),_mergeWith=_interopRequireDefault(require("lodash/mergeWith")),_constants=require("./constants"),_utils=require("./utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const useCSSVariables=function(cssVariables){let tagId=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"wdrgy-css-variables",prefix=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"";(0,_react.useEffect)(()=>{const formattedVariables=Object.entries((0,_utils.mapTokens)((0,_mergeWith.default)(_constants.baseTokens,cssVariables))).filter(cssVar=>"string"==typeof cssVar[1]||"number"==typeof cssVar[1]).map(_ref=>{let[key,value]=_ref;const variableName=prefix?"--".concat(prefix,"-").concat(key):"--".concat(key);return"".concat(variableName,": ").concat(value,";")}).join("\n  "),existingStyle=document.getElementById(tagId);existingStyle&&existingStyle.remove();const styleContent="html {\n  ".concat(formattedVariables,"\n}"),styleTag=document.createElement("style");return styleTag.id=tagId,styleTag.textContent=styleContent,document.head.appendChild(styleTag),()=>{const style=document.getElementById(tagId);style&&style.remove()}},[cssVariables,prefix,tagId])};var _default=exports.default=useCSSVariables;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("react");
+var _mergeWith = _interopRequireDefault(require("lodash/mergeWith"));
+var _constants = require("./constants");
+var _utils = require("./utils");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/**
+ * Hook that injects CSS variables into the html element
+ * The variables will be available for all elements in the document
+ *
+ * @param {Object} cssVariables - Object with key-value pairs of CSS variables
+ * @param {string} tagId - ID for the style tag (default: 'wdrgy-css-variables')
+ * @param {string} prefix - Prefix for the variables (default: '')
+ * @param {Object} designTokens - Object with {base, semantic, component} tokens
+ *
+ * @example
+ * useCSSVariables({
+ *   primaryColor: '#007bff',
+ *   fontSize: '14px',
+ *   spacing: '8px'
+ * });
+ * // Generates:
+ * // html {
+ * //   --primaryColor: #007bff;
+ * //   --fontSize: 14px;
+ * //   --spacing: 8px;
+ * // }
+ */
+
+const useCSSVariables = function (cssVariables) {
+  let tagId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'wdrgy-css-variables';
+  let prefix = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
+  (0, _react.useEffect)(() => {
+    // Validate and build CSS variables safely
+    const formattedVariables = Object.entries((0, _utils.mapTokens)((0, _mergeWith.default)(_constants.baseTokens, cssVariables))).filter(cssVar => typeof cssVar[1] === 'string' || typeof cssVar[1] === 'number').map(_ref => {
+      let [key, value] = _ref;
+      const variableName = prefix ? "--".concat(prefix, "-").concat(key) : "--".concat(key);
+      return "".concat(variableName, ": ").concat(value, ";");
+    }).join('\n  ');
+
+    // Remove previous style tag if it exists
+    const existingStyle = document.getElementById(tagId);
+    if (existingStyle) existingStyle.remove();
+
+    // Create the style tag content
+    const styleContent = "html {\n  ".concat(formattedVariables, "\n}");
+
+    // Create and insert the style tag
+    const styleTag = document.createElement('style');
+    styleTag.id = tagId;
+    styleTag.textContent = styleContent;
+    document.head.appendChild(styleTag);
+
+    // Cleanup: remove the style tag on unmount
+    return () => {
+      const style = document.getElementById(tagId);
+      if (style) style.remove();
+    };
+  }, [cssVariables, prefix, tagId]);
+};
+var _default = exports.default = useCSSVariables;

package/dist/utils/hooks/useCSSVariables/utils.js

@@ -1 +1,24 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.mapTokens=void 0;const mapTokens=tokens=>{const{base:base={},semantic:semantic={},component:component={},...other}=tokens||{},allTokens={...base,...other};return Object.entries(semantic).concat(Object.entries(component)).forEach(_ref=>{let[key,value]=_ref;allTokens[key]=allTokens[value]}),allTokens};exports.mapTokens=mapTokens;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mapTokens = void 0;
+const mapTokens = tokens => {
+  const {
+    base = {},
+    semantic = {},
+    component = {},
+    ...other
+  } = tokens || {};
+  const allTokens = {
+    ...base,
+    ...other
+  };
+  Object.entries(semantic).concat(Object.entries(component)).forEach(_ref => {
+    let [key, value] = _ref;
+    allTokens[key] = allTokens[value];
+  });
+  return allTokens;
+};
+exports.mapTokens = mapTokens;

package/dist/utils/keyboardUtils.js

@@ -1 +1,108 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.preventPointerDown=exports.identifyField=exports.getIsKeyboard=exports.getIsInputForKeyboard=exports.getFieldValue=exports.default=exports.clickForKeyboard=void 0;var _isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_keyboardConstants=require("../constants/keyboardConstants");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const preventPointerDown=e=>e.preventDefault();exports.preventPointerDown=preventPointerDown;const identifyField=function(){let eventTarget=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},forms=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};const{dataset:{keyboard:inputName}}=eventTarget,fieldName=inputName.includes("-")?inputName.split("-")[1]:inputName,fieldPrefix=inputName.includes("-")?inputName.split("-")[0]:null,formsArray=Object.entries(forms),[formName]=formsArray.find(_ref=>{let[_,{registeredFields:registeredFields}]=_ref;return!!registeredFields&&Object.keys(registeredFields).includes(fieldName)})||[_keyboardConstants.NO_FORM],eventHandlersKey=Object.keys(eventTarget).find(key=>key.includes(_keyboardConstants.HANDLER_IDENTIFIER)),{onChange:onChange}=eventTarget[eventHandlersKey]||{};return{fieldName:fieldName,fieldPrefix:fieldPrefix,formName:formName,onChange:onChange}};exports.identifyField=identifyField;const getFieldValue=(currentIdentifiers,fieldSelector,state)=>{var _fieldSelector,_fieldSelector2,_fieldSelector3;if(!(0,_isEmpty.default)(currentIdentifiers)){const{fieldName:fieldName,fieldPrefix:fieldPrefix,formName:formName}=currentIdentifiers||{};switch(fieldPrefix){case"areaCode":case"prefix":return null===(_fieldSelector=fieldSelector(formName||"")(state,fieldName))||void 0===_fieldSelector?void 0:_fieldSelector.split("-")[0];case"phoneNumber":case"document":return null===(_fieldSelector2=fieldSelector(formName||"")(state,fieldName))||void 0===_fieldSelector2?void 0:_fieldSelector2.split("-")[1];case"verificationCode":return null===(_fieldSelector3=fieldSelector(formName||"")(state,fieldName))||void 0===_fieldSelector3?void 0:_fieldSelector3.split("-")[2];default:return fieldSelector(formName||"")(state,fieldName)}}};exports.getFieldValue=getFieldValue;const getIsKeyboard=eventTarget=>{const{dataset:{skbtn:skbtn,skinstance:skinstance},classList:classList}=eventTarget;return skbtn||skinstance||[...classList].some(cssClass=>cssClass.includes("hg-"))};exports.getIsKeyboard=getIsKeyboard;const getIsInputForKeyboard=(nodeName,type)=>"INPUT"===nodeName&&_keyboardConstants.KEYBOARD_ALLOWED_TYPES.includes(type)||"TEXTAREA"===nodeName;exports.getIsInputForKeyboard=getIsInputForKeyboard;const clickForKeyboard=(formList,setFieldIdentifiers,setShowKeyboard,showKeyboard)=>_ref2=>{let{target:eventTarget}=_ref2;const{nodeName:nodeName,type:type}=eventTarget,isKeyboard=getIsKeyboard(eventTarget),isInputForKeyboard=getIsInputForKeyboard(nodeName,type);if(isInputForKeyboard){const identifiers=identifyField(eventTarget,formList);"autocomplete"===identifiers.fieldPrefix&&window.addEventListener("pointerdown",preventPointerDown),setFieldIdentifiers(identifiers),showKeyboard||setShowKeyboard(!0)}else isInputForKeyboard||isKeyboard||(setShowKeyboard(!1),window.removeEventListener("pointerdown",preventPointerDown))};exports.clickForKeyboard=clickForKeyboard;var _default=exports.default={identifyField:identifyField,getFieldValue:getFieldValue,getIsKeyboard:getIsKeyboard,getIsInputForKeyboard:getIsInputForKeyboard,clickForKeyboard:clickForKeyboard};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.preventPointerDown = exports.identifyField = exports.getIsKeyboard = exports.getIsInputForKeyboard = exports.getFieldValue = exports.default = exports.clickForKeyboard = void 0;
+var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
+var _keyboardConstants = require("../constants/keyboardConstants");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const preventPointerDown = e => e.preventDefault();
+exports.preventPointerDown = preventPointerDown;
+const identifyField = function () {
+  let eventTarget = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let forms = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  const {
+    dataset: {
+      keyboard: inputName
+    }
+  } = eventTarget;
+  const fieldName = inputName.includes('-') ? inputName.split('-')[1] : inputName;
+  const fieldPrefix = inputName.includes('-') ? inputName.split('-')[0] : null;
+  const formsArray = Object.entries(forms);
+  const [formName] = formsArray.find(_ref => {
+    let [_, {
+      registeredFields
+    }] = _ref;
+    return registeredFields ? Object.keys(registeredFields).includes(fieldName) : false;
+  }) || [_keyboardConstants.NO_FORM];
+  const eventHandlersKey = Object.keys(eventTarget).find(key => key.includes(_keyboardConstants.HANDLER_IDENTIFIER));
+  const {
+    onChange
+  } = eventTarget[eventHandlersKey] || {};
+  return {
+    fieldName,
+    fieldPrefix,
+    formName,
+    onChange
+  };
+};
+exports.identifyField = identifyField;
+const getFieldValue = (currentIdentifiers, fieldSelector, state) => {
+  var _fieldSelector, _fieldSelector2, _fieldSelector3;
+  if (!(0, _isEmpty.default)(currentIdentifiers)) {
+    const {
+      fieldName,
+      fieldPrefix,
+      formName
+    } = currentIdentifiers || {};
+    switch (fieldPrefix) {
+      case 'areaCode':
+      case 'prefix':
+        return (_fieldSelector = fieldSelector(formName || '')(state, fieldName)) === null || _fieldSelector === void 0 ? void 0 : _fieldSelector.split('-')[0];
+      case 'phoneNumber':
+      case 'document':
+        return (_fieldSelector2 = fieldSelector(formName || '')(state, fieldName)) === null || _fieldSelector2 === void 0 ? void 0 : _fieldSelector2.split('-')[1];
+      case 'verificationCode':
+        return (_fieldSelector3 = fieldSelector(formName || '')(state, fieldName)) === null || _fieldSelector3 === void 0 ? void 0 : _fieldSelector3.split('-')[2];
+      default:
+        return fieldSelector(formName || '')(state, fieldName);
+    }
+  }
+};
+exports.getFieldValue = getFieldValue;
+const getIsKeyboard = eventTarget => {
+  const {
+    dataset: {
+      skbtn,
+      skinstance
+    },
+    classList
+  } = eventTarget;
+  return skbtn || skinstance || [...classList].some(cssClass => cssClass.includes('hg-'));
+};
+exports.getIsKeyboard = getIsKeyboard;
+const getIsInputForKeyboard = (nodeName, type) => nodeName === 'INPUT' && _keyboardConstants.KEYBOARD_ALLOWED_TYPES.includes(type) || nodeName === 'TEXTAREA';
+exports.getIsInputForKeyboard = getIsInputForKeyboard;
+const clickForKeyboard = (formList, setFieldIdentifiers, setShowKeyboard, showKeyboard) => _ref2 => {
+  let {
+    target: eventTarget
+  } = _ref2;
+  const {
+    nodeName,
+    type
+  } = eventTarget;
+  const isKeyboard = getIsKeyboard(eventTarget);
+  const isInputForKeyboard = getIsInputForKeyboard(nodeName, type);
+  if (isInputForKeyboard) {
+    const identifiers = identifyField(eventTarget, formList);
+    if (identifiers.fieldPrefix === 'autocomplete') {
+      window.addEventListener('pointerdown', preventPointerDown);
+    }
+    setFieldIdentifiers(identifiers);
+    if (!showKeyboard) {
+      setShowKeyboard(true);
+    }
+  } else if (!isInputForKeyboard && !isKeyboard) {
+    setShowKeyboard(false);
+    window.removeEventListener('pointerdown', preventPointerDown);
+  }
+};
+exports.clickForKeyboard = clickForKeyboard;
+var _default = exports.default = {
+  identifyField,
+  getFieldValue,
+  getIsKeyboard,
+  getIsInputForKeyboard,
+  clickForKeyboard
+};

package/dist/utils/shadowUtils.js

@@ -1 +1,42 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getShadow=void 0;const defaultOrientation="bottom",defaultLevel=1,levels={1:6,2:12,3:24},orientations={bottom:{1:3,2:6,3:24},center:{1:0,2:0,3:0},top:{1:-3,2:-6,3:-24}},getShadow=_ref=>{let{color:color,level:level,orientation:orientation}=_ref;const shadowLevel=levels[level]||levels[1],shadowOrientation=orientations[orientation]||orientations.bottom,shadowOrientationLevel=shadowOrientation[level]||shadowOrientation[1];return"0 ".concat(shadowOrientationLevel,"px ").concat(shadowLevel,"px 0 ").concat(color)};exports.getShadow=getShadow;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getShadow = void 0;
+const defaultOrientation = 'bottom';
+const defaultLevel = 1;
+const levels = {
+  1: 6,
+  2: 12,
+  3: 24
+};
+const orientations = {
+  bottom: {
+    1: 3,
+    2: 6,
+    3: 24
+  },
+  center: {
+    1: 0,
+    2: 0,
+    3: 0
+  },
+  top: {
+    1: -3,
+    2: -6,
+    3: -24
+  }
+};
+const getShadow = _ref => {
+  let {
+    color,
+    level,
+    orientation
+  } = _ref;
+  const shadowLevel = levels[level] || levels[defaultLevel];
+  const shadowOrientation = orientations[orientation] || orientations[defaultOrientation];
+  const shadowOrientationLevel = shadowOrientation[level] || shadowOrientation[defaultLevel];
+  return "0 ".concat(shadowOrientationLevel, "px ").concat(shadowLevel, "px 0 ").concat(color);
+};
+exports.getShadow = getShadow;