gd-design-library 1.8.2 → 1.8.3

package/tokens/index.d.ts

@@ -1,64 +1,64 @@
-export * from './checkbox';
-export * from './separator';
-export * from './draganddrop';
-export * from './avatar';
-export * from './chatbubble';
-export * from './radiogroup';
-export * from './searchModal';
-export * from './inputfile';
-export * from './carousel';
-export * from './progressbar';
-export * from './card';
-export * from './box';
-export * from './counter';
-export * from './chat';
-export * from './values';
-export * from './font';
-export * from './colors';
-export * from './breakpoints';
-export * from './menu';
-export * from './spacing';
-export * from './radius';
-export * from './typography';
-export * from './borders';
-export * from './button';
-export * from './badge';
-export * from './input';
-export * from './label';
-export * from './link';
-export * from './form';
-export * from './cursors';
-export * from './textarea';
-export * from './wrapper';
-export * from './loader';
-export * from './switch';
-export * from './animations';
-export * from './skeleton';
-export * from './defaultTheme';
-export * from './snackbar';
-export * from './list';
-export * from './select';
-export * from './search';
-export * from './breadcrumbs';
-export * from './icon';
-export * from './reset';
-export * from './toggle';
-export * from './tabs';
-export * from './stepper';
-export * from './rating';
-export * from './header';
-export * from './draganddropfiles';
-export * from './slider';
-export * from './scroll';
-export * from './truncate';
-export * from './zIndex';
-export * from './sidebar';
-export * from './imagePreview';
-export * from './inputArea';
-export * from './sliderDots';
-export * from './attachmentFile';
-export * from './utils';
-export * from './types/index.types';
+export * from './checkbox.js';
+export * from './separator.js';
+export * from './draganddrop.js';
+export * from './avatar.js';
+export * from './chatbubble.js';
+export * from './radiogroup.js';
+export * from './searchModal.js';
+export * from './inputfile.js';
+export * from './carousel.js';
+export * from './progressbar.js';
+export * from './card.js';
+export * from './box.js';
+export * from './counter.js';
+export * from './chat.js';
+export * from './values.js';
+export * from './font.js';
+export * from './colors.js';
+export * from './breakpoints.js';
+export * from './menu.js';
+export * from './spacing.js';
+export * from './radius.js';
+export * from './typography.js';
+export * from './borders.js';
+export * from './button.js';
+export * from './badge.js';
+export * from './input.js';
+export * from './label.js';
+export * from './link.js';
+export * from './form.js';
+export * from './cursors.js';
+export * from './textarea.js';
+export * from './wrapper.js';
+export * from './loader.js';
+export * from './switch.js';
+export * from './animations.js';
+export * from './skeleton.js';
+export * from './defaultTheme.js';
+export * from './snackbar.js';
+export * from './list.js';
+export * from './select.js';
+export * from './search.js';
+export * from './breadcrumbs.js';
+export * from './icon.js';
+export * from './reset.js';
+export * from './toggle.js';
+export * from './tabs.js';
+export * from './stepper.js';
+export * from './rating.js';
+export * from './header.js';
+export * from './draganddropfiles.js';
+export * from './slider.js';
+export * from './scroll.js';
+export * from './truncate.js';
+export * from './zIndex.js';
+export * from './sidebar.js';
+export * from './imagePreview.js';
+export * from './inputArea.js';
+export * from './sliderDots.js';
+export * from './attachmentFile.js';
+export * from './utils.js';
+export * from './types/index.types.js';
 export declare const defaultTokens: {
     button: {
         default: {
@@ -646,24 +646,24 @@ export declare const defaultTokens: {
             };
             attrs: {
                 default: {
-                    variant: import('../types').TypographyVariant;
-                    align: import('../types').TextAlign;
+                    variant: string;
+                    align: string;
                 };
                 size: {
                     xs: {
-                        variant: import('../types').TypographyVariant;
+                        variant: string;
                     };
                     sm: {
-                        variant: import('../types').TypographyVariant;
+                        variant: string;
                     };
                     md: {
-                        variant: import('../types').TypographyVariant;
+                        variant: string;
                     };
                     lg: {
-                        variant: import('../types').TypographyVariant;
+                        variant: string;
                     };
                     xl: {
-                        variant: import('../types').TypographyVariant;
+                        variant: string;
                     };
                 };
             };
@@ -727,7 +727,7 @@ export declare const defaultTokens: {
                 flexDirection: string;
                 alignItems: string;
                 gap: (theme: Record<symbol, unknown>) => string;
-                textAlign: import('../types').TextAlign;
+                textAlign: string;
             };
             name: {
                 fontWeight: (theme: Record<symbol, unknown>) => string;
@@ -744,7 +744,7 @@ export declare const defaultTokens: {
     chatbubble: {
         default: {
             display: string;
-            flexDirection: import('../types').FlexDirection;
+            flexDirection: import('../types/index.js').FlexDirection;
             gap: (theme: Record<symbol, unknown>) => string;
             clear: string;
             margin: (theme: Record<symbol, unknown>) => string;
@@ -799,7 +799,7 @@ export declare const defaultTokens: {
             default: {
                 gap: (theme: Record<symbol, unknown>) => string;
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
             };
             pending: {
                 alignItems: string;
@@ -809,7 +809,7 @@ export declare const defaultTokens: {
         };
         actions: {
             display: string;
-            flexDirection: import('../types').FlexDirection;
+            flexDirection: import('../types/index.js').FlexDirection;
         };
         loader: {
             attrs: {
@@ -856,7 +856,7 @@ export declare const defaultTokens: {
         linkPreview: {
             default: {
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 borderRadius: (theme: Record<symbol, unknown>) => string;
                 overflow: string;
                 border: (theme: Record<symbol, unknown>) => string;
@@ -875,7 +875,7 @@ export declare const defaultTokens: {
             content: {
                 padding: (theme: Record<symbol, unknown>) => string;
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 gap: (theme: Record<symbol, unknown>) => string;
             };
             title: {
@@ -924,8 +924,8 @@ export declare const defaultTokens: {
                 color: (theme: Record<symbol, unknown>) => string;
                 width: string;
                 height: string;
-                alignContent: import('../types').TextAlign;
-                textAlign: import('../types').TextAlign;
+                alignContent: import('../types/index.js').TextAlign;
+                textAlign: import('../types/index.js').TextAlign;
             };
             disabled: {};
             selected: {};
@@ -983,11 +983,11 @@ export declare const defaultTokens: {
         layouts: {
             column: {
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
             };
             row: {
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
             };
             grid: {
                 display: string;
@@ -1053,6 +1053,39 @@ export declare const defaultTokens: {
             alignItems: string;
             zIndex: string;
         };
+        contentTypography: {
+            flexDirection: string;
+            height: string;
+            position: string;
+            justifyContent: string;
+            alignItems: string;
+            zIndex: string;
+        };
+        slideImage: {
+            width: string;
+            height: string;
+        };
+        slidePlaceholder: {
+            width: string;
+            height: string;
+            minHeight: string;
+            backgroundColor: (theme: Record<symbol, unknown>) => string;
+        };
+        slideOverlayContainer: {
+            position: string;
+            width: string;
+            height: string;
+            minHeight: string;
+        };
+        slideOverlayBackdrop: {
+            position: string;
+            inset: number;
+            backgroundColor: (theme: Record<symbol, unknown>) => string;
+        };
+        slideOverlayChildren: {
+            position: string;
+            inset: number;
+        };
         carouselViewport: {
             default: {
                 overflow: string;
@@ -1071,10 +1104,10 @@ export declare const defaultTokens: {
                 minHeight: number;
             };
             horizontal: {
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
             };
             vertical: {
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 height: string;
             };
         };
@@ -1120,7 +1153,7 @@ export declare const defaultTokens: {
             default: {
                 position: string;
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 flex: number;
                 minWidth: number;
                 minHeight: number;
@@ -1176,7 +1209,7 @@ export declare const defaultTokens: {
                 maxWidth: string;
             };
             vertical: {
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 flex: string;
                 overflow: string;
                 alignItems: string;
@@ -1215,7 +1248,7 @@ export declare const defaultTokens: {
             default: {};
             vertical: {
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 alignItems: string;
                 gap: string;
             };
@@ -1265,7 +1298,7 @@ export declare const defaultTokens: {
                 height: (theme: Record<symbol, unknown>) => string;
             };
             attrs: {
-                variant: import('../types').ButtonVariant;
+                variant: import('../types/index.js').ButtonVariant;
                 isIcon: boolean;
             };
         };
@@ -1321,14 +1354,14 @@ export declare const defaultTokens: {
         loader: {
             default: {
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 gap: (theme: Record<symbol, unknown>) => string;
             };
         };
         items: {
             default: {
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
             };
             newSearchBtn: {
                 styles: {
@@ -1343,12 +1376,12 @@ export declare const defaultTokens: {
                     };
                 };
                 attrs: {
-                    variant: import('../types').ButtonVariant;
+                    variant: import('../types/index.js').ButtonVariant;
                 };
             };
             noResult: {
                 display: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 alignItems: string;
                 gap: (theme: Record<symbol, unknown>) => string;
                 padding: (theme: Record<symbol, unknown>) => string;
@@ -1379,7 +1412,7 @@ export declare const defaultTokens: {
                     lineHeight: (theme: Record<symbol, unknown>) => string;
                 };
                 attrs: {
-                    variant: import('../types').ButtonVariant;
+                    variant: import('../types/index.js').ButtonVariant;
                 };
             };
             itemRow: {
@@ -1741,7 +1774,7 @@ export declare const defaultTokens: {
             width: string;
             '& input': {
                 width: string;
-                textAlign: import('../types').TextAlign;
+                textAlign: import('../types/index.js').TextAlign;
             };
         };
         navButton: {
@@ -1755,7 +1788,7 @@ export declare const defaultTokens: {
                 };
             };
             attrs: {
-                variant: import('../types').ButtonVariant;
+                variant: import('../types/index.js').ButtonVariant;
                 isIcon: boolean;
             };
         };
@@ -2486,7 +2519,7 @@ export declare const defaultTokens: {
             };
             "&.Link--disabled": {
                 color: (theme: Record<symbol, unknown>) => string;
-                cursor: import('../types').Cursors;
+                cursor: import('../types/index.js').Cursors;
                 textDecoration: string;
                 backgroundColor: string;
                 '&::after': {
@@ -3453,7 +3486,7 @@ export declare const defaultTokens: {
                 flexDirection: string;
                 justifyContent: string;
                 alignItems: string;
-                textAlign: import('../types').TextAlign;
+                textAlign: import('../types/index.js').TextAlign;
                 '.gd-button__content': {
                     justifyContent: string;
                 };
@@ -3471,12 +3504,12 @@ export declare const defaultTokens: {
                 border: (theme: Record<symbol, unknown>) => string;
             };
             attrs: {
-                variant: import('../types').ButtonVariant;
+                variant: import('../types/index.js').ButtonVariant;
             };
         };
         item: {
             default: {
-                cursor: import('../types').Cursors;
+                cursor: import('../types/index.js').Cursors;
                 padding: string | number;
                 '&:hover, &.active': {
                     backgroundColor: (theme: Record<symbol, unknown>) => string;
@@ -3484,7 +3517,7 @@ export declare const defaultTokens: {
             };
             disabled: {
                 opacity: number;
-                cursor: import('../types').Cursors;
+                cursor: import('../types/index.js').Cursors;
                 pointerEvents: string;
             };
         };
@@ -3513,7 +3546,7 @@ export declare const defaultTokens: {
             default: {
                 display: string;
                 alignItems: string;
-                flexDirection: import('../types').FlexDirection;
+                flexDirection: import('../types/index.js').FlexDirection;
                 position: string;
                 zIndex: (theme: Record<symbol, unknown>) => string;
             };
@@ -5000,6 +5033,9 @@ export declare const defaultTokens: {
             text: {
                 fontSize: (theme: Record<symbol, unknown>) => string;
                 color: (theme: Record<symbol, unknown>) => string;
+                whiteSpace: string;
+                overflow: string;
+                textOverflow: string;
             };
         };
         icon: {

package/tokens/inlineNotification.cjs

@@ -1 +1 @@
-const e=require(`../utils/helpers.cjs`),t=require(`./borders.cjs`),n=require(`./display.cjs`);var r={default:{wrapper:{display:n.display.inlineFlex,alignItems:n.flexAlignItems.center,gap:t=>e.get(t,`spacing.xs`,`theme.spacing.xs`),width:`max-content`},content:{flex:1,fontFamily:t=>e.get(t,`font.family`,`theme.font.family`),fontWeight:t=>e.get(t,`font.weight.medium`,`theme.font.weight.medium`),fontSize:t=>e.get(t,`font.size.small`,`theme.font.size.small`),lineHeight:t=>e.get(t,`font.line.height.small`,`theme.font.line.height.small`)}},success:{wrapper:{},content:{},icon:{name:`success`,fill:`icon.success`}},warning:{wrapper:{},content:{},icon:{name:`warning`,fill:`icon.warning`}},error:{wrapper:{},content:{},icon:{name:`error`,fill:`icon.error`}},info:{wrapper:{},content:{},icon:{name:`info`,fill:`icon.info`}},basic:{wrapper:{border:n=>t.borders.generic({width:e.get(n,`values.borderThin`,`theme.values.borderThin`),color:e.get(n,`colors.border.default`,`theme.colors.border.default`)}),boxShadow:t=>e.get(t,`shadows.inlineNotification.default`,`theme.shadows.inlineNotification.default`),padding:t=>{let n=e.get(t,`spacing.sm`,`theme.spacing.sm`),r=e.get(t,`spacing.md`,`theme.spacing.md`);return`${n} ${r} ${n} ${r}`}},content:{fontWeight:t=>e.get(t,`font.weight.normal`,`theme.font.weight.normal`)},icon:{name:``}}};exports.inlineNotification=r;
+const e=require("../utils/helpers.cjs"),t=require("./borders.cjs"),n=require("./display.cjs");var r={default:{wrapper:{display:n.display.inlineFlex,alignItems:n.flexAlignItems.center,gap:t=>e.get(t,`spacing.xs`,`theme.spacing.xs`),width:`max-content`},content:{flex:1,fontFamily:t=>e.get(t,`font.family`,`theme.font.family`),fontWeight:t=>e.get(t,`font.weight.medium`,`theme.font.weight.medium`),fontSize:t=>e.get(t,`font.size.small`,`theme.font.size.small`),lineHeight:t=>e.get(t,`font.line.height.small`,`theme.font.line.height.small`)}},success:{wrapper:{},content:{},icon:{name:`success`,fill:`icon.success`}},warning:{wrapper:{},content:{},icon:{name:`warning`,fill:`icon.warning`}},error:{wrapper:{},content:{},icon:{name:`error`,fill:`icon.error`}},info:{wrapper:{},content:{},icon:{name:`info`,fill:`icon.info`}},basic:{wrapper:{border:n=>t.borders.generic({width:e.get(n,`values.borderThin`,`theme.values.borderThin`),color:e.get(n,`colors.border.default`,`theme.colors.border.default`)}),boxShadow:t=>e.get(t,`shadows.inlineNotification.default`,`theme.shadows.inlineNotification.default`),padding:t=>{let n=e.get(t,`spacing.sm`,`theme.spacing.sm`),r=e.get(t,`spacing.md`,`theme.spacing.md`);return`${n} ${r} ${n} ${r}`}},content:{fontWeight:t=>e.get(t,`font.weight.normal`,`theme.font.weight.normal`)},icon:{name:``}}};exports.inlineNotification=r;

package/tokens/inlineNotification.d.cts

@@ -0,0 +1,62 @@
+export declare const inlineNotification: {
+    default: {
+        wrapper: {
+            display: string;
+            alignItems: string;
+            gap: (theme: Record<symbol, unknown>) => string;
+            width: string;
+        };
+        content: {
+            flex: number;
+            fontFamily: (theme: Record<symbol, unknown>) => string;
+            fontWeight: (theme: Record<symbol, unknown>) => string;
+            fontSize: (theme: Record<symbol, unknown>) => string;
+            lineHeight: (theme: Record<symbol, unknown>) => string;
+        };
+    };
+    success: {
+        wrapper: {};
+        content: {};
+        icon: {
+            name: string;
+            fill: string;
+        };
+    };
+    warning: {
+        wrapper: {};
+        content: {};
+        icon: {
+            name: string;
+            fill: string;
+        };
+    };
+    error: {
+        wrapper: {};
+        content: {};
+        icon: {
+            name: string;
+            fill: string;
+        };
+    };
+    info: {
+        wrapper: {};
+        content: {};
+        icon: {
+            name: string;
+            fill: string;
+        };
+    };
+    basic: {
+        wrapper: {
+            border: (theme: Record<symbol, unknown>) => string;
+            boxShadow: (theme: Record<symbol, unknown>) => string;
+            padding: (theme: Record<symbol, unknown>) => string;
+        };
+        content: {
+            fontWeight: (theme: Record<symbol, unknown>) => string;
+        };
+        icon: {
+            name: string;
+        };
+    };
+};

package/tokens/input.cjs

@@ -1 +1 @@
-const e=require(`../utils/helpers.cjs`),t=require(`./utils.cjs`),n=require(`./borders.cjs`),r=require(`../assets/svg/checkbox_border.cjs`),i=require(`../assets/svg/checkbox_bg_checked.cjs`),a=require(`../assets/svg/checkbox_disabled_bg_checked.cjs`),o=require(`../assets/svg/radio_bg.cjs`),s=require(`../assets/svg/radio_bg_checked.cjs`);var c=(e,t)=>({position:`absolute`,top:0,left:0,width:`100%`,height:`100%`,border:n.borders.generic({width:t,color:e})}),l={wrapper:{default:{boxSizing:`border-box`,display:`inline-flex`,alignSelf:`stretch`,alignItems:`center`,position:`relative`},withGap:{flexDirection:`column`,alignItems:`flex-start`,gap:t=>e.get(t,`spacing.xs`,`theme.spacing.xs`)}},input:{default:{padding:t=>e.get(t,`spacing.sm`,`theme.spacing.sm`),outline:`none`,position:`relative`,cursor:`text`,border:n.borders.none,backgroundColor:`transparent`,color:t=>e.get(t,`colors.text.default`,`theme.colors.text.default`),"&::placeholder":{color:t=>e.get(t,`colors.text.disabled`,`theme.colors.text.disabled`)},'&:not([type="radio"], [type="checkbox"], [type="range"])':{height:`40px`,width:`100%`,zIndex:t=>e.get(t,`zIndex.first`,`theme.zIndex.first`)},'&[type="number"]':{appearance:`textfield`,"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button":{appearance:`none`,margin:0}},"&[readonly], &:disabled":{color:t=>e.get(t,`colors.text.disabled`,`theme.colors.text.disabled`),cursor:`default`},'&[type="checkbox"]':{cursor:`pointer`,appearance:`none`,height:`18px`,width:`18px`,backgroundColor:`transparent`,border:`none`,backgroundImage:t.getImgSrc(r.default),"&:focus-visible":r=>t.getFocusStyles({inset:`-4px`,borderRadius:`3px`,border:n.borders.generic({width:`2px`,color:e.get(r,`colors.border.focus`,`theme.colors.border.focus`)})})},'&[type="checkbox"]:not(:checked)':{"&[readonly], &:disabled":{opacity:.5}},'&[type="checkbox"]:checked':{backgroundRepeat:`no-repeat`,backgroundPosition:`center`,backgroundSize:`18px`,backgroundColor:t=>e.get(t,`colors.neutral.white`,`theme.colors.neutral.white`),border:`none`,backgroundImage:t.getImgSrc(i.default),"&[readonly], &:disabled":{backgroundImage:t.getImgSrc(a.default)}},'&[type="radio"]':{cursor:`pointer`,appearance:`none`,height:`20px`,width:`20px`,border:`none`,backgroundImage:t.getImgSrc(o.default),"&:focus-visible":r=>t.getFocusStyles({inset:`-4px`,borderRadius:`50%`,border:n.borders.generic({width:`2px`,color:e.get(r,`colors.border.focus`,`theme.colors.border.focus`)})}),"&[readonly], &:disabled":{opacity:.5}},'&[type="radio"]:checked':{backgroundImage:t.getImgSrc(s.default)}},defaultInteraction:{"&:focus-visible ~ .Input__outline":{position:`absolute`,top:0,left:0,bottom:0,width:`100%`,outline:e=>n.borders.focus(e),borderRadius:t=>e.get(t,`radius.none`,`theme.radius.none`),outlineOffset:`3px`},"& + .Input__border":{borderRadius:t=>e.get(t,`radius.none`,`theme.radius.none`)}},mouseInteraction:{"&:focus-visible ~ .Input__outline":{},"& + .Input__border":{borderRadius:t=>e.get(t,`radius.none`,`theme.radius.none`)}},primary:{"& + .Input__border":t=>c(e.get(t,`colors.border.default`,`theme.colors.border.default`),e.get(t,`values.borderThin`,`theme.values.borderThin`))},success:{"& + .Input__border":t=>c(e.get(t,`colors.border.success`,`theme.colors.border.success`),e.get(t,`values.borderThin`,`theme.values.borderThin`))},warning:{"& + .Input__border":t=>c(e.get(t,`colors.border.primary`,`theme.colors.border.primary`),e.get(t,`values.borderThin`,`theme.values.borderThin`))},error:{"& + .Input__border":t=>c(e.get(t,`colors.border.error`,`theme.colors.border.error`),e.get(t,`values.borderThin`,`theme.values.borderThin`))}},helper:{default:{sm:{fontSize:t=>e.get(t,`font.size.caption`,`font.size.caption`),fontWeight:t=>e.get(t,`font.weight.normal`,`theme.font.weight.normal`),lineHeight:t=>e.get(t,`font.line.height.caption`,`theme.font.line.height.caption`)},md:{color:t=>e.get(t,`colors.text.default`,`theme.colors.text.default`),fontSize:t=>e.get(t,`font.size.small`,`theme.font.size.small`),fontWeight:t=>e.get(t,`font.weight.normal`,`theme.font.weight.normal`),lineHeight:t=>e.get(t,`font.line.height.small`,`theme.font.line.height.small`)}},primary:{sm:{color:t=>e.get(t,`colors.text.default`,`theme.colors.text.default`)},md:{}},success:{sm:{color:t=>e.get(t,`colors.text.success`,`theme.colors.text.success`)},md:{}},warning:{sm:{color:t=>e.get(t,`colors.text.primary`,`theme.colors.text.primary`)},md:{}},error:{sm:{color:t=>e.get(t,`colors.text.error`,`theme.colors.text.error`)},md:{}}},adornment:{default:{display:`flex`,alignItems:`center`,position:`relative`,zIndex:t=>e.get(t,`zIndex.first`,`theme.zIndex.first`)}}};exports.input=l;
+const e=require("../utils/helpers.cjs"),t=require("./utils.cjs"),n=require("./borders.cjs"),r=require("../assets/svg/checkbox_border.cjs"),i=require("../assets/svg/checkbox_bg_checked.cjs"),a=require("../assets/svg/checkbox_disabled_bg_checked.cjs"),o=require("../assets/svg/radio_bg.cjs"),s=require("../assets/svg/radio_bg_checked.cjs");var c=(e,t)=>({position:`absolute`,top:0,left:0,width:`100%`,height:`100%`,border:n.borders.generic({width:t,color:e})}),l={wrapper:{default:{boxSizing:`border-box`,display:`inline-flex`,alignSelf:`stretch`,alignItems:`center`,position:`relative`},withGap:{flexDirection:`column`,alignItems:`flex-start`,gap:t=>e.get(t,`spacing.xs`,`theme.spacing.xs`)}},input:{default:{padding:t=>e.get(t,`spacing.sm`,`theme.spacing.sm`),outline:`none`,position:`relative`,cursor:`text`,border:n.borders.none,backgroundColor:`transparent`,color:t=>e.get(t,`colors.text.default`,`theme.colors.text.default`),"&::placeholder":{color:t=>e.get(t,`colors.text.disabled`,`theme.colors.text.disabled`)},'&:not([type="radio"], [type="checkbox"], [type="range"])':{height:`40px`,width:`100%`,zIndex:t=>e.get(t,`zIndex.first`,`theme.zIndex.first`)},'&[type="number"]':{appearance:`textfield`,"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button":{appearance:`none`,margin:0}},"&[readonly], &:disabled":{color:t=>e.get(t,`colors.text.disabled`,`theme.colors.text.disabled`),cursor:`default`},'&[type="checkbox"]':{cursor:`pointer`,appearance:`none`,height:`18px`,width:`18px`,backgroundColor:`transparent`,border:`none`,backgroundImage:t.getImgSrc(r.default),"&:focus-visible":r=>t.getFocusStyles({inset:`-4px`,borderRadius:`3px`,border:n.borders.generic({width:`2px`,color:e.get(r,`colors.border.focus`,`theme.colors.border.focus`)})})},'&[type="checkbox"]:not(:checked)':{"&[readonly], &:disabled":{opacity:.5}},'&[type="checkbox"]:checked':{backgroundRepeat:`no-repeat`,backgroundPosition:`center`,backgroundSize:`18px`,backgroundColor:t=>e.get(t,`colors.neutral.white`,`theme.colors.neutral.white`),border:`none`,backgroundImage:t.getImgSrc(i.default),"&[readonly], &:disabled":{backgroundImage:t.getImgSrc(a.default)}},'&[type="radio"]':{cursor:`pointer`,appearance:`none`,height:`20px`,width:`20px`,border:`none`,backgroundImage:t.getImgSrc(o.default),"&:focus-visible":r=>t.getFocusStyles({inset:`-4px`,borderRadius:`50%`,border:n.borders.generic({width:`2px`,color:e.get(r,`colors.border.focus`,`theme.colors.border.focus`)})}),"&[readonly], &:disabled":{opacity:.5}},'&[type="radio"]:checked':{backgroundImage:t.getImgSrc(s.default)}},defaultInteraction:{"&:focus-visible ~ .Input__outline":{position:`absolute`,top:0,left:0,bottom:0,width:`100%`,outline:e=>n.borders.focus(e),borderRadius:t=>e.get(t,`radius.none`,`theme.radius.none`),outlineOffset:`3px`},"& + .Input__border":{borderRadius:t=>e.get(t,`radius.none`,`theme.radius.none`)}},mouseInteraction:{"&:focus-visible ~ .Input__outline":{},"& + .Input__border":{borderRadius:t=>e.get(t,`radius.none`,`theme.radius.none`)}},primary:{"& + .Input__border":t=>c(e.get(t,`colors.border.default`,`theme.colors.border.default`),e.get(t,`values.borderThin`,`theme.values.borderThin`))},success:{"& + .Input__border":t=>c(e.get(t,`colors.border.success`,`theme.colors.border.success`),e.get(t,`values.borderThin`,`theme.values.borderThin`))},warning:{"& + .Input__border":t=>c(e.get(t,`colors.border.primary`,`theme.colors.border.primary`),e.get(t,`values.borderThin`,`theme.values.borderThin`))},error:{"& + .Input__border":t=>c(e.get(t,`colors.border.error`,`theme.colors.border.error`),e.get(t,`values.borderThin`,`theme.values.borderThin`))}},helper:{default:{sm:{fontSize:t=>e.get(t,`font.size.caption`,`font.size.caption`),fontWeight:t=>e.get(t,`font.weight.normal`,`theme.font.weight.normal`),lineHeight:t=>e.get(t,`font.line.height.caption`,`theme.font.line.height.caption`)},md:{color:t=>e.get(t,`colors.text.default`,`theme.colors.text.default`),fontSize:t=>e.get(t,`font.size.small`,`theme.font.size.small`),fontWeight:t=>e.get(t,`font.weight.normal`,`theme.font.weight.normal`),lineHeight:t=>e.get(t,`font.line.height.small`,`theme.font.line.height.small`)}},primary:{sm:{color:t=>e.get(t,`colors.text.default`,`theme.colors.text.default`)},md:{}},success:{sm:{color:t=>e.get(t,`colors.text.success`,`theme.colors.text.success`)},md:{}},warning:{sm:{color:t=>e.get(t,`colors.text.primary`,`theme.colors.text.primary`)},md:{}},error:{sm:{color:t=>e.get(t,`colors.text.error`,`theme.colors.text.error`)},md:{}}},adornment:{default:{display:`flex`,alignItems:`center`,position:`relative`,zIndex:t=>e.get(t,`zIndex.first`,`theme.zIndex.first`)}}};exports.input=l;