@telia/teddy 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +661 -0
- package/README.md +82 -0
- package/dist/assets/button.css +1 -0
- package/dist/assets/f2a2f391a886d395.svg +284 -0
- package/dist/assets/field-error-text.css +1 -0
- package/dist/assets/helper-text.css +1 -0
- package/dist/assets/icon.css +1 -0
- package/dist/assets/input.css +1 -0
- package/dist/assets/label.css +1 -0
- package/dist/assets/main.css +1 -0
- package/dist/assets/spinner.css +1 -0
- package/dist/assets/text-field.css +1 -0
- package/dist/assets/text.css +1 -0
- package/dist/clsx-DB4S2d7J.js +22 -0
- package/dist/components/button/button.d.ts +24 -0
- package/dist/components/button/button.js +95 -0
- package/dist/components/button/index.d.ts +2 -0
- package/dist/components/button/index.js +4 -0
- package/dist/components/field-error-text/field-error-text.d.ts +8 -0
- package/dist/components/field-error-text/field-error-text.js +28 -0
- package/dist/components/field-error-text/index.d.ts +2 -0
- package/dist/components/field-error-text/index.js +4 -0
- package/dist/components/helper-text/helper-text.d.ts +5 -0
- package/dist/components/helper-text/helper-text.js +20 -0
- package/dist/components/helper-text/index.d.ts +2 -0
- package/dist/components/helper-text/index.js +4 -0
- package/dist/components/icon/icon.d.ts +10 -0
- package/dist/components/icon/icon.js +27 -0
- package/dist/components/icon/index.d.ts +4 -0
- package/dist/components/icon/index.js +6 -0
- package/dist/components/index.d.ts +9 -0
- package/dist/components/index.js +23 -0
- package/dist/components/input/index.d.ts +2 -0
- package/dist/components/input/index.js +5 -0
- package/dist/components/input/input.d.ts +53 -0
- package/dist/components/input/input.js +82 -0
- package/dist/components/label/index.d.ts +2 -0
- package/dist/components/label/index.js +4 -0
- package/dist/components/label/label.d.ts +9 -0
- package/dist/components/label/label.js +61 -0
- package/dist/components/spinner/index.d.ts +1 -0
- package/dist/components/spinner/index.js +4 -0
- package/dist/components/spinner/spinner.d.ts +26 -0
- package/dist/components/spinner/spinner.js +50 -0
- package/dist/components/text/index.d.ts +2 -0
- package/dist/components/text/index.js +4 -0
- package/dist/components/text/text.d.ts +33 -0
- package/dist/components/text/text.js +51 -0
- package/dist/components/text-field/index.d.ts +2 -0
- package/dist/components/text-field/index.js +4 -0
- package/dist/components/text-field/text-field.d.ts +101 -0
- package/dist/components/text-field/text-field.js +141 -0
- package/dist/icons/name.d.js +1 -0
- package/dist/icons/name.d.ts +2 -0
- package/dist/icons/name.js +283 -0
- package/dist/index-TI1xsy6a.js +70 -0
- package/dist/main.d.ts +2 -0
- package/dist/main.js +38 -0
- package/dist/teams/business/index.d.ts +0 -0
- package/dist/teams/business/index.js +1 -0
- package/dist/teams/index.d.ts +0 -0
- package/dist/teams/index.js +1 -0
- package/dist/teams/min-side/index.d.ts +0 -0
- package/dist/teams/min-side/index.js +1 -0
- package/dist/teams/webshop/index.d.ts +0 -0
- package/dist/teams/webshop/index.js +1 -0
- package/dist/tokens/border/variables.d.ts +9 -0
- package/dist/tokens/border/variables.js +12 -0
- package/dist/tokens/breakpoint/variables.d.ts +4 -0
- package/dist/tokens/breakpoint/variables.js +7 -0
- package/dist/tokens/color/variables.d.ts +226 -0
- package/dist/tokens/color/variables.js +229 -0
- package/dist/tokens/index.d.ts +7 -0
- package/dist/tokens/index.js +16 -0
- package/dist/tokens/motion/variables.d.ts +11 -0
- package/dist/tokens/motion/variables.js +14 -0
- package/dist/tokens/shadow/variables.d.ts +4 -0
- package/dist/tokens/shadow/variables.js +7 -0
- package/dist/tokens/spacing/variables.d.ts +23 -0
- package/dist/tokens/spacing/variables.js +26 -0
- package/dist/tokens/typography/variables.d.ts +24 -0
- package/dist/tokens/typography/variables.js +27 -0
- package/dist/utils/action.d.ts +36 -0
- package/dist/utils/action.js +18 -0
- package/dist/variables-BKiPmtHY.js +458 -0
- package/dist/variables-BkY5b0io.js +14 -0
- package/dist/variables-Bq0YUbLS.js +14 -0
- package/dist/variables-CDK515QX.js +52 -0
- package/dist/variables-CMRTN8qo.js +28 -0
- package/dist/variables-Dmoh9YtD.js +54 -0
- package/dist/variables-IczXZ5CN.js +24 -0
- package/dist/vite-env.d.js +1 -0
- package/package.json +112 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._teddy-field-error-text_1735t_1{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-100);line-height:var(--teddy-typography-line-height-loose);color:var(--teddy-color-text-status-error-strong);display:flex;flex-direction:row;gap:var(--teddy-spacing-50);align-items:center}._teddy-field-error-text__indicator_1735t_12{color:var(--teddy-color-text-status-error-medium);line-height:var(--teddy-typography-line-height-tight)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._teddy-helper-text_6xdzb_1{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-75);line-height:var(--teddy-typography-line-height-loose);color:var(--teddy-color-text-medium);display:block}._teddy-helper-text--disabled_6xdzb_9{color:var(--teddy-color-text-weak)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._teddy-icon_mqgol_1{display:inline;align-self:center;fill:currentColor}._teddy-icon--font_mqgol_6{width:1em;height:1em}._teddy-icon--xxs_mqgol_10{width:var(--teddy-spacing-150);height:var(--teddy-spacing-150)}._teddy-icon--xs_mqgol_14{width:var(--teddy-spacing-200);height:var(--teddy-spacing-200)}._teddy-icon--sm_mqgol_18{width:var(--teddy-spacing-250);height:var(--teddy-spacing-250)}._teddy-icon--md_mqgol_22{width:var(--teddy-spacing-300);height:var(--teddy-spacing-300)}._teddy-icon--lg_mqgol_26{width:var(--teddy-spacing-400);height:var(--teddy-spacing-400)}._teddy-icon--xl_mqgol_30{width:var(--teddy-spacing-600);height:var(--teddy-spacing-600)}._teddy-icon-with-children_mqgol_35{display:inline-flex;align-items:center;font-family:var(--teddy-typography-family-default);gap:var(--teddy-spacing-100)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@keyframes _fadeInAnimation_1bk8x_1{0%{opacity:0}to{opacity:1}}@keyframes _scaleInAnimation_1bk8x_1{0%{scale:0}to{scale:100%}}._teddy-input_1bk8x_17{position:relative;cursor:text;display:flex;padding:calc(var(--teddy-spacing-100) + var(--teddy-spacing-25)) var(--teddy-spacing-150);gap:var(--teddy-spacing-50)}._teddy-input__frame_1bk8x_24{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--teddy-border-radius-sm);border:var(--teddy-border-width-xs) solid var(--teddy-color-border-interactive-subtle);pointer-events:none}._teddy-input__input_1bk8x_31{border-radius:var(--teddy-border-radius-sm);border:none;box-sizing:border-box;font-family:var(--teddy-typography-family-default);font-size:var(--teddy-typography-scale-100);line-height:150%;outline:none;background:transparent;width:100%;flex:1 1 100%}._teddy-input__input_1bk8x_31:active:not(:disabled):not(:read-only)~._teddy-input__frame_1bk8x_24,._teddy-input__input_1bk8x_31:focus:not(:disabled):not(:read-only)~._teddy-input__frame_1bk8x_24{outline:var(--teddy-border-width-sm) solid var(--teddy-color-border-interactive-focus);outline-offset:calc(var(--teddy-spacing-10) * 2);border-width:var(--teddy-border-width-xs);border-color:var(--teddy-color-border-interactive-subtle-hover)}._teddy-input__input_1bk8x_31:disabled{color:var(--teddy-color-text-weak)}._teddy-input__input_1bk8x_31:disabled~._teddy-input__frame_1bk8x_24{border-width:var(--teddy-border-width-xs);border-color:var(--teddy-color-border-medium)}._teddy-input__input_1bk8x_31:read-only:not(:disabled){color:var(--teddy-color-text-default)}._teddy-input__input_1bk8x_31:read-only:not(:disabled)~._teddy-input__frame_1bk8x_24{border-width:var(--teddy-border-width-xs)}._teddy-input__input_1bk8x_31:read-only:not(:disabled):not(._teddy-input__input--valid_1bk8x_62):not(._teddy-input__input--invalid_1bk8x_62)~._teddy-input__frame_1bk8x_24{border-color:var(--teddy-color-border-medium)}._teddy-input__input--valid_1bk8x_62~._teddy-input__frame_1bk8x_24{border-color:var(--teddy-color-border-status-success)}._teddy-input__input--valid_1bk8x_62~._teddy-input__indicator_1bk8x_68{color:var(--teddy-color-border-status-success)}._teddy-input__input--error_1bk8x_71:not(:hover)~._teddy-input__frame_1bk8x_24{border-color:var(--teddy-color-border-status-error)}._teddy-input_1bk8x_17>*:not(._teddy-input__input_1bk8x_31){flex:0 0 auto}._teddy-input__indicator_1bk8x_68{animation:_fadeInAnimation_1bk8x_1 ease var(--teddy-motion-duration-300),_scaleInAnimation_1bk8x_1 ease var(--teddy-motion-duration-300)}._teddy-input_1bk8x_17:has(input:disabled){background-color:var(--teddy-color-background-interactive-disabled)}._teddy-input_1bk8x_17:has(input:read-only){background-color:var(--teddy-color-background-interactive-read-only)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._teddy-label_rfe6h_1{color:var(--teddy-color-text-default);font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-medium);font-size:var(--teddy-typography-scale-100);line-height:var(--teddy-typography-line-height-default)}._teddy-label--disabled_rfe6h_8{color:var(--teddy-color-text-weak);cursor:default}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--purpur-border-radius-xs: 2px;--purpur-border-radius-sm: 4px;--purpur-border-radius-md: 8px;--purpur-border-radius-lg: 16px;--purpur-border-radius-full: 999px;--purpur-border-width-xs: 1px;--purpur-border-width-sm: 2px;--purpur-border-width-md: 3px;--purpur-border-width-lg: 6px}:root{--purpur-breakpoint-sm: 0px;--purpur-breakpoint-md: 600px;--purpur-breakpoint-lg: 1024px;--purpur-breakpoint-xl: 1440px;--purpur-breakpoint-relative-sm: 0em;--purpur-breakpoint-relative-md: 37.5em;--purpur-breakpoint-relative-lg: 64em;--purpur-breakpoint-relative-xl: 90em}:root{--purpur-color-functional-transparent: rgba(255, 255, 255, 0);--purpur-color-functional-white: #ffffff;--purpur-color-functional-black: #000000;--purpur-color-transparent-white-950: rgba(255, 255, 255, .95);--purpur-color-transparent-white-900: rgba(255, 255, 255, .89);--purpur-color-transparent-white-850: rgba(255, 255, 255, .84);--purpur-color-transparent-white-800: rgba(255, 255, 255, .79);--purpur-color-transparent-white-700: rgba(255, 255, 255, .66);--purpur-color-transparent-white-600: rgba(255, 255, 255, .55);--purpur-color-transparent-white-500: rgba(255, 255, 255, .46);--purpur-color-transparent-white-400: rgba(255, 255, 255, .37);--purpur-color-transparent-white-300: rgba(255, 255, 255, .29);--purpur-color-transparent-white-200: rgba(255, 255, 255, .21);--purpur-color-transparent-white-150: rgba(255, 255, 255, .16);--purpur-color-transparent-white-100: rgba(255, 255, 255, .11);--purpur-color-transparent-white-50: rgba(255, 255, 255, .07);--purpur-color-transparent-black-950: rgba(0, 0, 0, .93);--purpur-color-transparent-black-900: rgba(0, 0, 0, .88);--purpur-color-transparent-black-850: rgba(0, 0, 0, .84);--purpur-color-transparent-black-800: rgba(0, 0, 0, .8);--purpur-color-transparent-black-700: rgba(0, 0, 0, .71);--purpur-color-transparent-black-600: rgba(0, 0, 0, .62);--purpur-color-transparent-black-500: rgba(0, 0, 0, .54);--purpur-color-transparent-black-400: rgba(0, 0, 0, .44);--purpur-color-transparent-black-300: rgba(0, 0, 0, .33);--purpur-color-transparent-black-200: rgba(0, 0, 0, .22);--purpur-color-transparent-black-150: rgba(0, 0, 0, .16);--purpur-color-transparent-black-100: rgba(0, 0, 0, .1);--purpur-color-transparent-black-50: rgba(0, 0, 0, .05);--purpur-color-blue-950: #011320;--purpur-color-blue-900: #002036;--purpur-color-blue-800: #03385b;--purpur-color-blue-700: #014d80;--purpur-color-blue-600: #0063a6;--purpur-color-blue-500: #0078cb;--purpur-color-blue-400: #3694d3;--purpur-color-blue-300: #62b2e7;--purpur-color-blue-200: #91cdf4;--purpur-color-blue-100: #caeaff;--purpur-color-blue-50: #e8f6ff;--purpur-color-orange-950: #1a0f00;--purpur-color-orange-900: #2b1b03;--purpur-color-orange-800: #4c2f03;--purpur-color-orange-700: #6a4102;--purpur-color-orange-600: #8b5301;--purpur-color-orange-500: #a86602;--purpur-color-orange-400: #cc7a00;--purpur-color-orange-300: #f39200;--purpur-color-orange-200: #f9bb5b;--purpur-color-orange-100: #ffe1b3;--purpur-color-orange-50: #fff2de;--purpur-color-red-950: #2c000e;--purpur-color-red-900: #440016;--purpur-color-red-800: #700025;--purpur-color-red-700: #980233;--purpur-color-red-600: #c00543;--purpur-color-red-500: #e4175c;--purpur-color-red-400: #fb4885;--purpur-color-red-300: #ff80ab;--purpur-color-red-200: #ffafc9;--purpur-color-red-100: #ffdde8;--purpur-color-red-50: #fff0f5;--purpur-color-green-950: #00150a;--purpur-color-green-900: #002411;--purpur-color-green-800: #003e1e;--purpur-color-green-700: #02562b;--purpur-color-green-600: #017037;--purpur-color-green-500: #018842;--purpur-color-green-400: #1fa15e;--purpur-color-green-300: #3dbf7c;--purpur-color-green-200: #79d9a7;--purpur-color-green-100: #c5efd9;--purpur-color-green-50: #e1f9ec;--purpur-color-gray-950: #111111;--purpur-color-gray-900: #1e1e20;--purpur-color-gray-850: #2a2a2c;--purpur-color-gray-800: #353537;--purpur-color-gray-700: #4a4a4d;--purpur-color-gray-600: #5f5f63;--purpur-color-gray-500: #757579;--purpur-color-gray-400: #8d8d94;--purpur-color-gray-300: #aaaab0;--purpur-color-gray-200: #c6c6cd;--purpur-color-gray-150: #d6d6dd;--purpur-color-gray-100: #e5e5eb;--purpur-color-gray-50: #f3f3f8;--purpur-color-teal-950: #011413;--purpur-color-teal-900: #032220;--purpur-color-teal-800: #063c39;--purpur-color-teal-700: #02534f;--purpur-color-teal-600: #006c67;--purpur-color-teal-500: #00847e;--purpur-color-teal-400: #3a9b96;--purpur-color-teal-300: #6eb5b2;--purpur-color-teal-200: #a1cfcd;--purpur-color-teal-100: #d5eae9;--purpur-color-teal-50: #edf5f5;--purpur-color-beige-950: #170f09;--purpur-color-beige-900: #241c16;--purpur-color-beige-800: #3b332d;--purpur-color-beige-700: #4f4741;--purpur-color-beige-600: #665e58;--purpur-color-beige-500: #807268;--purpur-color-beige-400: #a08877;--purpur-color-beige-300: #bba494;--purpur-color-beige-200: #d7c3b5;--purpur-color-beige-100: #ede1d8;--purpur-color-beige-50: #f9f1ec;--purpur-color-purple-950: #1f002e;--purpur-color-purple-900: #29003e;--purpur-color-purple-800: #4e0174;--purpur-color-purple-700: #6d02a3;--purpur-color-purple-600: #8c07d0;--purpur-color-purple-550: #990ae3;--purpur-color-purple-500: #b12df4;--purpur-color-purple-400: #c461f7;--purpur-color-purple-300: #d58df9;--purpur-color-purple-200: #e4b6fb;--purpur-color-purple-100: #f5e0ff;--purpur-color-purple-50: #faf0ff;--purpur-color-overlay-default: var(--purpur-color-transparent-black-300);--purpur-color-border-status-success: var(--purpur-color-green-500);--purpur-color-border-status-info: var(--purpur-color-blue-500);--purpur-color-border-status-warning: var(--purpur-color-orange-400);--purpur-color-border-status-error: var(--purpur-color-red-500);--purpur-color-border-interactive-subtle-hover: var(--purpur-color-purple-800);--purpur-color-border-interactive-subtle: var(--purpur-color-transparent-black-300);--purpur-color-border-interactive-selected: var(--purpur-color-purple-550);--purpur-color-border-interactive-primary-negative-active: var(--purpur-color-purple-200);--purpur-color-border-interactive-primary-negative-hover: var(--purpur-color-purple-200);--purpur-color-border-interactive-primary-active: var(--purpur-color-purple-900);--purpur-color-border-interactive-primary-hover: var(--purpur-color-purple-800);--purpur-color-border-interactive-primary-negative: var(--purpur-color-purple-100);--purpur-color-border-interactive-primary: var(--purpur-color-purple-700);--purpur-color-border-interactive-focus: var(--purpur-color-purple-500);--purpur-color-border-weak-negative: var(--purpur-color-transparent-white-150);--purpur-color-border-weak: var(--purpur-color-transparent-black-150);--purpur-color-border-strong-negative: var(--purpur-color-transparent-white-500);--purpur-color-border-strong: var(--purpur-color-transparent-black-500);--purpur-color-border-medium-negative: var(--purpur-color-transparent-white-300);--purpur-color-border-medium: var(--purpur-color-transparent-black-300);--purpur-color-background-tone-on-tone-quaternary: var(--purpur-color-beige-50);--purpur-color-background-tone-on-tone-tertiary: var(--purpur-color-beige-100);--purpur-color-background-tone-on-tone-secondary: var(--purpur-color-purple-100);--purpur-color-background-tone-on-tone-primary: var(--purpur-color-purple-900);--purpur-color-background-status-attention: var(--purpur-color-purple-700);--purpur-color-background-status-special: var(--purpur-color-purple-100);--purpur-color-background-status-neutral: var(--purpur-color-gray-100);--purpur-color-background-status-warning-strong: var(--purpur-color-orange-100);--purpur-color-background-status-warning: var(--purpur-color-orange-50);--purpur-color-background-status-error-strong: var(--purpur-color-red-100);--purpur-color-background-status-error: var(--purpur-color-red-50);--purpur-color-background-status-success-strong: var(--purpur-color-green-100);--purpur-color-background-status-success: var(--purpur-color-green-50);--purpur-color-background-status-info-strong: var(--purpur-color-blue-100);--purpur-color-background-status-info: var(--purpur-color-blue-50);--purpur-color-background-interactive-destructive-active: var(--purpur-color-red-700);--purpur-color-background-interactive-destructive-hover: var(--purpur-color-red-600);--purpur-color-background-interactive-destructive: var(--purpur-color-red-500);--purpur-color-background-interactive-read-only: var(--purpur-color-transparent-black-50);--purpur-color-background-interactive-inactive-negative: var(--purpur-color-transparent-white-150);--purpur-color-background-interactive-inactive: var(--purpur-color-transparent-black-50);--purpur-color-background-interactive-transparent-negative-active: var(--purpur-color-purple-700);--purpur-color-background-interactive-transparent-active: var(--purpur-color-purple-200);--purpur-color-background-interactive-transparent-negative-hover: var(--purpur-color-purple-800);--purpur-color-background-interactive-transparent-hover: var(--purpur-color-purple-100);--purpur-color-background-interactive-transparent: var(--purpur-color-functional-transparent);--purpur-color-background-interactive-disabled-negative: var(--purpur-color-transparent-white-100);--purpur-color-background-interactive-disabled: var(--purpur-color-transparent-black-100);--purpur-color-background-interactive-expressive-negative-active: var(--purpur-color-purple-300);--purpur-color-background-interactive-expressive-negative-hover: var(--purpur-color-purple-400);--purpur-color-background-interactive-expressive-negative: var(--purpur-color-purple-550);--purpur-color-background-interactive-expressive-active: var(--purpur-color-purple-800);--purpur-color-background-interactive-expressive-hover: var(--purpur-color-purple-700);--purpur-color-background-interactive-expressive: var(--purpur-color-purple-550);--purpur-color-background-interactive-primary-negative-active: var(--purpur-color-purple-300);--purpur-color-background-interactive-primary-negative-hover: var(--purpur-color-purple-200);--purpur-color-background-interactive-primary-negative: var(--purpur-color-purple-100);--purpur-color-background-interactive-primary-active: var(--purpur-color-purple-600);--purpur-color-background-interactive-primary-hover: var(--purpur-color-purple-700);--purpur-color-background-interactive-primary: var(--purpur-color-purple-800);--purpur-color-background-secondary: var(--purpur-color-gray-50);--purpur-color-background-primary: var(--purpur-color-functional-white);--purpur-color-text-tone-on-tone-tertiary: var(--purpur-color-beige-700);--purpur-color-text-tone-on-tone-secondary: var(--purpur-color-purple-900);--purpur-color-text-tone-on-tone-primary: var(--purpur-color-purple-100);--purpur-color-text-status-attention: var(--purpur-color-functional-white);--purpur-color-text-status-special: var(--purpur-color-purple-800);--purpur-color-text-status-neutral: var(--purpur-color-transparent-black-700);--purpur-color-text-status-info-medium: var(--purpur-color-blue-500);--purpur-color-text-status-info-strong: var(--purpur-color-blue-700);--purpur-color-text-status-warning-medium: var(--purpur-color-orange-500);--purpur-color-text-status-warning-strong: var(--purpur-color-orange-700);--purpur-color-text-status-success-medium: var(--purpur-color-green-500);--purpur-color-text-status-success-strong: var(--purpur-color-green-700);--purpur-color-text-status-error-medium: var(--purpur-color-red-500);--purpur-color-text-status-error-strong: var(--purpur-color-red-700);--purpur-color-text-status-discount: var(--purpur-color-purple-550);--purpur-color-text-interactive-selected: var(--purpur-color-purple-550);--purpur-color-text-interactive-on-destructive: var(--purpur-color-functional-white);--purpur-color-text-interactive-on-expressive-negative-active: var(--purpur-color-purple-900);--purpur-color-text-interactive-on-expressive-negative-hover: var(--purpur-color-purple-900);--purpur-color-text-interactive-on-expressive-negative: var(--purpur-color-functional-white);--purpur-color-text-interactive-on-expressive: var(--purpur-color-functional-white);--purpur-color-text-interactive-primary-negative-active: var(--purpur-color-purple-200);--purpur-color-text-interactive-primary-negative-hover: var(--purpur-color-purple-200);--purpur-color-text-interactive-primary-negative: var(--purpur-color-purple-100);--purpur-color-text-interactive-on-primary-negative: var(--purpur-color-purple-800);--purpur-color-text-interactive-on-primary: var(--purpur-color-functional-white);--purpur-color-text-interactive-primary-active: var(--purpur-color-purple-900);--purpur-color-text-interactive-primary-hover: var(--purpur-color-purple-800);--purpur-color-text-interactive-primary: var(--purpur-color-purple-700);--purpur-color-text-weak-negative: var(--purpur-color-transparent-white-400);--purpur-color-text-medium-negative: var(--purpur-color-transparent-white-600);--purpur-color-text-default-negative: var(--purpur-color-transparent-white-850);--purpur-color-text-weak: var(--purpur-color-transparent-black-400);--purpur-color-text-medium: var(--purpur-color-transparent-black-600);--purpur-color-text-default: var(--purpur-color-transparent-black-850);--purpur-color-brand-white: var(--purpur-color-functional-white);--purpur-color-brand-off-black: var(--purpur-color-gray-900);--purpur-color-brand-light-beige: var(--purpur-color-beige-50);--purpur-color-brand-beige: var(--purpur-color-beige-100);--purpur-color-brand-deep-beige: var(--purpur-color-beige-700);--purpur-color-brand-light-purple: var(--purpur-color-purple-100);--purpur-color-brand-core-purple: var(--purpur-color-purple-550);--purpur-color-brand-deep-purple: var(--purpur-color-purple-900)}:root{--purpur-motion-duration-100: .1s;--purpur-motion-duration-150: .15s;--purpur-motion-duration-200: .2s;--purpur-motion-duration-300: .3s;--purpur-motion-duration-400: .4s;--purpur-motion-duration-500: .5s;--purpur-motion-duration-1500: 1.5s;--purpur-motion-duration-2000: 2s;--purpur-motion-easing-ease-in: cubic-bezier(.35, .07, .88, .43);--purpur-motion-easing-ease-out: cubic-bezier(.33, .9, .75, .95);--purpur-motion-easing-ease-in-out: cubic-bezier(.45, 0, .52, .98)}:root{--purpur-shadow-none: calc(0rem * var(--purpur-rescale)) calc(0rem * var(--purpur-rescale)) calc(0rem * var(--purpur-rescale)) calc(0rem * var(--purpur-rescale)) rgba(0, 0, 0, .1);--purpur-shadow-sm: calc(0rem * var(--purpur-rescale)) calc(.0625rem * var(--purpur-rescale)) calc(.25rem * var(--purpur-rescale)) calc(0rem * var(--purpur-rescale)) rgba(0, 0, 0, .1);--purpur-shadow-md: calc(0rem * var(--purpur-rescale)) calc(.25rem * var(--purpur-rescale)) calc(.75rem * var(--purpur-rescale)) calc(0rem * var(--purpur-rescale)) rgba(0, 0, 0, .1);--purpur-shadow-lg: calc(0rem * var(--purpur-rescale)) calc(.75rem * var(--purpur-rescale)) calc(1.5rem * var(--purpur-rescale)) calc(0rem * var(--purpur-rescale)) rgba(0, 0, 0, .1)}:root{--purpur-spacing-1600: calc(8rem * var(--purpur-rescale));--purpur-spacing-1200: calc(6rem * var(--purpur-rescale));--purpur-spacing-1000: calc(5rem * var(--purpur-rescale));--purpur-spacing-800: calc(4rem * var(--purpur-rescale));--purpur-spacing-600: calc(3rem * var(--purpur-rescale));--purpur-spacing-400: calc(2rem * var(--purpur-rescale));--purpur-spacing-300: calc(1.5rem * var(--purpur-rescale));--purpur-spacing-250: calc(1.25rem * var(--purpur-rescale));--purpur-spacing-200: calc(1rem * var(--purpur-rescale));--purpur-spacing-150: calc(.75rem * var(--purpur-rescale));--purpur-spacing-100: calc(.5rem * var(--purpur-rescale));--purpur-spacing-50: calc(.25rem * var(--purpur-rescale));--purpur-spacing-25: calc(.125rem * var(--purpur-rescale));--purpur-spacing-10: calc(.0625rem * var(--purpur-rescale));--purpur-spacing-0: calc(0rem * var(--purpur-rescale));--purpur-spacing-page-padding-xl: var(--purpur-spacing-600);--purpur-spacing-page-padding-lg: var(--purpur-spacing-600);--purpur-spacing-page-padding-md: var(--purpur-spacing-300);--purpur-spacing-page-padding-sm: var(--purpur-spacing-200);--purpur-spacing-gutter-xl: var(--purpur-spacing-300);--purpur-spacing-gutter-lg: var(--purpur-spacing-300);--purpur-spacing-gutter-md: var(--purpur-spacing-300);--purpur-spacing-gutter-sm: var(--purpur-spacing-200)}:root{--purpur-typography-family-default: TeliaSans;--purpur-typography-family-display: TeliaSansHeading;--purpur-typography-weight-normal: 400;--purpur-typography-weight-medium: 500;--purpur-typography-weight-bold: 700;--purpur-typography-line-height-tight: 100%;--purpur-typography-line-height-default: 125%;--purpur-typography-line-height-loose: 150%;--purpur-typography-line-height-looser: 175%;--purpur-typography-scale-50: calc(.75rem * var(--purpur-rescale));--purpur-typography-scale-75: calc(.875rem * var(--purpur-rescale));--purpur-typography-scale-100: calc(1rem * var(--purpur-rescale));--purpur-typography-scale-150: calc(1.125rem * var(--purpur-rescale));--purpur-typography-scale-200: calc(1.25rem * var(--purpur-rescale));--purpur-typography-scale-400: calc(1.5rem * var(--purpur-rescale));--purpur-typography-scale-500: calc(1.75rem * var(--purpur-rescale));--purpur-typography-scale-600: calc(2rem * var(--purpur-rescale));--purpur-typography-scale-650: calc(2.25rem * var(--purpur-rescale));--purpur-typography-scale-700: calc(2.5rem * var(--purpur-rescale));--purpur-typography-scale-800: calc(3rem * var(--purpur-rescale));--purpur-typography-scale-850: calc(3.5rem * var(--purpur-rescale));--purpur-typography-scale-900: calc(4rem * var(--purpur-rescale));--purpur-typography-scale-1000: calc(5rem * var(--purpur-rescale));--purpur-typography-scale-1100: calc(6rem * var(--purpur-rescale))}:root{--teddy-border-radius-xs: 2px;--teddy-border-radius-sm: 4px;--teddy-border-radius-md: 8px;--teddy-border-radius-lg: 16px;--teddy-border-radius-full: 999px;--teddy-border-width-xs: 1px;--teddy-border-width-sm: 2px;--teddy-border-width-md: 3px;--teddy-border-width-lg: 6px}:root{--teddy-breakpoint-sm: 0px;--teddy-breakpoint-md: 600px;--teddy-breakpoint-lg: 1024px;--teddy-breakpoint-xl: 1440px}:root{--teddy-color-functional-transparent: rgba(255, 255, 255, 0);--teddy-color-functional-white: #ffffff;--teddy-color-functional-black: #000000;--teddy-color-transparent-white-950: rgba(255, 255, 255, .95);--teddy-color-transparent-white-900: rgba(255, 255, 255, .89);--teddy-color-transparent-white-850: rgba(255, 255, 255, .84);--teddy-color-transparent-white-800: rgba(255, 255, 255, .79);--teddy-color-transparent-white-700: rgba(255, 255, 255, .66);--teddy-color-transparent-white-600: rgba(255, 255, 255, .55);--teddy-color-transparent-white-500: rgba(255, 255, 255, .46);--teddy-color-transparent-white-400: rgba(255, 255, 255, .37);--teddy-color-transparent-white-300: rgba(255, 255, 255, .29);--teddy-color-transparent-white-200: rgba(255, 255, 255, .21);--teddy-color-transparent-white-150: rgba(255, 255, 255, .16);--teddy-color-transparent-white-100: rgba(255, 255, 255, .11);--teddy-color-transparent-white-50: rgba(255, 255, 255, .07);--teddy-color-transparent-black-950: rgba(0, 0, 0, .93);--teddy-color-transparent-black-900: rgba(0, 0, 0, .88);--teddy-color-transparent-black-850: rgba(0, 0, 0, .84);--teddy-color-transparent-black-800: rgba(0, 0, 0, .8);--teddy-color-transparent-black-700: rgba(0, 0, 0, .71);--teddy-color-transparent-black-600: rgba(0, 0, 0, .62);--teddy-color-transparent-black-500: rgba(0, 0, 0, .54);--teddy-color-transparent-black-400: rgba(0, 0, 0, .44);--teddy-color-transparent-black-300: rgba(0, 0, 0, .33);--teddy-color-transparent-black-200: rgba(0, 0, 0, .22);--teddy-color-transparent-black-150: rgba(0, 0, 0, .16);--teddy-color-transparent-black-100: rgba(0, 0, 0, .1);--teddy-color-transparent-black-50: rgba(0, 0, 0, .05);--teddy-color-blue-950: #011320;--teddy-color-blue-900: #002036;--teddy-color-blue-800: #03385b;--teddy-color-blue-700: #014d80;--teddy-color-blue-600: #0063a6;--teddy-color-blue-500: #0078cb;--teddy-color-blue-400: #3694d3;--teddy-color-blue-300: #62b2e7;--teddy-color-blue-200: #91cdf4;--teddy-color-blue-100: #caeaff;--teddy-color-blue-50: #e8f6ff;--teddy-color-orange-950: #1a0f00;--teddy-color-orange-900: #2b1b03;--teddy-color-orange-800: #4c2f03;--teddy-color-orange-700: #6a4102;--teddy-color-orange-600: #8b5301;--teddy-color-orange-500: #a86602;--teddy-color-orange-400: #cc7a00;--teddy-color-orange-300: #f39200;--teddy-color-orange-200: #f9bb5b;--teddy-color-orange-100: #ffe1b3;--teddy-color-orange-50: #fff2de;--teddy-color-red-950: #2c000e;--teddy-color-red-900: #440016;--teddy-color-red-800: #700025;--teddy-color-red-700: #980233;--teddy-color-red-600: #c00543;--teddy-color-red-500: #e4175c;--teddy-color-red-400: #fb4885;--teddy-color-red-300: #ff80ab;--teddy-color-red-200: #ffafc9;--teddy-color-red-100: #ffdde8;--teddy-color-red-50: #fff0f5;--teddy-color-green-950: #00150a;--teddy-color-green-900: #002411;--teddy-color-green-800: #003e1e;--teddy-color-green-700: #02562b;--teddy-color-green-600: #017037;--teddy-color-green-500: #018842;--teddy-color-green-400: #1fa15e;--teddy-color-green-300: #3dbf7c;--teddy-color-green-200: #79d9a7;--teddy-color-green-100: #c5efd9;--teddy-color-green-50: #e1f9ec;--teddy-color-gray-950: #111111;--teddy-color-gray-900: #1e1e20;--teddy-color-gray-850: #2a2a2c;--teddy-color-gray-800: #353537;--teddy-color-gray-700: #4a4a4d;--teddy-color-gray-600: #5f5f63;--teddy-color-gray-500: #757579;--teddy-color-gray-400: #8d8d94;--teddy-color-gray-300: #aaaab0;--teddy-color-gray-200: #c6c6cd;--teddy-color-gray-150: #d6d6dd;--teddy-color-gray-100: #e5e5eb;--teddy-color-gray-50: #f3f3f8;--teddy-color-teal-950: #011413;--teddy-color-teal-900: #032220;--teddy-color-teal-800: #063c39;--teddy-color-teal-700: #02534f;--teddy-color-teal-600: #006c67;--teddy-color-teal-500: #00847e;--teddy-color-teal-400: #3a9b96;--teddy-color-teal-300: #6eb5b2;--teddy-color-teal-200: #a1cfcd;--teddy-color-teal-100: #d5eae9;--teddy-color-teal-50: #edf5f5;--teddy-color-beige-950: #170f09;--teddy-color-beige-900: #241c16;--teddy-color-beige-800: #3b332d;--teddy-color-beige-700: #4f4741;--teddy-color-beige-600: #665e58;--teddy-color-beige-500: #807268;--teddy-color-beige-400: #a08877;--teddy-color-beige-300: #bba494;--teddy-color-beige-200: #d7c3b5;--teddy-color-beige-100: #ede1d8;--teddy-color-beige-50: #f9f1ec;--teddy-color-purple-950: #1f002e;--teddy-color-purple-900: #29003e;--teddy-color-purple-800: #4e0174;--teddy-color-purple-700: #6d02a3;--teddy-color-purple-600: #8c07d0;--teddy-color-purple-550: #990ae3;--teddy-color-purple-500: #b12df4;--teddy-color-purple-400: #c461f7;--teddy-color-purple-300: #d58df9;--teddy-color-purple-200: #e4b6fb;--teddy-color-purple-100: #f5e0ff;--teddy-color-purple-50: #faf0ff;--teddy-color-overlay-default: var(--teddy-color-transparent-black-300);--teddy-color-border-status-success: var(--teddy-color-green-500);--teddy-color-border-status-info: var(--teddy-color-blue-500);--teddy-color-border-status-warning: var(--teddy-color-orange-400);--teddy-color-border-status-error: var(--teddy-color-red-500);--teddy-color-border-interactive-subtle-hover: var(--teddy-color-purple-800);--teddy-color-border-interactive-subtle: var(--teddy-color-transparent-black-300);--teddy-color-border-interactive-selected: var(--teddy-color-purple-550);--teddy-color-border-interactive-primary-negative-active: var(--teddy-color-purple-200);--teddy-color-border-interactive-primary-negative-hover: var(--teddy-color-purple-200);--teddy-color-border-interactive-primary-active: var(--teddy-color-purple-900);--teddy-color-border-interactive-primary-hover: var(--teddy-color-purple-800);--teddy-color-border-interactive-primary-negative: var(--teddy-color-purple-100);--teddy-color-border-interactive-primary: var(--teddy-color-purple-700);--teddy-color-border-interactive-focus: var(--teddy-color-blue-500);--teddy-color-border-weak-negative: var(--teddy-color-transparent-white-150);--teddy-color-border-weak: var(--teddy-color-transparent-black-150);--teddy-color-border-strong-negative: var(--teddy-color-transparent-white-500);--teddy-color-border-strong: var(--teddy-color-transparent-black-500);--teddy-color-border-medium-negative: var(--teddy-color-transparent-white-300);--teddy-color-border-medium: var(--teddy-color-transparent-black-300);--teddy-color-background-tone-on-tone-quaternary: var(--teddy-color-beige-50);--teddy-color-background-tone-on-tone-tertiary: var(--teddy-color-beige-100);--teddy-color-background-tone-on-tone-secondary: var(--teddy-color-purple-100);--teddy-color-background-tone-on-tone-primary: var(--teddy-color-purple-900);--teddy-color-background-status-attention: var(--teddy-color-purple-700);--teddy-color-background-status-special: var(--teddy-color-purple-100);--teddy-color-background-status-neutral: var(--teddy-color-gray-100);--teddy-color-background-status-warning-strong: var(--teddy-color-orange-100);--teddy-color-background-status-warning: var(--teddy-color-orange-50);--teddy-color-background-status-error-strong: var(--teddy-color-red-100);--teddy-color-background-status-error: var(--teddy-color-red-50);--teddy-color-background-status-success-strong: var(--teddy-color-green-100);--teddy-color-background-status-success: var(--teddy-color-green-50);--teddy-color-background-status-info-strong: var(--teddy-color-blue-100);--teddy-color-background-status-info: var(--teddy-color-blue-50);--teddy-color-background-interactive-destructive-active: var(--teddy-color-red-700);--teddy-color-background-interactive-destructive-hover: var(--teddy-color-red-600);--teddy-color-background-interactive-destructive: var(--teddy-color-red-500);--teddy-color-background-interactive-read-only: var(--teddy-color-transparent-black-50);--teddy-color-background-interactive-inactive-negative: var(--teddy-color-transparent-white-150);--teddy-color-background-interactive-inactive: var(--teddy-color-transparent-black-50);--teddy-color-background-interactive-transparent-negative-active: var(--teddy-color-purple-700);--teddy-color-background-interactive-transparent-active: var(--teddy-color-purple-200);--teddy-color-background-interactive-transparent-negative-hover: var(--teddy-color-purple-800);--teddy-color-background-interactive-transparent-hover: var(--teddy-color-purple-100);--teddy-color-background-interactive-transparent: var(--teddy-color-functional-transparent);--teddy-color-background-interactive-disabled-negative: var(--teddy-color-transparent-white-100);--teddy-color-background-interactive-disabled: var(--teddy-color-transparent-black-100);--teddy-color-background-interactive-expressive-negative-active: var(--teddy-color-purple-300);--teddy-color-background-interactive-expressive-negative-hover: var(--teddy-color-purple-400);--teddy-color-background-interactive-expressive-negative: var(--teddy-color-purple-550);--teddy-color-background-interactive-expressive-active: var(--teddy-color-purple-800);--teddy-color-background-interactive-expressive-hover: var(--teddy-color-purple-700);--teddy-color-background-interactive-expressive: var(--teddy-color-purple-550);--teddy-color-background-interactive-primary-negative-active: var(--teddy-color-purple-300);--teddy-color-background-interactive-primary-negative-hover: var(--teddy-color-purple-200);--teddy-color-background-interactive-primary-negative: var(--teddy-color-purple-100);--teddy-color-background-interactive-primary-active: var(--teddy-color-purple-600);--teddy-color-background-interactive-primary-hover: var(--teddy-color-purple-700);--teddy-color-background-interactive-primary: var(--teddy-color-purple-800);--teddy-color-background-secondary: var(--teddy-color-gray-50);--teddy-color-background-primary: var(--teddy-color-functional-white);--teddy-color-text-tone-on-tone-tertiary: var(--teddy-color-beige-700);--teddy-color-text-tone-on-tone-secondary: var(--teddy-color-purple-900);--teddy-color-text-tone-on-tone-primary: var(--teddy-color-purple-100);--teddy-color-text-status-attention: var(--teddy-color-functional-white);--teddy-color-text-status-special: var(--teddy-color-purple-800);--teddy-color-text-status-neutral: var(--teddy-color-transparent-black-700);--teddy-color-text-status-info-medium: var(--teddy-color-blue-500);--teddy-color-text-status-info-strong: var(--teddy-color-blue-700);--teddy-color-text-status-warning-medium: var(--teddy-color-orange-500);--teddy-color-text-status-warning-strong: var(--teddy-color-orange-700);--teddy-color-text-status-success-medium: var(--teddy-color-green-500);--teddy-color-text-status-success-strong: var(--teddy-color-green-700);--teddy-color-text-status-error-medium: var(--teddy-color-red-500);--teddy-color-text-status-error-strong: var(--teddy-color-red-700);--teddy-color-text-status-discount: var(--teddy-color-purple-550);--teddy-color-text-interactive-selected: var(--teddy-color-purple-550);--teddy-color-text-interactive-on-destructive: var(--teddy-color-functional-white);--teddy-color-text-interactive-on-expressive-negative-active: var(--teddy-color-purple-900);--teddy-color-text-interactive-on-expressive-negative-hover: var(--teddy-color-purple-900);--teddy-color-text-interactive-on-expressive-negative: var(--teddy-color-functional-white);--teddy-color-text-interactive-on-expressive: var(--teddy-color-functional-white);--teddy-color-text-interactive-primary-negative-active: var(--teddy-color-purple-200);--teddy-color-text-interactive-primary-negative-hover: var(--teddy-color-purple-200);--teddy-color-text-interactive-primary-negative: var(--teddy-color-purple-100);--teddy-color-text-interactive-on-primary-negative: var(--teddy-color-purple-800);--teddy-color-text-interactive-on-primary: var(--teddy-color-functional-white);--teddy-color-text-interactive-primary-active: var(--teddy-color-purple-900);--teddy-color-text-interactive-primary-hover: var(--teddy-color-purple-800);--teddy-color-text-interactive-primary: var(--teddy-color-purple-700);--teddy-color-text-weak-negative: var(--teddy-color-transparent-white-400);--teddy-color-text-medium-negative: var(--teddy-color-transparent-white-600);--teddy-color-text-default-negative: var(--teddy-color-transparent-white-850);--teddy-color-text-weak: var(--teddy-color-transparent-black-400);--teddy-color-text-medium: var(--teddy-color-transparent-black-600);--teddy-color-text-default: var(--teddy-color-transparent-black-850);--teddy-color-brand-white: var(--teddy-color-functional-white);--teddy-color-brand-off-black: var(--teddy-color-gray-900);--teddy-color-brand-light-beige: var(--teddy-color-beige-50);--teddy-color-brand-beige: var(--teddy-color-beige-100);--teddy-color-brand-deep-beige: var(--teddy-color-beige-700);--teddy-color-brand-light-purple: var(--teddy-color-purple-100);--teddy-color-brand-core-purple: var(--teddy-color-purple-550);--teddy-color-brand-deep-purple: var(--teddy-color-purple-900)}:root{--teddy-motion-duration-100: .1s;--teddy-motion-duration-150: .15s;--teddy-motion-duration-200: .2s;--teddy-motion-duration-300: .3s;--teddy-motion-duration-400: .4s;--teddy-motion-duration-500: .5s;--teddy-motion-duration-1500: 1.5s;--teddy-motion-duration-2000: 2s;--teddy-motion-easing-ease-in: cubic-bezier(.35, .07, .88, .43);--teddy-motion-easing-ease-out: cubic-bezier(.33, .9, .75, .95);--teddy-motion-easing-ease-in-out: cubic-bezier(.45, 0, .52, .98)}:root{--teddy-shadow-none: calc(0rem * var(--teddy-rescale)) calc(0rem * var(--teddy-rescale)) calc(0rem * var(--teddy-rescale)) calc(0rem * var(--teddy-rescale)) rgba(0, 0, 0, .1);--teddy-shadow-sm: calc(0rem * var(--teddy-rescale)) calc(.0625rem * var(--teddy-rescale)) calc(.25rem * var(--teddy-rescale)) calc(0rem * var(--teddy-rescale)) rgba(0, 0, 0, .1);--teddy-shadow-md: calc(0rem * var(--teddy-rescale)) calc(.25rem * var(--teddy-rescale)) calc(.75rem * var(--teddy-rescale)) calc(0rem * var(--teddy-rescale)) rgba(0, 0, 0, .1);--teddy-shadow-lg: calc(0rem * var(--teddy-rescale)) calc(.75rem * var(--teddy-rescale)) calc(1.5rem * var(--teddy-rescale)) calc(0rem * var(--teddy-rescale)) rgba(0, 0, 0, .1)}:root{--teddy-spacing-1600: calc(8rem * var(--teddy-rescale));--teddy-spacing-1200: calc(6rem * var(--teddy-rescale));--teddy-spacing-1000: calc(5rem * var(--teddy-rescale));--teddy-spacing-800: calc(4rem * var(--teddy-rescale));--teddy-spacing-600: calc(3rem * var(--teddy-rescale));--teddy-spacing-400: calc(2rem * var(--teddy-rescale));--teddy-spacing-300: calc(1.5rem * var(--teddy-rescale));--teddy-spacing-250: calc(1.25rem * var(--teddy-rescale));--teddy-spacing-200: calc(1rem * var(--teddy-rescale));--teddy-spacing-150: calc(.75rem * var(--teddy-rescale));--teddy-spacing-100: calc(.5rem * var(--teddy-rescale));--teddy-spacing-50: calc(.25rem * var(--teddy-rescale));--teddy-spacing-25: calc(.125rem * var(--teddy-rescale));--teddy-spacing-10: calc(.0625rem * var(--teddy-rescale));--teddy-spacing-0: calc(0rem * var(--teddy-rescale));--teddy-spacing-page-padding-xl: var(--teddy-spacing-600);--teddy-spacing-page-padding-lg: var(--teddy-spacing-600);--teddy-spacing-page-padding-md: var(--teddy-spacing-300);--teddy-spacing-page-padding-sm: var(--teddy-spacing-200);--teddy-spacing-gutter-xl: var(--teddy-spacing-300);--teddy-spacing-gutter-lg: var(--teddy-spacing-300);--teddy-spacing-gutter-md: var(--teddy-spacing-300);--teddy-spacing-gutter-sm: var(--teddy-spacing-200)}:root{--teddy-typography-family-default: TeliaSans, Helvetica, sans-serif;--teddy-typography-family-display: TeliaSansHeading, Helvetica, sans-serif;--teddy-typography-weight-normal: 400;--teddy-typography-weight-medium: 500;--teddy-typography-weight-bold: 700;--teddy-typography-line-height-tight: 100%;--teddy-typography-line-height-default: 125%;--teddy-typography-line-height-loose: 150%;--teddy-typography-line-height-looser: 175%;--teddy-typography-scale-50: calc(.75rem * var(--teddy-rescale));--teddy-typography-scale-75: calc(.875rem * var(--teddy-rescale));--teddy-typography-scale-100: calc(1rem * var(--teddy-rescale));--teddy-typography-scale-150: calc(1.125rem * var(--teddy-rescale));--teddy-typography-scale-200: calc(1.25rem * var(--teddy-rescale));--teddy-typography-scale-400: calc(1.5rem * var(--teddy-rescale));--teddy-typography-scale-500: calc(1.75rem * var(--teddy-rescale));--teddy-typography-scale-600: calc(2rem * var(--teddy-rescale));--teddy-typography-scale-650: calc(2.25rem * var(--teddy-rescale));--teddy-typography-scale-700: calc(2.5rem * var(--teddy-rescale));--teddy-typography-scale-800: calc(3rem * var(--teddy-rescale));--teddy-typography-scale-850: calc(3.5rem * var(--teddy-rescale));--teddy-typography-scale-900: calc(4rem * var(--teddy-rescale));--teddy-typography-scale-1000: calc(5rem * var(--teddy-rescale));--teddy-typography-scale-1100: calc(6rem * var(--teddy-rescale))}:root{--purpur-rescale: var(--teddy-rescale)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._teddy-spinner--xxs_qjx6c_1{height:var(--teddy-spacing-250);width:var(--teddy-spacing-250)}._teddy-spinner--xs_qjx6c_5{height:var(--teddy-spacing-300);width:var(--teddy-spacing-300)}._teddy-spinner--sm_qjx6c_9{height:var(--teddy-spacing-400);width:var(--teddy-spacing-400)}._teddy-spinner--md_qjx6c_13{height:var(--teddy-spacing-600);width:var(--teddy-spacing-600)}._teddy-spinner--lg_qjx6c_17{height:var(--teddy-spacing-800);width:var(--teddy-spacing-800)}._teddy-spinner__circle_qjx6c_21{--stroke-color: var(--teddy-color-border-interactive-primary);stroke-dasharray:150;animation:_dash_qjx6c_1 2s ease-in-out infinite,_rotate_qjx6c_1 1s linear infinite;transform-origin:center;stroke-width:3;stroke-linecap:round;fill:transparent;stroke:var(--stroke-color)}._teddy-spinner__circle--disabled_qjx6c_31{--stroke-color: var(--teddy-color-border-weak)}._teddy-spinner__circle--negative_qjx6c_34{--stroke-color: var(--teddy-color-border-interactive-primary-negative)}._teddy-spinner__circle--negative-disabled_qjx6c_37{--stroke-color: var(--teddy-color-border-weak-negative)}@keyframes _rotate_qjx6c_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes _dash_qjx6c_1{0%{stroke-dashoffset:125}50%{stroke-dashoffset:62.5}to{stroke-dashoffset:125}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@keyframes _fadeInAnimation_370v0_1{0%{opacity:0}to{opacity:1}}@keyframes _scaleInAnimation_370v0_1{0%{scale:0}to{scale:100%}}._teddy-text-field_370v0_17{box-sizing:border-box}._teddy-text-field_370v0_17>*+*{margin-top:var(--teddy-spacing-50)}._teddy-text-field__frame_370v0_23{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--teddy-border-radius-sm);border:var(--teddy-border-width-xs) solid var(--teddy-color-border-interactive-subtle);pointer-events:none}._teddy-text-field__input_370v0_30{border-radius:var(--teddy-border-radius-sm);border:none;box-sizing:border-box;font-family:var(--teddy-typography-family-default);font-size:var(--teddy-typography-scale-100);line-height:150%;outline:none;background:transparent;width:100%}._teddy-text-field__input_370v0_30:active:not(:disabled):not(:read-only)~._teddy-text-field__frame_370v0_23,._teddy-text-field__input_370v0_30:focus:not(:disabled):not(:read-only)~._teddy-text-field__frame_370v0_23{outline:var(--teddy-border-width-sm) solid var(--teddy-color-border-interactive-focus);outline-offset:calc(var(--teddy-spacing-10) * 2);border-width:var(--teddy-border-width-xs);border-color:var(--teddy-color-border-interactive-subtle-hover)}._teddy-text-field__decorator_370v0_47{position:relative;cursor:text;display:flex;padding:calc(var(--teddy-spacing-100) + var(--teddy-spacing-25)) var(--teddy-spacing-150);gap:var(--teddy-spacing-50)}._teddy-text-field__decorator_370v0_47:hover:not(._teddy-text-field__decorator--disabled_370v0_54):not(._teddy-text-field__decorator--read-only_370v0_54) ._teddy-text-field__frame_370v0_23{border-width:var(--teddy-border-width-sm)}._teddy-text-field__decorator_370v0_47:hover:not(._teddy-text-field__decorator--disabled_370v0_54):not(._teddy-text-field__decorator--read-only_370v0_54) ._teddy-text-field__frame_370v0_23{border-color:var(--teddy-color-border-interactive-subtle-hover)}._teddy-text-field__decorator--disabled_370v0_54,._teddy-text-field__decorator--read-only_370v0_54{color:var(--teddy-color-text-weak);background-color:var(--teddy-color-background-interactive-read-only)}._teddy-text-field__decorator--disabled_370v0_54 ._teddy-text-field__frame_370v0_23,._teddy-text-field__decorator--read-only_370v0_54 ._teddy-text-field__frame_370v0_23{border-width:var(--teddy-border-width-xs);border-color:var(--teddy-color-border-medium)}._teddy-text-field__decorator--error_370v0_68 ._teddy-text-field__frame_370v0_23{border-color:var(--teddy-color-border-status-error)}._teddy-text-field__decorator--valid_370v0_71 ._teddy-text-field__frame_370v0_23{border-color:var(--teddy-color-border-status-success)}._teddy-text-field__decorator--valid_370v0_71 ._teddy-text-field__indicator_370v0_74{color:var(--teddy-color-border-status-success)}._teddy-text-field__indicator_370v0_74{animation:_fadeInAnimation_370v0_1 ease var(--teddy-motion-duration-300),_scaleInAnimation_370v0_1 ease var(--teddy-motion-duration-300)}._teddy-text-field__error-list_370v0_80{list-style:none;padding:0}._teddy-text-field__error-list_370v0_80>*+*{margin-top:var(--teddy-spacing-50)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._teddy-text_ebzsf_1{color:var(--teddy-color-text-default);display:block;margin:0;-webkit-hyphens:none;hyphens:none}._teddy-text--disabled_ebzsf_7{color:var(--teddy-color-text-weak)}._teddy-text--hyphens_ebzsf_10{-webkit-hyphens:auto;hyphens:auto}._teddy-text--paragraph-100_ebzsf_13{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-100);line-height:var(--teddy-typography-line-height-loose)}._teddy-text--paragraph-100-medium_ebzsf_19{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-100);line-height:var(--teddy-typography-line-height-loose);font-weight:var(--teddy-typography-weight-medium)}._teddy-text--paragraph-100-bold_ebzsf_26{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-100);line-height:var(--teddy-typography-line-height-loose);font-weight:var(--teddy-typography-weight-bold)}._teddy-text--paragraph-200_ebzsf_33{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-100);line-height:var(--teddy-typography-line-height-looser)}._teddy-text--preamble-100_ebzsf_39{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-200);line-height:var(--teddy-typography-line-height-loose)}._teddy-text--preamble-200_ebzsf_45{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:clamp(var(--teddy-typography-scale-150),3vw,var(--teddy-typography-scale-400));line-height:var(--teddy-typography-line-height-loose)}._teddy-text--additional-100_ebzsf_51{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-75);line-height:var(--teddy-typography-line-height-loose)}._teddy-text--additional-100-medium_ebzsf_57{font-family:var(--teddy-typography-family-default);font-weight:var(--teddy-typography-weight-normal);font-size:var(--teddy-typography-scale-75);line-height:var(--teddy-typography-line-height-loose);font-weight:var(--teddy-typography-weight-medium)}._teddy-text--overline-100_ebzsf_64{font-family:var(--teddy-typography-family-default);font-size:var(--teddy-typography-scale-75);letter-spacing:var(--teddy-spacing-10);line-height:var(--teddy-typography-line-height-tight);text-transform:uppercase}._teddy-text--overline-200_ebzsf_71{font-family:var(--teddy-typography-family-default);font-size:clamp(var(--teddy-typography-scale-75),3vw,var(--teddy-typography-scale-100));letter-spacing:var(--teddy-spacing-10);line-height:var(--teddy-typography-line-height-tight);text-transform:uppercase}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
function a(r) {
|
|
2
|
+
var f, n, t = "";
|
|
3
|
+
if (typeof r == "string" || typeof r == "number")
|
|
4
|
+
t += r;
|
|
5
|
+
else if (typeof r == "object")
|
|
6
|
+
if (Array.isArray(r)) {
|
|
7
|
+
var o = r.length;
|
|
8
|
+
for (f = 0; f < o; f++)
|
|
9
|
+
r[f] && (n = a(r[f])) && (t && (t += " "), t += n);
|
|
10
|
+
} else
|
|
11
|
+
for (n in r)
|
|
12
|
+
r[n] && (t && (t += " "), t += n);
|
|
13
|
+
return t;
|
|
14
|
+
}
|
|
15
|
+
function i() {
|
|
16
|
+
for (var r, f, n = 0, t = "", o = arguments.length; n < o; n++)
|
|
17
|
+
(r = arguments[n]) && (f = a(r)) && (t && (t += " "), t += f);
|
|
18
|
+
return t;
|
|
19
|
+
}
|
|
20
|
+
export {
|
|
21
|
+
i as c
|
|
22
|
+
};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { ActionProps } from '../../utils/action';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare const BUTTON_VARIANT: {
|
|
4
|
+
readonly DESTRUCTIVE: "destructive";
|
|
5
|
+
readonly DESTRUCTIVE_NEGATIVE: "destructive-negative";
|
|
6
|
+
readonly TERTIARY_PURPLE: "tertiary-purple";
|
|
7
|
+
readonly TERTIARY_PURPLE_NEGATVIE: "tertiary-purple-negative";
|
|
8
|
+
readonly TEXT: "text";
|
|
9
|
+
readonly TEXT_NEGATIVE: "text-negative";
|
|
10
|
+
readonly PRIMARY: "primary";
|
|
11
|
+
readonly PRIMARY_NEGATIVE: "primary-negative";
|
|
12
|
+
readonly SECONDARY: "secondary";
|
|
13
|
+
readonly SECONDARY_NEGATIVE: "secondary-negative";
|
|
14
|
+
readonly EXPRESSIVE: "expressive";
|
|
15
|
+
readonly EXPRESSIVE_NEGATIVE: "expressive-negative";
|
|
16
|
+
};
|
|
17
|
+
type ButtonVariant = (typeof BUTTON_VARIANT)[keyof typeof BUTTON_VARIANT];
|
|
18
|
+
type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
19
|
+
asChild?: boolean;
|
|
20
|
+
loading?: boolean;
|
|
21
|
+
} & ActionProps<ButtonVariant>;
|
|
22
|
+
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
23
|
+
export { Button };
|
|
24
|
+
export type { ButtonProps, ButtonVariant };
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import "../../assets/button.css";
|
|
2
|
+
import { jsxs as x, jsx as o } from "react/jsx-runtime";
|
|
3
|
+
import { VARIANT as $ } from "../../utils/action.js";
|
|
4
|
+
import { $ as E, a as T } from "../../index-TI1xsy6a.js";
|
|
5
|
+
import { c as I } from "../../clsx-DB4S2d7J.js";
|
|
6
|
+
import * as A from "react";
|
|
7
|
+
import { Spinner as R } from "../spinner/spinner.js";
|
|
8
|
+
const N = "_fadeInAnimation_882sa_1", h = "_scaleInAnimation_882sa_1", t = {
|
|
9
|
+
"teddy-button": "_teddy-button_882sa_17",
|
|
10
|
+
"teddy-button--sm": "_teddy-button--sm_882sa_52",
|
|
11
|
+
"teddy-button--icon-only": "_teddy-button--icon-only_882sa_55",
|
|
12
|
+
"teddy-button--md": "_teddy-button--md_882sa_58",
|
|
13
|
+
"teddy-button--lg": "_teddy-button--lg_882sa_64",
|
|
14
|
+
"teddy-button--full-width": "_teddy-button--full-width_882sa_70",
|
|
15
|
+
"teddy-button--primary": "_teddy-button--primary_882sa_73",
|
|
16
|
+
"teddy-button--disabled": "_teddy-button--disabled_882sa_77",
|
|
17
|
+
"teddy-button--primary-negative": "_teddy-button--primary-negative_882sa_83",
|
|
18
|
+
"teddy-button--secondary": "_teddy-button--secondary_882sa_95",
|
|
19
|
+
"teddy-button--secondary-negative": "_teddy-button--secondary-negative_882sa_106",
|
|
20
|
+
"teddy-button--expressive": "_teddy-button--expressive_882sa_117",
|
|
21
|
+
"teddy-button--expressive-negative": "_teddy-button--expressive-negative_882sa_127",
|
|
22
|
+
"teddy-button--negative": "_teddy-button--negative_882sa_139",
|
|
23
|
+
"teddy-button--destructive": "_teddy-button--destructive_882sa_146",
|
|
24
|
+
"teddy-button--destructive-negative": "_teddy-button--destructive-negative_882sa_156",
|
|
25
|
+
"teddy-button--tertiary-purple": "_teddy-button--tertiary-purple_882sa_166",
|
|
26
|
+
"teddy-button--tertiary-purple-negative": "_teddy-button--tertiary-purple-negative_882sa_179",
|
|
27
|
+
"teddy-button--text-negative": "_teddy-button--text-negative_882sa_194",
|
|
28
|
+
"teddy-button--text": "_teddy-button--text_882sa_194",
|
|
29
|
+
"teddy-button__loading": "_teddy-button__loading_882sa_241",
|
|
30
|
+
fadeInAnimation: N,
|
|
31
|
+
"teddy-button__spinner": "_teddy-button__spinner_882sa_252",
|
|
32
|
+
scaleInAnimation: h
|
|
33
|
+
};
|
|
34
|
+
({
|
|
35
|
+
...$
|
|
36
|
+
});
|
|
37
|
+
const e = "teddy-button", V = A.forwardRef(
|
|
38
|
+
({
|
|
39
|
+
className: u,
|
|
40
|
+
variant: n,
|
|
41
|
+
size: s = "md",
|
|
42
|
+
iconOnly: y,
|
|
43
|
+
fullWidth: b,
|
|
44
|
+
disabled: a = !1,
|
|
45
|
+
loading: d = !1,
|
|
46
|
+
asChild: c = !1,
|
|
47
|
+
onClick: _,
|
|
48
|
+
children: l,
|
|
49
|
+
...i
|
|
50
|
+
}, p) => {
|
|
51
|
+
const m = c ? T : "button", v = I(
|
|
52
|
+
[t[e], t[`${e}--${n}`], t[`${e}--${s}`]],
|
|
53
|
+
{
|
|
54
|
+
[t[`${e}--icon-only`]]: y,
|
|
55
|
+
[t[`${e}--negative`]]: n.endsWith("negative"),
|
|
56
|
+
[t[`${e}--full-width`]]: b,
|
|
57
|
+
[t[`${e}--disabled`]]: a || d
|
|
58
|
+
},
|
|
59
|
+
u
|
|
60
|
+
);
|
|
61
|
+
function f(r) {
|
|
62
|
+
if (a || d) {
|
|
63
|
+
r.preventDefault();
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
_ && _(r);
|
|
67
|
+
}
|
|
68
|
+
const g = () => n.endsWith("negative") ? "negative-disabled" : "disabled";
|
|
69
|
+
return /* @__PURE__ */ x(
|
|
70
|
+
m,
|
|
71
|
+
{
|
|
72
|
+
className: v,
|
|
73
|
+
"aria-disabled": i["aria-disabled"] || a || d,
|
|
74
|
+
onClick: f,
|
|
75
|
+
ref: p,
|
|
76
|
+
...i,
|
|
77
|
+
children: [
|
|
78
|
+
d && /* @__PURE__ */ o("span", { className: t[`${e}__loading`], children: /* @__PURE__ */ o(
|
|
79
|
+
R,
|
|
80
|
+
{
|
|
81
|
+
size: s === "lg" ? "xs" : "xxs",
|
|
82
|
+
variant: g(),
|
|
83
|
+
className: t[`${e}__spinner`]
|
|
84
|
+
}
|
|
85
|
+
) }),
|
|
86
|
+
/* @__PURE__ */ o(E, { children: l })
|
|
87
|
+
]
|
|
88
|
+
}
|
|
89
|
+
);
|
|
90
|
+
}
|
|
91
|
+
);
|
|
92
|
+
V.displayName = "Button";
|
|
93
|
+
export {
|
|
94
|
+
V as Button
|
|
95
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { IconProps } from '../icon';
|
|
3
|
+
import { TextProps } from '../text';
|
|
4
|
+
export type FieldErrorTextIndicatorProps = Partial<IconProps>;
|
|
5
|
+
export type FieldErrorTextProps = TextProps;
|
|
6
|
+
export declare const FieldErrorText: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLParagraphElement>> & {
|
|
7
|
+
Indicator: React.ForwardRefExoticComponent<Omit<Partial<IconProps>, "ref"> & React.RefAttributes<SVGSVGElement>>;
|
|
8
|
+
};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import "../../assets/field-error-text.css";
|
|
2
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
3
|
+
import { c as s } from "../../clsx-DB4S2d7J.js";
|
|
4
|
+
import a from "react";
|
|
5
|
+
import "../../assets/f2a2f391a886d395.svg";
|
|
6
|
+
import { Icon as m } from "../icon/icon.js";
|
|
7
|
+
import { Text as n } from "../text/text.js";
|
|
8
|
+
const c = {
|
|
9
|
+
"teddy-field-error-text": "_teddy-field-error-text_1735t_1",
|
|
10
|
+
"teddy-field-error-text__indicator": "_teddy-field-error-text__indicator_1735t_12"
|
|
11
|
+
}, l = "teddy-field-error-text", _ = a.forwardRef(
|
|
12
|
+
({ className: r, name: t = "error-filled", ...e }, o) => {
|
|
13
|
+
const d = s([c[`${l}__indicator`]], r);
|
|
14
|
+
return /* @__PURE__ */ i(m, { ...e, name: t, ref: o, className: d });
|
|
15
|
+
}
|
|
16
|
+
), f = a.forwardRef(
|
|
17
|
+
({ className: r, children: t, ...e }, o) => {
|
|
18
|
+
const d = s([c[l]], r);
|
|
19
|
+
return /* @__PURE__ */ i(n, { ...e, ref: o, className: d, children: t });
|
|
20
|
+
}
|
|
21
|
+
);
|
|
22
|
+
f.displayName = "FieldErrorText";
|
|
23
|
+
const R = Object.assign(f, {
|
|
24
|
+
Indicator: _
|
|
25
|
+
});
|
|
26
|
+
export {
|
|
27
|
+
R as FieldErrorText
|
|
28
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
type HelperTextProps = React.ComponentPropsWithoutRef<'span'>;
|
|
3
|
+
declare const HelperText: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
4
|
+
export { HelperText };
|
|
5
|
+
export type { HelperTextProps };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import "../../assets/helper-text.css";
|
|
2
|
+
import { jsx as l } from "react/jsx-runtime";
|
|
3
|
+
import { c as o } from "../../clsx-DB4S2d7J.js";
|
|
4
|
+
import a from "react";
|
|
5
|
+
const p = {
|
|
6
|
+
"teddy-helper-text": "_teddy-helper-text_6xdzb_1",
|
|
7
|
+
"teddy-helper-text--disabled": "_teddy-helper-text--disabled_6xdzb_9"
|
|
8
|
+
}, x = "teddy-helper-text", m = a.forwardRef(
|
|
9
|
+
({ className: e, children: t, ...r }, s) => {
|
|
10
|
+
const d = o(
|
|
11
|
+
[p[x]],
|
|
12
|
+
e
|
|
13
|
+
);
|
|
14
|
+
return /* @__PURE__ */ l("span", { ...r, ref: s, className: d, children: t });
|
|
15
|
+
}
|
|
16
|
+
);
|
|
17
|
+
m.displayName = "HelperText";
|
|
18
|
+
export {
|
|
19
|
+
m as HelperText
|
|
20
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { type IconName } from '../../icons/name';
|
|
3
|
+
export { IconName };
|
|
4
|
+
type Size = 'font' | 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
5
|
+
export type IconProps = React.SVGProps<SVGSVGElement> & {
|
|
6
|
+
name: IconName;
|
|
7
|
+
size?: Size;
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
};
|
|
10
|
+
export declare function Icon({ name, size, className, children, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import "../../assets/icon.css";
|
|
2
|
+
import { jsxs as m, jsx as o } from "react/jsx-runtime";
|
|
3
|
+
import r from "../../assets/f2a2f391a886d395.svg";
|
|
4
|
+
import { c as _ } from "../../clsx-DB4S2d7J.js";
|
|
5
|
+
const d = {
|
|
6
|
+
"teddy-icon": "_teddy-icon_mqgol_1",
|
|
7
|
+
"teddy-icon--font": "_teddy-icon--font_mqgol_6",
|
|
8
|
+
"teddy-icon--xxs": "_teddy-icon--xxs_mqgol_10",
|
|
9
|
+
"teddy-icon--xs": "_teddy-icon--xs_mqgol_14",
|
|
10
|
+
"teddy-icon--sm": "_teddy-icon--sm_mqgol_18",
|
|
11
|
+
"teddy-icon--md": "_teddy-icon--md_mqgol_22",
|
|
12
|
+
"teddy-icon--lg": "_teddy-icon--lg_mqgol_26",
|
|
13
|
+
"teddy-icon--xl": "_teddy-icon--xl_mqgol_30",
|
|
14
|
+
"teddy-icon-with-children": "_teddy-icon-with-children_mqgol_35"
|
|
15
|
+
}, t = "teddy-icon", y = `${t}-with-children`;
|
|
16
|
+
function g({ name: n, size: c = "font", className: i, children: e, ...s }) {
|
|
17
|
+
if (e)
|
|
18
|
+
return /* @__PURE__ */ m("span", { className: _([d[y]]), children: [
|
|
19
|
+
/* @__PURE__ */ o(g, { name: n, size: c, className: i, ...s }),
|
|
20
|
+
e
|
|
21
|
+
] });
|
|
22
|
+
const l = _([d[t], d[`${t}--${c}`]], i);
|
|
23
|
+
return /* @__PURE__ */ o("svg", { ...s, className: l, children: /* @__PURE__ */ o("use", { href: `${r}#${n}` }) });
|
|
24
|
+
}
|
|
25
|
+
export {
|
|
26
|
+
g as Icon
|
|
27
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Button as e } from "./button/button.js";
|
|
2
|
+
import { FieldErrorText as p } from "./field-error-text/field-error-text.js";
|
|
3
|
+
import { HelperText as f } from "./helper-text/helper-text.js";
|
|
4
|
+
import { default as n } from "../assets/f2a2f391a886d395.svg";
|
|
5
|
+
import { Icon as u } from "./icon/icon.js";
|
|
6
|
+
import { Input as T, InputGroup as a } from "./input/input.js";
|
|
7
|
+
import { Label as I } from "./label/label.js";
|
|
8
|
+
import { Spinner as s } from "./spinner/spinner.js";
|
|
9
|
+
import { Text as H } from "./text/text.js";
|
|
10
|
+
import { TextField as B } from "./text-field/text-field.js";
|
|
11
|
+
export {
|
|
12
|
+
e as Button,
|
|
13
|
+
p as FieldErrorText,
|
|
14
|
+
f as HelperText,
|
|
15
|
+
u as Icon,
|
|
16
|
+
T as Input,
|
|
17
|
+
a as InputGroup,
|
|
18
|
+
I as Label,
|
|
19
|
+
s as Spinner,
|
|
20
|
+
H as Text,
|
|
21
|
+
B as TextField,
|
|
22
|
+
n as iconsHref
|
|
23
|
+
};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
type InputGroupRootProps = React.ComponentPropsWithoutRef<'div'> & {};
|
|
3
|
+
type ValidationState = 'valid' | 'invalid';
|
|
4
|
+
type InputProps = Omit<React.ComponentPropsWithoutRef<'input'>, 'children'> & {
|
|
5
|
+
/**
|
|
6
|
+
* Whether the input should display its "valid" or "invalid" visual styling.
|
|
7
|
+
*/
|
|
8
|
+
validationState?: ValidationState;
|
|
9
|
+
/**
|
|
10
|
+
* Whether to show a loading indicator.
|
|
11
|
+
*/
|
|
12
|
+
isLoading?: boolean;
|
|
13
|
+
};
|
|
14
|
+
/**
|
|
15
|
+
* The input
|
|
16
|
+
*/
|
|
17
|
+
declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "children"> & {
|
|
18
|
+
/**
|
|
19
|
+
* Whether the input should display its "valid" or "invalid" visual styling.
|
|
20
|
+
*/
|
|
21
|
+
validationState?: ValidationState | undefined;
|
|
22
|
+
/**
|
|
23
|
+
* Whether to show a loading indicator.
|
|
24
|
+
*/
|
|
25
|
+
isLoading?: boolean | undefined;
|
|
26
|
+
} & React.RefAttributes<HTMLInputElement>>;
|
|
27
|
+
type InputIndicatorProps = React.ComponentPropsWithoutRef<'svg'> & {
|
|
28
|
+
isLoading?: boolean;
|
|
29
|
+
isValid?: boolean;
|
|
30
|
+
};
|
|
31
|
+
declare const InputGroup: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>> & {
|
|
32
|
+
Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "children"> & {
|
|
33
|
+
/**
|
|
34
|
+
* Whether the input should display its "valid" or "invalid" visual styling.
|
|
35
|
+
*/
|
|
36
|
+
validationState?: ValidationState | undefined;
|
|
37
|
+
/**
|
|
38
|
+
* Whether to show a loading indicator.
|
|
39
|
+
*/
|
|
40
|
+
isLoading?: boolean | undefined;
|
|
41
|
+
} & React.RefAttributes<HTMLInputElement>>;
|
|
42
|
+
Indicator: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & {
|
|
43
|
+
isLoading?: boolean | undefined;
|
|
44
|
+
isValid?: boolean | undefined;
|
|
45
|
+
} & React.RefAttributes<SVGSVGElement>>;
|
|
46
|
+
};
|
|
47
|
+
type InputGroupProps = {
|
|
48
|
+
Root: InputGroupRootProps;
|
|
49
|
+
Input: InputProps;
|
|
50
|
+
Indicator: InputIndicatorProps;
|
|
51
|
+
};
|
|
52
|
+
export { Input, InputGroup };
|
|
53
|
+
export type { InputGroupProps, InputProps };
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import "../../assets/input.css";
|
|
2
|
+
import { jsxs as m, jsx as o } from "react/jsx-runtime";
|
|
3
|
+
import { c as d } from "../../clsx-DB4S2d7J.js";
|
|
4
|
+
import _ from "react";
|
|
5
|
+
import "../../assets/f2a2f391a886d395.svg";
|
|
6
|
+
import { Icon as y } from "../icon/icon.js";
|
|
7
|
+
import { Spinner as x } from "../spinner/spinner.js";
|
|
8
|
+
const N = "_fadeInAnimation_1bk8x_1", v = "_scaleInAnimation_1bk8x_1", s = {
|
|
9
|
+
"teddy-input": "_teddy-input_1bk8x_17",
|
|
10
|
+
"teddy-input__frame": "_teddy-input__frame_1bk8x_24",
|
|
11
|
+
"teddy-input__input": "_teddy-input__input_1bk8x_31",
|
|
12
|
+
"teddy-input__input--valid": "_teddy-input__input--valid_1bk8x_62",
|
|
13
|
+
"teddy-input__input--invalid": "_teddy-input__input--invalid_1bk8x_62",
|
|
14
|
+
"teddy-input__indicator": "_teddy-input__indicator_1bk8x_68",
|
|
15
|
+
"teddy-input__input--error": "_teddy-input__input--error_1bk8x_71",
|
|
16
|
+
fadeInAnimation: N,
|
|
17
|
+
scaleInAnimation: v
|
|
18
|
+
}, a = "teddy-input";
|
|
19
|
+
function b(n) {
|
|
20
|
+
const e = n == null ? void 0 : n.target;
|
|
21
|
+
if (e.closest("input, button, a"))
|
|
22
|
+
return;
|
|
23
|
+
const t = [...n.currentTarget.getElementsByTagName("input")].find((p) => p);
|
|
24
|
+
if (!t)
|
|
25
|
+
return;
|
|
26
|
+
const u = (t.compareDocumentPosition(e) & Node.DOCUMENT_POSITION_PRECEDING) !== 0 ? 0 : t.value.length;
|
|
27
|
+
requestAnimationFrame(() => {
|
|
28
|
+
try {
|
|
29
|
+
t.setSelectionRange(u, u);
|
|
30
|
+
} finally {
|
|
31
|
+
t.focus();
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
const f = _.createContext(void 0), c = _.forwardRef(
|
|
36
|
+
({ className: n, children: e, ...t }, i) => {
|
|
37
|
+
const r = d([s[`${a}`]], n);
|
|
38
|
+
return /* @__PURE__ */ m("div", { ...t, onPointerDown: b, ref: i, className: r, children: [
|
|
39
|
+
/* @__PURE__ */ o(f.Provider, { value: !0, children: e }),
|
|
40
|
+
/* @__PURE__ */ o("div", { className: s[`${a}__frame`] })
|
|
41
|
+
] });
|
|
42
|
+
}
|
|
43
|
+
);
|
|
44
|
+
c.displayName = "InputGroup";
|
|
45
|
+
const I = _.forwardRef(
|
|
46
|
+
({ className: n, isLoading: e, validationState: t, ...i }, r) => {
|
|
47
|
+
const u = _.useContext(f), p = d(
|
|
48
|
+
[
|
|
49
|
+
s[`${a}__input`],
|
|
50
|
+
{
|
|
51
|
+
[s[`${a}__input--valid`]]: t === "valid",
|
|
52
|
+
[s[`${a}__input--error`]]: t === "invalid"
|
|
53
|
+
}
|
|
54
|
+
],
|
|
55
|
+
n
|
|
56
|
+
);
|
|
57
|
+
return u === !0 ? /* @__PURE__ */ o("input", { ...i, className: p, ref: r }) : /* @__PURE__ */ m(c, { children: [
|
|
58
|
+
/* @__PURE__ */ o("input", { ...i, className: p, ref: r }),
|
|
59
|
+
/* @__PURE__ */ o(l, { isValid: t === "valid", isLoading: e })
|
|
60
|
+
] });
|
|
61
|
+
}
|
|
62
|
+
);
|
|
63
|
+
I.displayName = "Input";
|
|
64
|
+
const l = _.forwardRef(
|
|
65
|
+
({ className: n, isLoading: e, isValid: t, ...i }, r) => {
|
|
66
|
+
if (!t && !e)
|
|
67
|
+
return null;
|
|
68
|
+
if (!t && e)
|
|
69
|
+
return /* @__PURE__ */ o(x, { className: n, size: "xs", ...i, ref: r });
|
|
70
|
+
const u = d([s[`${a}__indicator`]], n);
|
|
71
|
+
return /* @__PURE__ */ o(y, { ...i, size: "md", name: "check-circle-filled", className: u, ref: r });
|
|
72
|
+
}
|
|
73
|
+
);
|
|
74
|
+
l.displayName = "InputIndicator";
|
|
75
|
+
const O = Object.assign(c, {
|
|
76
|
+
Input: I,
|
|
77
|
+
Indicator: l
|
|
78
|
+
});
|
|
79
|
+
export {
|
|
80
|
+
I as Input,
|
|
81
|
+
O as InputGroup
|
|
82
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as LabelPrimitive from '@radix-ui/react-label';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
export type LabelProps = React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & {
|
|
4
|
+
disabled?: boolean;
|
|
5
|
+
};
|
|
6
|
+
declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & {
|
|
7
|
+
disabled?: boolean | undefined;
|
|
8
|
+
} & React.RefAttributes<HTMLLabelElement>>;
|
|
9
|
+
export { Label };
|