@redvars/peacock 3.2.9 → 3.2.10
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/dist/assets/tokens.css +2 -0
- package/dist/assets/tokens.css.map +1 -0
- package/dist/{button-2MeDq0Yy.js → button-DaL4va7Q.js} +2 -2
- package/dist/{button-2MeDq0Yy.js.map → button-DaL4va7Q.js.map} +1 -1
- package/dist/button.js +1 -1
- package/dist/{image-DK6VQW7N.js → image-v3BujlY5.js} +12 -6
- package/dist/{image-DK6VQW7N.js.map → image-v3BujlY5.js.map} +1 -1
- package/dist/index.js +2 -2
- package/dist/peacock-loader.js +2 -2
- package/package.json +1 -1
- package/readme.md +2 -2
- package/scss/tokens.scss +1 -0
- package/src/button/button/button.scss +1 -1
- package/src/image/image.scss +55 -48
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
:root{--color-black: #000000;--color-blue: var(--color-blue-40);--color-blue-0: #000000;--color-blue-10: #001550;--color-blue-20: #00277f;--color-blue-30: #003ab2;--color-blue-40: #2352d5;--color-blue-50: #446def;--color-blue-60: #6789ff;--color-blue-70: #90a7ff;--color-blue-80: #b6c4ff;--color-blue-90: #dce1ff;--color-blue-100: #ffffff;--color-blue-container: var(--color-blue-90);--color-error: var(--color-red-40);--color-error-container: var(--color-red-90);--color-green: var(--color-green-40);--color-green-0: #000000;--color-green-10: #00210b;--color-green-20: #003917;--color-green-30: #005225;--color-green-40: #0f6d35;--color-green-50: #31874b;--color-green-60: #4da163;--color-green-70: #68bd7b;--color-green-80: #83d995;--color-green-90: #9ff6af;--color-green-100: #ffffff;--color-green-container: var(--color-green-90);--color-inverse-blue: var(--color-blue-80);--color-inverse-error: var(--color-red-80);--color-inverse-green: var(--color-green-80);--color-inverse-on-surface: var(--color-neutral-95);--color-inverse-orange: var(--color-orange-80);--color-inverse-primary: var(--color-primary-80);--color-inverse-purple: var(--color-purple-80);--color-inverse-red: var(--color-red-80);--color-inverse-secondary: var(--color-secondary-80);--color-inverse-success: var(--color-green-80);--color-inverse-surface: var(--color-neutral-20);--color-inverse-tertiary: var(--color-tertiary-80);--color-inverse-warning: var(--color-yellow-80);--color-inverse-yellow: var(--color-yellow-80);--color-neutral: #79767a;--color-neutral-0: #000000;--color-neutral-4: #0f0e11;--color-neutral-6: #141316;--color-neutral-10: #1c1b1e;--color-neutral-12: #201f23;--color-neutral-17: #2b292d;--color-neutral-20: #313033;--color-neutral-22: #363438;--color-neutral-30: #48464a;--color-neutral-40: #605d62;--color-neutral-50: #79767a;--color-neutral-60: #939094;--color-neutral-70: #aeaaaf;--color-neutral-80: #c9c5ca;--color-neutral-87: #ddd9dd;--color-neutral-90: #e6e1e6;--color-neutral-92: #ebe7ec;--color-neutral-94: #f1ecf1;--color-neutral-95: #f4eff4;--color-neutral-96: #f7f2f7;--color-neutral-98: #fdf8fd;--color-neutral-99: #fffbff;--color-neutral-100: #ffffff;--color-neutral-variant: #79757f;--color-neutral-variant-0: #000000;--color-neutral-variant-4: #0f0d15;--color-neutral-variant-6: #14121a;--color-neutral-variant-10: #1c1a22;--color-neutral-variant-12: #201e27;--color-neutral-variant-17: #2b2931;--color-neutral-variant-20: #312f38;--color-neutral-variant-22: #36333c;--color-neutral-variant-30: #48454e;--color-neutral-variant-40: #605d66;--color-neutral-variant-50: #79757f;--color-neutral-variant-60: #938f99;--color-neutral-variant-70: #aea9b4;--color-neutral-variant-80: #c9c4d0;--color-neutral-variant-87: #ddd8e3;--color-neutral-variant-90: #e6e0ec;--color-neutral-variant-92: #ece6f1;--color-neutral-variant-94: #f1ecf7;--color-neutral-variant-95: #f4eefa;--color-neutral-variant-96: #f7f1fd;--color-neutral-variant-98: #fdf8ff;--color-neutral-variant-99: #fffbff;--color-neutral-variant-100: #ffffff;--color-on-blue: var(--color-blue-100);--color-on-blue-container: var(--color-blue-10);--color-on-error: var(--color-red-100);--color-on-error-container: var(--color-red-10);--color-on-green: var(--color-green-100);--color-on-green-container: var(--color-green-10);--color-on-orange: var(--color-orange-100);--color-on-orange-container: var(--color-orange-10);--color-on-primary: var(--color-primary-100);--color-on-primary-container: var(--color-primary-10);--color-on-purple: var(--color-purple-100);--color-on-purple-container: var(--color-purple-10);--color-on-red: var(--color-red-100);--color-on-red-container: var(--color-red-10);--color-on-secondary: var(--color-secondary-100);--color-on-secondary-container: var(--color-secondary-10);--color-on-success: var(--color-green-100);--color-on-success-container: var(--color-green-10);--color-on-surface: var(--color-neutral-10);--color-on-surface-variant: var(--color-neutral-variant-30);--color-on-tertiary: var(--color-tertiary-100);--color-on-tertiary-container: var(--color-tertiary-10);--color-on-warning: var(--color-yellow-100);--color-on-warning-container: var(--color-yellow-10);--color-on-yellow: var(--color-yellow-100);--color-on-yellow-container: var(--color-yellow-10);--color-orange: var(--color-orange-40);--color-orange-0: #000000;--color-orange-10: #341100;--color-orange-20: #552100;--color-orange-30: #783100;--color-orange-40: #9e4300;--color-orange-50: #c55500;--color-orange-60: #ee6803;--color-orange-70: #ff8d4c;--color-orange-80: #ffb691;--color-orange-90: #ffdbcb;--color-orange-100: #ffffff;--color-orange-container: var(--color-orange-90);--color-outline: var(--color-neutral-variant-50);--color-outline-variant: var(--color-neutral-variant-80);--color-primary: var(--color-primary-40);--color-primary-0: #000000;--color-primary-10: #1d0061;--color-primary-20: #330098;--color-primary-30: #4a21bd;--color-primary-40: #6341d5;--color-primary-50: #7c5df0;--color-primary-60: #967cff;--color-primary-70: #b09dff;--color-primary-80: #cbbeff;--color-primary-90: #e7deff;--color-primary-95: #f4eeff;--color-primary-98: #fdf8ff;--color-primary-100: #ffffff;--color-primary-container: var(--color-primary-90);--color-purple: var(--color-purple-40);--color-purple-0: #000000;--color-purple-10: #3f001c;--color-purple-20: #650032;--color-purple-30: #8e0048;--color-purple-40: #ba0061;--color-purple-50: #e6067a;--color-purple-60: #ff4993;--color-purple-70: #ff84ad;--color-purple-80: #ffb1c7;--color-purple-90: #ffd9e2;--color-purple-100: #ffffff;--color-purple-container: var(--color-purple-90);--color-red: var(--color-red-40);--color-red-0: #000000;--color-red-10: #410001;--color-red-20: #690002;--color-red-30: #930005;--color-red-40: #be0c0e;--color-red-50: #e32e25;--color-red-60: #ff5545;--color-red-70: #ff8a7b;--color-red-80: #ffb4a9;--color-red-90: #ffdad5;--color-red-100: #ffffff;--color-red-container: var(--color-red-90);--color-scrim: var(--color-neutral-0);--color-secondary: var(--color-secondary-40);--color-secondary-0: #000000;--color-secondary-10: #1d192b;--color-secondary-20: #322e41;--color-secondary-30: #484458;--color-secondary-40: #605b71;--color-secondary-50: #79748a;--color-secondary-60: #938da5;--color-secondary-70: #aea8c0;--color-secondary-80: #cac3dc;--color-secondary-90: #e6dff9;--color-secondary-95: #f4eeff;--color-secondary-98: #fdf8ff;--color-secondary-100: #ffffff;--color-secondary-container: var(--color-secondary-90);--color-shadow: var(--color-neutral-0);--color-success: var(--color-green-40);--color-success-container: var(--color-green-90);--color-surface: var(--color-neutral-99);--color-surface-container: var(--color-neutral-94);--color-surface-container-high: var(--color-neutral-92);--color-surface-container-highest: var(--color-neutral-90);--color-surface-container-low: var(--color-neutral-96);--color-surface-container-lowest: var(--color-neutral-100);--color-surface-dim: var(--color-neutral-87);--color-surface-variant: var(--color-neutral-variant-90);--color-tertiary: var(--color-tertiary-40);--color-tertiary-0: #000000;--color-tertiary-10: #30111f;--color-tertiary-20: #492534;--color-tertiary-30: #623b4b;--color-tertiary-40: #7c5263;--color-tertiary-50: #986a7b;--color-tertiary-60: #b48395;--color-tertiary-70: #d09db0;--color-tertiary-80: #eeb8cb;--color-tertiary-90: #ffd9e5;--color-tertiary-95: #ffecf1;--color-tertiary-98: #fff8f8;--color-tertiary-100: #ffffff;--color-tertiary-container: var(--color-tertiary-90);--color-warning: var(--color-yellow-40);--color-warning-container: var(--color-yellow-90);--color-white: #ffffff;--color-yellow: var(--color-yellow-40);--color-yellow-0: #000000;--color-yellow-10: #241a00;--color-yellow-20: #3d2f00;--color-yellow-30: #574400;--color-yellow-40: #745b00;--color-yellow-50: #917400;--color-yellow-60: #b08d00;--color-yellow-70: #d0a600;--color-yellow-80: #f0c100;--color-yellow-90: #ffe089;--color-yellow-100: #ffffff;--color-yellow-container: var(--color-yellow-90);--container-lg: 1056px;--container-max: 1584px;--container-md: 672px;--container-sm: 320px;--container-xl: 1312px;--duration-long1: 450ms;--duration-long2: 500ms;--duration-medium1: 250ms;--duration-medium2: 300ms;--duration-short1: 50ms;--duration-short2: 100ms;--duration-short3: 150ms;--duration-short4: 200ms;--easing-linear: cubic-bezier(0, 0, 1, 1);--easing-standard: cubic-bezier(0.2, 0, 0, 1);--font-family-brand: "Noto Sans", sans-serif;--font-family-monospace: "Noto Sans Mono", monospace;--font-family-sans: "Noto Sans", sans-serif;--font-weight-bold: 700;--font-weight-medium: 500;--font-weight-regular: 400;--font-weight-semi-bold: 600;--global-avatar-border-radius: var(--shape-corner-full);--global-badge-color: var(--color-error);--scrollbar-width: 8px;--shape-corner-extra-large: 28px;--shape-corner-extra-small: 4px;--shape-corner-full: 9999px;--shape-corner-large: 16px;--shape-corner-large-increased: 20px;--shape-corner-medium: 12px;--shape-corner-none: 0;--shape-corner-small: 8px;--spacing-000: 0;--spacing-025: 0.125rem;--spacing-050: 0.25rem;--spacing-100: 0.5rem;--spacing-150: 0.75rem;--spacing-200: 1rem;--spacing-300: 1.5rem;--spacing-400: 2rem;--spacing-500: 2.5rem;--spacing-600: 3rem;--spacing-800: 4rem;--spacing-1000: 5rem;--spacing-1200: 6rem;--spacing-2000: 10rem;--spacing-base: 1rem;--typography-body-large-emphasized-font-family: var(--font-family-sans);--typography-body-large-emphasized-font-size: 1rem;--typography-body-large-emphasized-font-weight: var(--font-weight-medium);--typography-body-large-emphasized-letter-spacing: 0.5px;--typography-body-large-emphasized-line-height: 1.5rem;--typography-body-large-font-family: var(--font-family-sans);--typography-body-large-font-size: 1rem;--typography-body-large-font-weight: var(--font-weight-regular);--typography-body-large-letter-spacing: 0.5px;--typography-body-large-line-height: 1.5rem;--typography-body-medium-emphasized-font-family: var(--font-family-sans);--typography-body-medium-emphasized-font-size: 0.875rem;--typography-body-medium-emphasized-font-weight: var(--font-weight-medium);--typography-body-medium-emphasized-letter-spacing: 0.25px;--typography-body-medium-emphasized-line-height: 1.25rem;--typography-body-medium-font-family: var(--font-family-sans);--typography-body-medium-font-size: 0.875rem;--typography-body-medium-font-weight: var(--font-weight-regular);--typography-body-medium-letter-spacing: 0.25px;--typography-body-medium-line-height: 1.25rem;--typography-body-small-emphasized-font-family: var(--font-family-sans);--typography-body-small-emphasized-font-size: 0.75rem;--typography-body-small-emphasized-font-weight: var(--font-weight-medium);--typography-body-small-emphasized-letter-spacing: 0.4000000059604645px;--typography-body-small-emphasized-line-height: 1rem;--typography-body-small-font-family: var(--font-family-sans);--typography-body-small-font-size: 0.75rem;--typography-body-small-font-weight: var(--font-weight-regular);--typography-body-small-letter-spacing: 0.4000000059604645px;--typography-body-small-line-height: 1rem;--typography-code-large-emphasized-font-family: var(--font-family-monospace);--typography-code-large-emphasized-font-size: 1rem;--typography-code-large-emphasized-font-weight: var(--font-weight-medium);--typography-code-large-emphasized-letter-spacing: 0.5px;--typography-code-large-emphasized-line-height: 1.5rem;--typography-code-large-font-family: var(--font-family-monospace);--typography-code-large-font-size: 1rem;--typography-code-large-font-weight: var(--font-weight-regular);--typography-code-large-letter-spacing: 0.5px;--typography-code-large-line-height: 1.5rem;--typography-code-medium-emphasized-font-family: var(--font-family-monospace);--typography-code-medium-emphasized-font-size: 0.875rem;--typography-code-medium-emphasized-font-weight: var(--font-weight-medium);--typography-code-medium-emphasized-letter-spacing: 0.25px;--typography-code-medium-emphasized-line-height: 1.25rem;--typography-code-medium-font-family: var(--font-family-monospace);--typography-code-medium-font-size: 0.875rem;--typography-code-medium-font-weight: var(--font-weight-regular);--typography-code-medium-letter-spacing: 0.25px;--typography-code-medium-line-height: 1.25rem;--typography-code-small-emphasized-font-family: var(--font-family-monospace);--typography-code-small-emphasized-font-size: 0.75rem;--typography-code-small-emphasized-font-weight: var(--font-weight-medium);--typography-code-small-emphasized-letter-spacing: 0.4000000059604645px;--typography-code-small-emphasized-line-height: 1rem;--typography-code-small-font-family: var(--font-family-monospace);--typography-code-small-font-size: 0.75rem;--typography-code-small-font-weight: var(--font-weight-regular);--typography-code-small-letter-spacing: 0.4000000059604645px;--typography-code-small-line-height: 1rem;--typography-display-large-emphasized-font-family: var(--font-family-sans);--typography-display-large-emphasized-font-size: 3.5625rem;--typography-display-large-emphasized-font-weight: var(--font-weight-medium);--typography-display-large-emphasized-letter-spacing: -0.25px;--typography-display-large-emphasized-line-height: 4rem;--typography-display-large-font-family: var(--font-family-sans);--typography-display-large-font-size: 3.5625rem;--typography-display-large-font-weight: var(--font-weight-regular);--typography-display-large-letter-spacing: -0.25px;--typography-display-large-line-height: 4rem;--typography-display-medium-emphasized-font-family: var(--font-family-sans);--typography-display-medium-emphasized-font-size: 2.8125rem;--typography-display-medium-emphasized-font-weight: var(--font-weight-medium);--typography-display-medium-emphasized-letter-spacing: 0;--typography-display-medium-emphasized-line-height: 3.25rem;--typography-display-medium-font-family: var(--font-family-sans);--typography-display-medium-font-size: 2.8125rem;--typography-display-medium-font-weight: var(--font-weight-regular);--typography-display-medium-letter-spacing: 0;--typography-display-medium-line-height: 3.25rem;--typography-display-small-emphasized-font-family: var(--font-family-sans);--typography-display-small-emphasized-font-size: 2.25rem;--typography-display-small-emphasized-font-weight: var(--font-weight-medium);--typography-display-small-emphasized-letter-spacing: 0;--typography-display-small-emphasized-line-height: 2.75rem;--typography-display-small-font-family: var(--font-family-sans);--typography-display-small-font-size: 2.25rem;--typography-display-small-font-weight: var(--font-weight-regular);--typography-display-small-letter-spacing: 0;--typography-display-small-line-height: 2.75rem;--typography-headline-large-emphasized-font-family: var(--font-family-sans);--typography-headline-large-emphasized-font-size: 2rem;--typography-headline-large-emphasized-font-weight: var(--font-weight-medium);--typography-headline-large-emphasized-letter-spacing: 0;--typography-headline-large-emphasized-line-height: 2.5rem;--typography-headline-large-font-family: var(--font-family-sans);--typography-headline-large-font-size: 2rem;--typography-headline-large-font-weight: var(--font-weight-regular);--typography-headline-large-letter-spacing: 0;--typography-headline-large-line-height: 2.5rem;--typography-headline-medium-emphasized-font-family: var(--font-family-sans);--typography-headline-medium-emphasized-font-size: 1.75rem;--typography-headline-medium-emphasized-font-weight: var(--font-weight-medium);--typography-headline-medium-emphasized-letter-spacing: 0;--typography-headline-medium-emphasized-line-height: 2.25rem;--typography-headline-medium-font-family: var(--font-family-sans);--typography-headline-medium-font-size: 1.75rem;--typography-headline-medium-font-weight: var(--font-weight-regular);--typography-headline-medium-letter-spacing: 0;--typography-headline-medium-line-height: 2.25rem;--typography-headline-small-emphasized-font-family: var(--font-family-sans);--typography-headline-small-emphasized-font-size: 1.5rem;--typography-headline-small-emphasized-font-weight: var(--font-weight-medium);--typography-headline-small-emphasized-letter-spacing: 0;--typography-headline-small-emphasized-line-height: 2rem;--typography-headline-small-font-family: var(--font-family-sans);--typography-headline-small-font-size: 1.5rem;--typography-headline-small-font-weight: var(--font-weight-regular);--typography-headline-small-letter-spacing: 0;--typography-headline-small-line-height: 2rem;--typography-label-large-emphasized-font-family: var(--font-family-sans);--typography-label-large-emphasized-font-size: 0.875rem;--typography-label-large-emphasized-font-weight: var(--font-weight-semi-bold);--typography-label-large-emphasized-letter-spacing: 0.10000000149011612px;--typography-label-large-emphasized-line-height: 1.25rem;--typography-label-large-font-family: var(--font-family-sans);--typography-label-large-font-size: 0.875rem;--typography-label-large-font-weight: var(--font-weight-medium);--typography-label-large-letter-spacing: 0.10000000149011612px;--typography-label-large-line-height: 1.25rem;--typography-label-medium-emphasized-font-family: var(--font-family-sans);--typography-label-medium-emphasized-font-size: 0.75rem;--typography-label-medium-emphasized-font-weight: var(--font-weight-semi-bold);--typography-label-medium-emphasized-letter-spacing: 0.5px;--typography-label-medium-emphasized-line-height: 1rem;--typography-label-medium-font-family: var(--font-family-sans);--typography-label-medium-font-size: 0.75rem;--typography-label-medium-font-weight: var(--font-weight-medium);--typography-label-medium-letter-spacing: 0.5px;--typography-label-medium-line-height: 1rem;--typography-label-small-emphasized-font-family: var(--font-family-sans);--typography-label-small-emphasized-font-size: 0.6875rem;--typography-label-small-emphasized-font-weight: var(--font-weight-semi-bold);--typography-label-small-emphasized-letter-spacing: 0.5px;--typography-label-small-emphasized-line-height: 1rem;--typography-label-small-font-family: var(--font-family-sans);--typography-label-small-font-size: 0.6875rem;--typography-label-small-font-weight: var(--font-weight-medium);--typography-label-small-letter-spacing: 0.5px;--typography-label-small-line-height: 1rem;--typography-title-large-emphasized-font-family: var(--font-family-sans);--typography-title-large-emphasized-font-size: 1.375rem;--typography-title-large-emphasized-font-weight: var(--font-weight-medium);--typography-title-large-emphasized-letter-spacing: 0;--typography-title-large-emphasized-line-height: 1.75rem;--typography-title-large-font-family: var(--font-family-sans);--typography-title-large-font-size: 1.375rem;--typography-title-large-font-weight: var(--font-weight-regular);--typography-title-large-letter-spacing: 0;--typography-title-large-line-height: 1.75rem;--typography-title-medium-emphasized-font-family: var(--font-family-sans);--typography-title-medium-emphasized-font-size: 1rem;--typography-title-medium-emphasized-font-weight: var(--font-weight-semi-bold);--typography-title-medium-emphasized-letter-spacing: 0.15000000596046448px;--typography-title-medium-emphasized-line-height: 1.5rem;--typography-title-medium-font-family: var(--font-family-sans);--typography-title-medium-font-size: 1rem;--typography-title-medium-font-weight: var(--font-weight-medium);--typography-title-medium-letter-spacing: 0.15000000596046448px;--typography-title-medium-line-height: 1.5rem;--typography-title-small-emphasized-font-family: var(--font-family-sans);--typography-title-small-emphasized-font-size: 0.875rem;--typography-title-small-emphasized-font-weight: var(--font-weight-semi-bold);--typography-title-small-emphasized-letter-spacing: 0.10000000149011612px;--typography-title-small-emphasized-line-height: 1.25rem;--typography-title-small-font-family: var(--font-family-sans);--typography-title-small-font-size: 0.875rem;--typography-title-small-font-weight: var(--font-weight-medium);--typography-title-small-letter-spacing: 0.10000000149011612px;--typography-title-small-line-height: 1.25rem;--z-index-badge: 10;color-scheme:light dark}[data-theme=dark]{--color-blue: var(--color-blue-80);--color-blue-container: var(--color-blue-30);--color-error: var(--color-red-80);--color-error-container: var(--color-red-30);--color-green: var(--color-green-80);--color-green-container: var(--color-green-30);--color-inverse-blue: var(--color-blue-40);--color-inverse-error: var(--color-red-40);--color-inverse-green: var(--color-green-40);--color-inverse-on-surface: var(--color-neutral-20);--color-inverse-orange: var(--color-orange-40);--color-inverse-primary: var(--color-primary-40);--color-inverse-purple: var(--color-purple-40);--color-inverse-red: var(--color-red-40);--color-inverse-secondary: var(--color-secondary-40);--color-inverse-success: var(--color-green-40);--color-inverse-surface: var(--color-neutral-90);--color-inverse-tertiary: var(--color-tertiary-40);--color-inverse-warning: var(--color-yellow-40);--color-inverse-yellow: var(--color-yellow-40);--color-on-blue: var(--color-blue-20);--color-on-blue-container: var(--color-blue-90);--color-on-error: var(--color-red-20);--color-on-error-container: var(--color-red-90);--color-on-green: var(--color-green-20);--color-on-green-container: var(--color-green-90);--color-on-orange: var(--color-orange-20);--color-on-orange-container: var(--color-orange-90);--color-on-primary: var(--color-primary-20);--color-on-primary-container: var(--color-primary-90);--color-on-purple: var(--color-purple-20);--color-on-purple-container: var(--color-purple-90);--color-on-red: var(--color-red-20);--color-on-red-container: var(--color-red-90);--color-on-secondary: var(--color-secondary-20);--color-on-secondary-container: var(--color-secondary-90);--color-on-success: var(--color-green-20);--color-on-success-container: var(--color-green-90);--color-on-surface: var(--color-neutral-90);--color-on-surface-variant: var(--color-neutral-variant-80);--color-on-tertiary: var(--color-tertiary-20);--color-on-tertiary-container: var(--color-tertiary-90);--color-on-warning: var(--color-yellow-20);--color-on-warning-container: var(--color-yellow-90);--color-on-yellow: var(--color-yellow-20);--color-on-yellow-container: var(--color-yellow-90);--color-orange: var(--color-orange-80);--color-orange-container: var(--color-orange-30);--color-outline: var(--color-neutral-variant-60);--color-outline-variant: var(--color-neutral-variant-30);--color-primary: var(--color-primary-80);--color-primary-container: var(--color-primary-30);--color-purple: var(--color-purple-80);--color-purple-container: var(--color-purple-30);--color-red: var(--color-red-80);--color-red-container: var(--color-red-30);--color-scrim: var(--color-neutral-0);--color-secondary: var(--color-secondary-80);--color-secondary-container: var(--color-secondary-30);--color-shadow: var(--color-neutral-0);--color-success: var(--color-green-80);--color-success-container: var(--color-green-30);--color-surface: var(--color-neutral-10);--color-surface-container: var(--color-neutral-12);--color-surface-container-high: var(--color-neutral-17);--color-surface-container-highest: var(--color-neutral-22);--color-surface-container-low: var(--color-neutral-10);--color-surface-container-lowest: var(--color-neutral-4);--color-surface-dim: var(--color-neutral-6);--color-surface-variant: var(--color-neutral-variant-30);--color-tertiary: var(--color-tertiary-80);--color-tertiary-container: var(--color-tertiary-30);--color-warning: var(--color-yellow-80);--color-warning-container: var(--color-yellow-30);--color-yellow: var(--color-yellow-80);--color-yellow-container: var(--color-yellow-30)}
|
|
2
|
+
/*# sourceMappingURL=tokens.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["file:///home/runner/work/peacock/peacock/components/scss/tokens.css"],"names":[],"mappings":"AAIA,MACE,uBACA,mCACA,wBACA,yBACA,yBACA,yBACA,yBACA,yBACA,yBACA,yBACA,yBACA,yBACA,0BACA,6CACA,mCACA,6CACA,qCACA,yBACA,0BACA,0BACA,0BACA,0BACA,0BACA,0BACA,0BACA,0BACA,0BACA,2BACA,+CACA,2CACA,2CACA,6CACA,oDACA,+CACA,iDACA,+CACA,yCACA,qDACA,+CACA,iDACA,mDACA,gDACA,+CACA,yBACA,2BACA,2BACA,2BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,6BACA,iCACA,mCACA,mCACA,mCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,oCACA,qCACA,uCACA,gDACA,uCACA,gDACA,yCACA,kDACA,2CACA,oDACA,6CACA,sDACA,2CACA,oDACA,qCACA,8CACA,iDACA,0DACA,2CACA,oDACA,4CACA,4DACA,+CACA,wDACA,4CACA,qDACA,2CACA,oDACA,uCACA,0BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,4BACA,iDACA,iDACA,yDACA,yCACA,2BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,4BACA,6BACA,mDACA,uCACA,0BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,4BACA,iDACA,iCACA,uBACA,wBACA,wBACA,wBACA,wBACA,wBACA,wBACA,wBACA,wBACA,wBACA,yBACA,2CACA,sCACA,6CACA,6BACA,8BACA,8BACA,8BACA,8BACA,8BACA,8BACA,8BACA,8BACA,8BACA,8BACA,8BACA,+BACA,uDACA,uCACA,uCACA,iDACA,yCACA,mDACA,wDACA,2DACA,uDACA,2DACA,6CACA,yDACA,2CACA,4BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,8BACA,qDACA,wCACA,kDACA,uBACA,uCACA,0BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,2BACA,4BACA,iDACA,uBACA,wBACA,sBACA,sBACA,uBACA,wBACA,wBACA,0BACA,0BACA,wBACA,yBACA,yBACA,yBACA,0CACA,8CACA,6CACA,qDACA,4CACA,wBACA,0BACA,2BACA,6BACA,wDACA,yCACA,uBACA,iCACA,gCACA,4BACA,2BACA,qCACA,4BACA,uBACA,0BACA,iBACA,wBACA,uBACA,sBACA,uBACA,oBACA,sBACA,oBACA,sBACA,oBACA,oBACA,qBACA,qBACA,sBACA,qBACA,wEACA,mDACA,0EACA,yDACA,uDACA,6DACA,wCACA,gEACA,8CACA,4CACA,yEACA,wDACA,2EACA,2DACA,yDACA,8DACA,6CACA,iEACA,gDACA,8CACA,wEACA,sDACA,0EACA,wEACA,qDACA,6DACA,2CACA,gEACA,6DACA,0CACA,6EACA,mDACA,0EACA,yDACA,uDACA,kEACA,wCACA,gEACA,8CACA,4CACA,8EACA,wDACA,2EACA,2DACA,yDACA,mEACA,6CACA,iEACA,gDACA,8CACA,6EACA,sDACA,0EACA,wEACA,qDACA,kEACA,2CACA,gEACA,6DACA,0CACA,2EACA,2DACA,6EACA,8DACA,wDACA,gEACA,gDACA,mEACA,mDACA,6CACA,4EACA,4DACA,8EACA,yDACA,4DACA,iEACA,iDACA,oEACA,8CACA,iDACA,2EACA,yDACA,6EACA,wDACA,2DACA,gEACA,8CACA,mEACA,6CACA,gDACA,4EACA,uDACA,8EACA,yDACA,2DACA,iEACA,4CACA,oEACA,8CACA,gDACA,6EACA,2DACA,+EACA,0DACA,6DACA,kEACA,gDACA,qEACA,+CACA,kDACA,4EACA,yDACA,8EACA,yDACA,yDACA,iEACA,8CACA,oEACA,8CACA,8CACA,yEACA,wDACA,8EACA,0EACA,yDACA,8DACA,6CACA,gEACA,+DACA,8CACA,0EACA,wDACA,+EACA,2DACA,uDACA,+DACA,6CACA,iEACA,gDACA,4CACA,yEACA,yDACA,8EACA,0DACA,sDACA,8DACA,8CACA,gEACA,+CACA,2CACA,yEACA,wDACA,2EACA,sDACA,yDACA,8DACA,6CACA,iEACA,2CACA,8CACA,0EACA,qDACA,+EACA,2EACA,yDACA,+DACA,0CACA,iEACA,gEACA,8CACA,yEACA,wDACA,8EACA,0EACA,yDACA,8DACA,6CACA,gEACA,+DACA,8CACA,oBACA,wBAGF,kBACE,mCACA,6CACA,mCACA,6CACA,qCACA,+CACA,2CACA,2CACA,6CACA,oDACA,+CACA,iDACA,+CACA,yCACA,qDACA,+CACA,iDACA,mDACA,gDACA,+CACA,sCACA,gDACA,sCACA,gDACA,wCACA,kDACA,0CACA,oDACA,4CACA,sDACA,0CACA,oDACA,oCACA,8CACA,gDACA,0DACA,0CACA,oDACA,4CACA,4DACA,8CACA,wDACA,2CACA,qDACA,0CACA,oDACA,uCACA,iDACA,iDACA,yDACA,yCACA,mDACA,uCACA,iDACA,iCACA,2CACA,sCACA,6CACA,uDACA,uCACA,uCACA,iDACA,yCACA,mDACA,wDACA,2DACA,uDACA,yDACA,4CACA,yDACA,2CACA,qDACA,wCACA,kDACA,uCACA","sourcesContent":["/* -------------------------------------------\n * Autogenerated by ⛋ Terrazzo. DO NOT EDIT!\n * ------------------------------------------- */\n\n:root {\n --color-black: #000000;\n --color-blue: var(--color-blue-40);\n --color-blue-0: #000000;\n --color-blue-10: #001550;\n --color-blue-20: #00277f;\n --color-blue-30: #003ab2;\n --color-blue-40: #2352d5;\n --color-blue-50: #446def;\n --color-blue-60: #6789ff;\n --color-blue-70: #90a7ff;\n --color-blue-80: #b6c4ff;\n --color-blue-90: #dce1ff;\n --color-blue-100: #ffffff;\n --color-blue-container: var(--color-blue-90);\n --color-error: var(--color-red-40);\n --color-error-container: var(--color-red-90);\n --color-green: var(--color-green-40);\n --color-green-0: #000000;\n --color-green-10: #00210b;\n --color-green-20: #003917;\n --color-green-30: #005225;\n --color-green-40: #0f6d35;\n --color-green-50: #31874b;\n --color-green-60: #4da163;\n --color-green-70: #68bd7b;\n --color-green-80: #83d995;\n --color-green-90: #9ff6af;\n --color-green-100: #ffffff;\n --color-green-container: var(--color-green-90);\n --color-inverse-blue: var(--color-blue-80);\n --color-inverse-error: var(--color-red-80);\n --color-inverse-green: var(--color-green-80);\n --color-inverse-on-surface: var(--color-neutral-95);\n --color-inverse-orange: var(--color-orange-80);\n --color-inverse-primary: var(--color-primary-80);\n --color-inverse-purple: var(--color-purple-80);\n --color-inverse-red: var(--color-red-80);\n --color-inverse-secondary: var(--color-secondary-80);\n --color-inverse-success: var(--color-green-80);\n --color-inverse-surface: var(--color-neutral-20);\n --color-inverse-tertiary: var(--color-tertiary-80);\n --color-inverse-warning: var(--color-yellow-80);\n --color-inverse-yellow: var(--color-yellow-80);\n --color-neutral: #79767a;\n --color-neutral-0: #000000;\n --color-neutral-4: #0f0e11;\n --color-neutral-6: #141316;\n --color-neutral-10: #1c1b1e;\n --color-neutral-12: #201f23;\n --color-neutral-17: #2b292d;\n --color-neutral-20: #313033;\n --color-neutral-22: #363438;\n --color-neutral-30: #48464a;\n --color-neutral-40: #605d62;\n --color-neutral-50: #79767a;\n --color-neutral-60: #939094;\n --color-neutral-70: #aeaaaf;\n --color-neutral-80: #c9c5ca;\n --color-neutral-87: #ddd9dd;\n --color-neutral-90: #e6e1e6;\n --color-neutral-92: #ebe7ec;\n --color-neutral-94: #f1ecf1;\n --color-neutral-95: #f4eff4;\n --color-neutral-96: #f7f2f7;\n --color-neutral-98: #fdf8fd;\n --color-neutral-99: #fffbff;\n --color-neutral-100: #ffffff;\n --color-neutral-variant: #79757f;\n --color-neutral-variant-0: #000000;\n --color-neutral-variant-4: #0f0d15;\n --color-neutral-variant-6: #14121a;\n --color-neutral-variant-10: #1c1a22;\n --color-neutral-variant-12: #201e27;\n --color-neutral-variant-17: #2b2931;\n --color-neutral-variant-20: #312f38;\n --color-neutral-variant-22: #36333c;\n --color-neutral-variant-30: #48454e;\n --color-neutral-variant-40: #605d66;\n --color-neutral-variant-50: #79757f;\n --color-neutral-variant-60: #938f99;\n --color-neutral-variant-70: #aea9b4;\n --color-neutral-variant-80: #c9c4d0;\n --color-neutral-variant-87: #ddd8e3;\n --color-neutral-variant-90: #e6e0ec;\n --color-neutral-variant-92: #ece6f1;\n --color-neutral-variant-94: #f1ecf7;\n --color-neutral-variant-95: #f4eefa;\n --color-neutral-variant-96: #f7f1fd;\n --color-neutral-variant-98: #fdf8ff;\n --color-neutral-variant-99: #fffbff;\n --color-neutral-variant-100: #ffffff;\n --color-on-blue: var(--color-blue-100);\n --color-on-blue-container: var(--color-blue-10);\n --color-on-error: var(--color-red-100);\n --color-on-error-container: var(--color-red-10);\n --color-on-green: var(--color-green-100);\n --color-on-green-container: var(--color-green-10);\n --color-on-orange: var(--color-orange-100);\n --color-on-orange-container: var(--color-orange-10);\n --color-on-primary: var(--color-primary-100);\n --color-on-primary-container: var(--color-primary-10);\n --color-on-purple: var(--color-purple-100);\n --color-on-purple-container: var(--color-purple-10);\n --color-on-red: var(--color-red-100);\n --color-on-red-container: var(--color-red-10);\n --color-on-secondary: var(--color-secondary-100);\n --color-on-secondary-container: var(--color-secondary-10);\n --color-on-success: var(--color-green-100);\n --color-on-success-container: var(--color-green-10);\n --color-on-surface: var(--color-neutral-10);\n --color-on-surface-variant: var(--color-neutral-variant-30);\n --color-on-tertiary: var(--color-tertiary-100);\n --color-on-tertiary-container: var(--color-tertiary-10);\n --color-on-warning: var(--color-yellow-100);\n --color-on-warning-container: var(--color-yellow-10);\n --color-on-yellow: var(--color-yellow-100);\n --color-on-yellow-container: var(--color-yellow-10);\n --color-orange: var(--color-orange-40);\n --color-orange-0: #000000;\n --color-orange-10: #341100;\n --color-orange-20: #552100;\n --color-orange-30: #783100;\n --color-orange-40: #9e4300;\n --color-orange-50: #c55500;\n --color-orange-60: #ee6803;\n --color-orange-70: #ff8d4c;\n --color-orange-80: #ffb691;\n --color-orange-90: #ffdbcb;\n --color-orange-100: #ffffff;\n --color-orange-container: var(--color-orange-90);\n --color-outline: var(--color-neutral-variant-50);\n --color-outline-variant: var(--color-neutral-variant-80);\n --color-primary: var(--color-primary-40);\n --color-primary-0: #000000;\n --color-primary-10: #1d0061;\n --color-primary-20: #330098;\n --color-primary-30: #4a21bd;\n --color-primary-40: #6341d5;\n --color-primary-50: #7c5df0;\n --color-primary-60: #967cff;\n --color-primary-70: #b09dff;\n --color-primary-80: #cbbeff;\n --color-primary-90: #e7deff;\n --color-primary-95: #f4eeff;\n --color-primary-98: #fdf8ff;\n --color-primary-100: #ffffff;\n --color-primary-container: var(--color-primary-90);\n --color-purple: var(--color-purple-40);\n --color-purple-0: #000000;\n --color-purple-10: #3f001c;\n --color-purple-20: #650032;\n --color-purple-30: #8e0048;\n --color-purple-40: #ba0061;\n --color-purple-50: #e6067a;\n --color-purple-60: #ff4993;\n --color-purple-70: #ff84ad;\n --color-purple-80: #ffb1c7;\n --color-purple-90: #ffd9e2;\n --color-purple-100: #ffffff;\n --color-purple-container: var(--color-purple-90);\n --color-red: var(--color-red-40);\n --color-red-0: #000000;\n --color-red-10: #410001;\n --color-red-20: #690002;\n --color-red-30: #930005;\n --color-red-40: #be0c0e;\n --color-red-50: #e32e25;\n --color-red-60: #ff5545;\n --color-red-70: #ff8a7b;\n --color-red-80: #ffb4a9;\n --color-red-90: #ffdad5;\n --color-red-100: #ffffff;\n --color-red-container: var(--color-red-90);\n --color-scrim: var(--color-neutral-0);\n --color-secondary: var(--color-secondary-40);\n --color-secondary-0: #000000;\n --color-secondary-10: #1d192b;\n --color-secondary-20: #322e41;\n --color-secondary-30: #484458;\n --color-secondary-40: #605b71;\n --color-secondary-50: #79748a;\n --color-secondary-60: #938da5;\n --color-secondary-70: #aea8c0;\n --color-secondary-80: #cac3dc;\n --color-secondary-90: #e6dff9;\n --color-secondary-95: #f4eeff;\n --color-secondary-98: #fdf8ff;\n --color-secondary-100: #ffffff;\n --color-secondary-container: var(--color-secondary-90);\n --color-shadow: var(--color-neutral-0);\n --color-success: var(--color-green-40);\n --color-success-container: var(--color-green-90);\n --color-surface: var(--color-neutral-99);\n --color-surface-container: var(--color-neutral-94);\n --color-surface-container-high: var(--color-neutral-92);\n --color-surface-container-highest: var(--color-neutral-90);\n --color-surface-container-low: var(--color-neutral-96);\n --color-surface-container-lowest: var(--color-neutral-100);\n --color-surface-dim: var(--color-neutral-87);\n --color-surface-variant: var(--color-neutral-variant-90);\n --color-tertiary: var(--color-tertiary-40);\n --color-tertiary-0: #000000;\n --color-tertiary-10: #30111f;\n --color-tertiary-20: #492534;\n --color-tertiary-30: #623b4b;\n --color-tertiary-40: #7c5263;\n --color-tertiary-50: #986a7b;\n --color-tertiary-60: #b48395;\n --color-tertiary-70: #d09db0;\n --color-tertiary-80: #eeb8cb;\n --color-tertiary-90: #ffd9e5;\n --color-tertiary-95: #ffecf1;\n --color-tertiary-98: #fff8f8;\n --color-tertiary-100: #ffffff;\n --color-tertiary-container: var(--color-tertiary-90);\n --color-warning: var(--color-yellow-40);\n --color-warning-container: var(--color-yellow-90);\n --color-white: #ffffff;\n --color-yellow: var(--color-yellow-40);\n --color-yellow-0: #000000;\n --color-yellow-10: #241a00;\n --color-yellow-20: #3d2f00;\n --color-yellow-30: #574400;\n --color-yellow-40: #745b00;\n --color-yellow-50: #917400;\n --color-yellow-60: #b08d00;\n --color-yellow-70: #d0a600;\n --color-yellow-80: #f0c100;\n --color-yellow-90: #ffe089;\n --color-yellow-100: #ffffff;\n --color-yellow-container: var(--color-yellow-90);\n --container-lg: 1056px; /* Large container width. Intended for standard desktop layouts with typical content density. */\n --container-max: 1584px; /* Maximum container width. Use when constraining very wide layouts to maintain readable line lengths. */\n --container-md: 672px; /* Medium container width. Suitable for tablet layouts and compact desktop content areas. */\n --container-sm: 320px; /* Small container width. Use for narrow layouts and small screens such as mobile devices. */\n --container-xl: 1312px; /* Extra large container width. Use for wide desktop displays and content-heavy pages. */\n --duration-long1: 450ms; /* These durations are often paired with Emphasized easing. */\n --duration-long2: 500ms; /* These durations are often paired with Emphasized easing. */\n --duration-medium1: 250ms; /* These are used for medium duration transitions, like modal animations. */\n --duration-medium2: 300ms; /* These are used for medium duration transitions, like modal animations. */\n --duration-short1: 50ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n --duration-short2: 100ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n --duration-short3: 150ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n --duration-short4: 200ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n --easing-linear: cubic-bezier(0, 0, 1, 1);\n --easing-standard: cubic-bezier(0.2, 0, 0, 1);\n --font-family-brand: \"Noto Sans\", sans-serif; /* The font family used for brand headings and titles. */\n --font-family-monospace: \"Noto Sans Mono\", monospace; /* The font family used for code snippets and monospaced text. */\n --font-family-sans: \"Noto Sans\", sans-serif; /* The primary font family used for body text and general content. */\n --font-weight-bold: 700; /* Bold weight for emphasis. 700 weight. */\n --font-weight-medium: 500; /* Slightly heavier than regular weight. 500 weight. */\n --font-weight-regular: 400; /* Standard weight for regular text. 400 weight. */\n --font-weight-semi-bold: 600; /* Heavier than medium weight. 600 weight. */\n --global-avatar-border-radius: var(--shape-corner-full);\n --global-badge-color: var(--color-error);\n --scrollbar-width: 8px;\n --shape-corner-extra-large: 28px;\n --shape-corner-extra-small: 4px;\n --shape-corner-full: 9999px;\n --shape-corner-large: 16px;\n --shape-corner-large-increased: 20px;\n --shape-corner-medium: 12px;\n --shape-corner-none: 0;\n --shape-corner-small: 8px;\n --spacing-000: 0; /* No spacing (base × 0). */\n --spacing-025: 0.125rem; /* 2px - Smallest increment (base × 0.125). */\n --spacing-050: 0.25rem; /* 4px - Extra small spacing (base × 0.25). */\n --spacing-100: 0.5rem; /* 8px - Small spacing (base × 0.5). */\n --spacing-150: 0.75rem; /* 12px - Small-medium spacing (base × 0.75). */\n --spacing-200: 1rem; /* 16px - Base spacing unit (base × 1). */\n --spacing-300: 1.5rem; /* 24px - Medium spacing (base × 1.5). */\n --spacing-400: 2rem; /* 32px - Medium-large spacing (base × 2). */\n --spacing-500: 2.5rem; /* 40px - Large spacing (base × 2.5). */\n --spacing-600: 3rem; /* 48px - Extra large spacing (base × 3). */\n --spacing-800: 4rem; /* 64px - Huge spacing (base × 4). */\n --spacing-1000: 5rem; /* 80px - Massive spacing (base × 5). */\n --spacing-1200: 6rem; /* 96px - Gigantic spacing (base × 6). */\n --spacing-2000: 10rem; /* 160px - Maximum defined spacing (base × 10). */\n --spacing-base: 1rem; /* Base spacing unit (1rem = 16px). */\n --typography-body-large-emphasized-font-family: var(--font-family-sans);\n --typography-body-large-emphasized-font-size: 1rem;\n --typography-body-large-emphasized-font-weight: var(--font-weight-medium);\n --typography-body-large-emphasized-letter-spacing: 0.5px;\n --typography-body-large-emphasized-line-height: 1.5rem;\n --typography-body-large-font-family: var(--font-family-sans);\n --typography-body-large-font-size: 1rem;\n --typography-body-large-font-weight: var(--font-weight-regular);\n --typography-body-large-letter-spacing: 0.5px;\n --typography-body-large-line-height: 1.5rem;\n --typography-body-medium-emphasized-font-family: var(--font-family-sans);\n --typography-body-medium-emphasized-font-size: 0.875rem;\n --typography-body-medium-emphasized-font-weight: var(--font-weight-medium);\n --typography-body-medium-emphasized-letter-spacing: 0.25px;\n --typography-body-medium-emphasized-line-height: 1.25rem;\n --typography-body-medium-font-family: var(--font-family-sans);\n --typography-body-medium-font-size: 0.875rem;\n --typography-body-medium-font-weight: var(--font-weight-regular);\n --typography-body-medium-letter-spacing: 0.25px;\n --typography-body-medium-line-height: 1.25rem;\n --typography-body-small-emphasized-font-family: var(--font-family-sans);\n --typography-body-small-emphasized-font-size: 0.75rem;\n --typography-body-small-emphasized-font-weight: var(--font-weight-medium);\n --typography-body-small-emphasized-letter-spacing: 0.4000000059604645px;\n --typography-body-small-emphasized-line-height: 1rem;\n --typography-body-small-font-family: var(--font-family-sans);\n --typography-body-small-font-size: 0.75rem;\n --typography-body-small-font-weight: var(--font-weight-regular);\n --typography-body-small-letter-spacing: 0.4000000059604645px;\n --typography-body-small-line-height: 1rem;\n --typography-code-large-emphasized-font-family: var(--font-family-monospace);\n --typography-code-large-emphasized-font-size: 1rem;\n --typography-code-large-emphasized-font-weight: var(--font-weight-medium);\n --typography-code-large-emphasized-letter-spacing: 0.5px;\n --typography-code-large-emphasized-line-height: 1.5rem;\n --typography-code-large-font-family: var(--font-family-monospace);\n --typography-code-large-font-size: 1rem;\n --typography-code-large-font-weight: var(--font-weight-regular);\n --typography-code-large-letter-spacing: 0.5px;\n --typography-code-large-line-height: 1.5rem;\n --typography-code-medium-emphasized-font-family: var(--font-family-monospace);\n --typography-code-medium-emphasized-font-size: 0.875rem;\n --typography-code-medium-emphasized-font-weight: var(--font-weight-medium);\n --typography-code-medium-emphasized-letter-spacing: 0.25px;\n --typography-code-medium-emphasized-line-height: 1.25rem;\n --typography-code-medium-font-family: var(--font-family-monospace);\n --typography-code-medium-font-size: 0.875rem;\n --typography-code-medium-font-weight: var(--font-weight-regular);\n --typography-code-medium-letter-spacing: 0.25px;\n --typography-code-medium-line-height: 1.25rem;\n --typography-code-small-emphasized-font-family: var(--font-family-monospace);\n --typography-code-small-emphasized-font-size: 0.75rem;\n --typography-code-small-emphasized-font-weight: var(--font-weight-medium);\n --typography-code-small-emphasized-letter-spacing: 0.4000000059604645px;\n --typography-code-small-emphasized-line-height: 1rem;\n --typography-code-small-font-family: var(--font-family-monospace);\n --typography-code-small-font-size: 0.75rem;\n --typography-code-small-font-weight: var(--font-weight-regular);\n --typography-code-small-letter-spacing: 0.4000000059604645px;\n --typography-code-small-line-height: 1rem;\n --typography-display-large-emphasized-font-family: var(--font-family-sans);\n --typography-display-large-emphasized-font-size: 3.5625rem;\n --typography-display-large-emphasized-font-weight: var(--font-weight-medium);\n --typography-display-large-emphasized-letter-spacing: -0.25px;\n --typography-display-large-emphasized-line-height: 4rem;\n --typography-display-large-font-family: var(--font-family-sans);\n --typography-display-large-font-size: 3.5625rem;\n --typography-display-large-font-weight: var(--font-weight-regular);\n --typography-display-large-letter-spacing: -0.25px;\n --typography-display-large-line-height: 4rem;\n --typography-display-medium-emphasized-font-family: var(--font-family-sans);\n --typography-display-medium-emphasized-font-size: 2.8125rem;\n --typography-display-medium-emphasized-font-weight: var(--font-weight-medium);\n --typography-display-medium-emphasized-letter-spacing: 0;\n --typography-display-medium-emphasized-line-height: 3.25rem;\n --typography-display-medium-font-family: var(--font-family-sans);\n --typography-display-medium-font-size: 2.8125rem;\n --typography-display-medium-font-weight: var(--font-weight-regular);\n --typography-display-medium-letter-spacing: 0;\n --typography-display-medium-line-height: 3.25rem;\n --typography-display-small-emphasized-font-family: var(--font-family-sans);\n --typography-display-small-emphasized-font-size: 2.25rem;\n --typography-display-small-emphasized-font-weight: var(--font-weight-medium);\n --typography-display-small-emphasized-letter-spacing: 0;\n --typography-display-small-emphasized-line-height: 2.75rem;\n --typography-display-small-font-family: var(--font-family-sans);\n --typography-display-small-font-size: 2.25rem;\n --typography-display-small-font-weight: var(--font-weight-regular);\n --typography-display-small-letter-spacing: 0;\n --typography-display-small-line-height: 2.75rem;\n --typography-headline-large-emphasized-font-family: var(--font-family-sans);\n --typography-headline-large-emphasized-font-size: 2rem;\n --typography-headline-large-emphasized-font-weight: var(--font-weight-medium);\n --typography-headline-large-emphasized-letter-spacing: 0;\n --typography-headline-large-emphasized-line-height: 2.5rem;\n --typography-headline-large-font-family: var(--font-family-sans);\n --typography-headline-large-font-size: 2rem;\n --typography-headline-large-font-weight: var(--font-weight-regular);\n --typography-headline-large-letter-spacing: 0;\n --typography-headline-large-line-height: 2.5rem;\n --typography-headline-medium-emphasized-font-family: var(--font-family-sans);\n --typography-headline-medium-emphasized-font-size: 1.75rem;\n --typography-headline-medium-emphasized-font-weight: var(--font-weight-medium);\n --typography-headline-medium-emphasized-letter-spacing: 0;\n --typography-headline-medium-emphasized-line-height: 2.25rem;\n --typography-headline-medium-font-family: var(--font-family-sans);\n --typography-headline-medium-font-size: 1.75rem;\n --typography-headline-medium-font-weight: var(--font-weight-regular);\n --typography-headline-medium-letter-spacing: 0;\n --typography-headline-medium-line-height: 2.25rem;\n --typography-headline-small-emphasized-font-family: var(--font-family-sans);\n --typography-headline-small-emphasized-font-size: 1.5rem;\n --typography-headline-small-emphasized-font-weight: var(--font-weight-medium);\n --typography-headline-small-emphasized-letter-spacing: 0;\n --typography-headline-small-emphasized-line-height: 2rem;\n --typography-headline-small-font-family: var(--font-family-sans);\n --typography-headline-small-font-size: 1.5rem;\n --typography-headline-small-font-weight: var(--font-weight-regular);\n --typography-headline-small-letter-spacing: 0;\n --typography-headline-small-line-height: 2rem;\n --typography-label-large-emphasized-font-family: var(--font-family-sans);\n --typography-label-large-emphasized-font-size: 0.875rem;\n --typography-label-large-emphasized-font-weight: var(--font-weight-semi-bold);\n --typography-label-large-emphasized-letter-spacing: 0.10000000149011612px;\n --typography-label-large-emphasized-line-height: 1.25rem;\n --typography-label-large-font-family: var(--font-family-sans);\n --typography-label-large-font-size: 0.875rem;\n --typography-label-large-font-weight: var(--font-weight-medium);\n --typography-label-large-letter-spacing: 0.10000000149011612px;\n --typography-label-large-line-height: 1.25rem;\n --typography-label-medium-emphasized-font-family: var(--font-family-sans);\n --typography-label-medium-emphasized-font-size: 0.75rem;\n --typography-label-medium-emphasized-font-weight: var(--font-weight-semi-bold);\n --typography-label-medium-emphasized-letter-spacing: 0.5px;\n --typography-label-medium-emphasized-line-height: 1rem;\n --typography-label-medium-font-family: var(--font-family-sans);\n --typography-label-medium-font-size: 0.75rem;\n --typography-label-medium-font-weight: var(--font-weight-medium);\n --typography-label-medium-letter-spacing: 0.5px;\n --typography-label-medium-line-height: 1rem;\n --typography-label-small-emphasized-font-family: var(--font-family-sans);\n --typography-label-small-emphasized-font-size: 0.6875rem;\n --typography-label-small-emphasized-font-weight: var(--font-weight-semi-bold);\n --typography-label-small-emphasized-letter-spacing: 0.5px;\n --typography-label-small-emphasized-line-height: 1rem;\n --typography-label-small-font-family: var(--font-family-sans);\n --typography-label-small-font-size: 0.6875rem;\n --typography-label-small-font-weight: var(--font-weight-medium);\n --typography-label-small-letter-spacing: 0.5px;\n --typography-label-small-line-height: 1rem;\n --typography-title-large-emphasized-font-family: var(--font-family-sans);\n --typography-title-large-emphasized-font-size: 1.375rem;\n --typography-title-large-emphasized-font-weight: var(--font-weight-medium);\n --typography-title-large-emphasized-letter-spacing: 0;\n --typography-title-large-emphasized-line-height: 1.75rem;\n --typography-title-large-font-family: var(--font-family-sans);\n --typography-title-large-font-size: 1.375rem;\n --typography-title-large-font-weight: var(--font-weight-regular);\n --typography-title-large-letter-spacing: 0;\n --typography-title-large-line-height: 1.75rem;\n --typography-title-medium-emphasized-font-family: var(--font-family-sans);\n --typography-title-medium-emphasized-font-size: 1rem;\n --typography-title-medium-emphasized-font-weight: var(--font-weight-semi-bold);\n --typography-title-medium-emphasized-letter-spacing: 0.15000000596046448px;\n --typography-title-medium-emphasized-line-height: 1.5rem;\n --typography-title-medium-font-family: var(--font-family-sans);\n --typography-title-medium-font-size: 1rem;\n --typography-title-medium-font-weight: var(--font-weight-medium);\n --typography-title-medium-letter-spacing: 0.15000000596046448px;\n --typography-title-medium-line-height: 1.5rem;\n --typography-title-small-emphasized-font-family: var(--font-family-sans);\n --typography-title-small-emphasized-font-size: 0.875rem;\n --typography-title-small-emphasized-font-weight: var(--font-weight-semi-bold);\n --typography-title-small-emphasized-letter-spacing: 0.10000000149011612px;\n --typography-title-small-emphasized-line-height: 1.25rem;\n --typography-title-small-font-family: var(--font-family-sans);\n --typography-title-small-font-size: 0.875rem;\n --typography-title-small-font-weight: var(--font-weight-medium);\n --typography-title-small-letter-spacing: 0.10000000149011612px;\n --typography-title-small-line-height: 1.25rem;\n --z-index-badge: 10;\n color-scheme: light dark;\n}\n\n[data-theme='dark'] {\n --color-blue: var(--color-blue-80);\n --color-blue-container: var(--color-blue-30);\n --color-error: var(--color-red-80);\n --color-error-container: var(--color-red-30);\n --color-green: var(--color-green-80);\n --color-green-container: var(--color-green-30);\n --color-inverse-blue: var(--color-blue-40);\n --color-inverse-error: var(--color-red-40);\n --color-inverse-green: var(--color-green-40);\n --color-inverse-on-surface: var(--color-neutral-20);\n --color-inverse-orange: var(--color-orange-40);\n --color-inverse-primary: var(--color-primary-40);\n --color-inverse-purple: var(--color-purple-40);\n --color-inverse-red: var(--color-red-40);\n --color-inverse-secondary: var(--color-secondary-40);\n --color-inverse-success: var(--color-green-40);\n --color-inverse-surface: var(--color-neutral-90);\n --color-inverse-tertiary: var(--color-tertiary-40);\n --color-inverse-warning: var(--color-yellow-40);\n --color-inverse-yellow: var(--color-yellow-40);\n --color-on-blue: var(--color-blue-20);\n --color-on-blue-container: var(--color-blue-90);\n --color-on-error: var(--color-red-20);\n --color-on-error-container: var(--color-red-90);\n --color-on-green: var(--color-green-20);\n --color-on-green-container: var(--color-green-90);\n --color-on-orange: var(--color-orange-20);\n --color-on-orange-container: var(--color-orange-90);\n --color-on-primary: var(--color-primary-20);\n --color-on-primary-container: var(--color-primary-90);\n --color-on-purple: var(--color-purple-20);\n --color-on-purple-container: var(--color-purple-90);\n --color-on-red: var(--color-red-20);\n --color-on-red-container: var(--color-red-90);\n --color-on-secondary: var(--color-secondary-20);\n --color-on-secondary-container: var(--color-secondary-90);\n --color-on-success: var(--color-green-20);\n --color-on-success-container: var(--color-green-90);\n --color-on-surface: var(--color-neutral-90);\n --color-on-surface-variant: var(--color-neutral-variant-80);\n --color-on-tertiary: var(--color-tertiary-20);\n --color-on-tertiary-container: var(--color-tertiary-90);\n --color-on-warning: var(--color-yellow-20);\n --color-on-warning-container: var(--color-yellow-90);\n --color-on-yellow: var(--color-yellow-20);\n --color-on-yellow-container: var(--color-yellow-90);\n --color-orange: var(--color-orange-80);\n --color-orange-container: var(--color-orange-30);\n --color-outline: var(--color-neutral-variant-60);\n --color-outline-variant: var(--color-neutral-variant-30);\n --color-primary: var(--color-primary-80);\n --color-primary-container: var(--color-primary-30);\n --color-purple: var(--color-purple-80);\n --color-purple-container: var(--color-purple-30);\n --color-red: var(--color-red-80);\n --color-red-container: var(--color-red-30);\n --color-scrim: var(--color-neutral-0);\n --color-secondary: var(--color-secondary-80);\n --color-secondary-container: var(--color-secondary-30);\n --color-shadow: var(--color-neutral-0);\n --color-success: var(--color-green-80);\n --color-success-container: var(--color-green-30);\n --color-surface: var(--color-neutral-10);\n --color-surface-container: var(--color-neutral-12);\n --color-surface-container-high: var(--color-neutral-17);\n --color-surface-container-highest: var(--color-neutral-22);\n --color-surface-container-low: var(--color-neutral-10);\n --color-surface-container-lowest: var(--color-neutral-4);\n --color-surface-dim: var(--color-neutral-6);\n --color-surface-variant: var(--color-neutral-variant-30);\n --color-tertiary: var(--color-tertiary-80);\n --color-tertiary-container: var(--color-tertiary-30);\n --color-warning: var(--color-yellow-80);\n --color-warning-container: var(--color-yellow-30);\n --color-yellow: var(--color-yellow-80);\n --color-yellow-container: var(--color-yellow-30);\n}\n\n"]}
|
|
@@ -69,7 +69,7 @@ slot::slotted(*) {
|
|
|
69
69
|
justify-content: center;
|
|
70
70
|
gap: var(--_button-icon-label-spacing);
|
|
71
71
|
width: 100%;
|
|
72
|
-
z-index:
|
|
72
|
+
z-index: 0;
|
|
73
73
|
color: var(--_label-text-color);
|
|
74
74
|
opacity: var(--_label-text-opacity, 1);
|
|
75
75
|
--icon-size: var(--button-icon-size, var(--_button-icon-size));
|
|
@@ -895,4 +895,4 @@ Button = __decorate([
|
|
|
895
895
|
], Button);
|
|
896
896
|
|
|
897
897
|
export { Button as B, css_248z$1 as a, BaseButton as b, css_248z$2 as c, spread as s };
|
|
898
|
-
//# sourceMappingURL=button-
|
|
898
|
+
//# sourceMappingURL=button-DaL4va7Q.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-2MeDq0Yy.js","sources":["../../src/spread.ts","../../src/button/BaseButton.ts","../../src/button/button/button.ts"],"sourcesContent":["import {\n directive,\n Directive,\n ElementPart,\n PartInfo,\n PartType,\n} from 'lit/directive.js';\n\nclass SpreadDirective extends Directive {\n constructor(partInfo: PartInfo) {\n super(partInfo);\n if (partInfo.type !== PartType.ELEMENT) {\n throw new Error('spread() can only be used on elements');\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n render(_props: { [key: string]: any } | undefined) {\n return '';\n }\n\n update(part: ElementPart, [props]: [{ [key: string]: any } | undefined]) {\n if (!props) return;\n // eslint-disable-next-line guard-for-in,no-restricted-syntax\n for (const key in props) {\n const value = props[key];\n if (value === undefined || value === null) {\n part.element.removeAttribute(key);\n } else {\n part.element.setAttribute(key, value);\n }\n }\n }\n}\n\nexport const spread = directive(SpreadDirective);\n","import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { dispatchActivationClick, isActivationClick } from '../utils/dispatch-event-utils.js';\n\nexport class BaseButton extends LitElement {\n #id = crypto.randomUUID();\n\n @property({ type: String }) htmlType: 'button' | 'submit' | 'reset' =\n 'button';\n\n /**\n * Type is preset of color and variant. Type will be only applied.\n *\n */\n @property({ type: String }) type?: 'primary' | 'secondary' | 'tertiary';\n\n /**\n * The visual style of the button.\n *\n * Possible variant values:\n * `\"filled\"` is a filled button.\n * `\"outlined\"` is an outlined button.\n * `\"text\"` is a transparent button.\n * `\"tonal\"` is a light color button.\n * `\"elevated\"` is elevated button\n */\n @property() variant:\n | 'elevated'\n | 'filled'\n | 'tonal'\n | 'outlined'\n | 'text'\n | 'neo' = 'filled';\n\n /**\n * Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.\n */\n @property({ reflect: true }) color:\n | 'primary'\n | 'success'\n | 'danger'\n | 'warning'\n | 'light'\n | 'dark' = 'primary';\n\n /**\n * Button size.\n * Possible values are `\"sm\"`, `\"md\"`, `\"lg\"`. Defaults to `\"md\"`.\n */\n @property() size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n /**\n * If true, the user cannot interact with the button. Defaults to `false`.\n */\n @property({ type: Boolean, reflect: true })\n disabled: boolean = false;\n\n @property() skeleton: boolean = false;\n\n /**\n * If true, the user cannot interact with the button and the button is visually styled as disabled. But the button is still focusable. Defaults to `false`.\n */\n @property({ reflect: true, attribute: 'soft-disabled' })\n softDisabled: boolean = false;\n\n /**\n * If button is disabled, the reason why it is disabled.\n */\n @property({ attribute: 'disabled-reason' })\n disabledReason: string = '';\n\n /**\n * Hyperlink to navigate to on click.\n */\n @property({ reflect: true }) href?: string;\n\n @property({ reflect: true })\n configAria?: { [key: string]: any };\n\n /**\n * Sets or retrieves the window or frame at which to target content.\n */\n @property() target: string = '_self';\n\n @property() selected: boolean = false;\n\n /**\n * Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.\n */\n @property() throttleDelay = 200;\n\n @property() tooltip?: string;\n\n /**\n * States\n */\n @state()\n isPressed = false;\n\n @query('.button') readonly buttonElement!: HTMLElement | null;\n\n override focus() {\n this.buttonElement?.focus();\n }\n\n override blur() {\n this.buttonElement?.blur();\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.__dispatchClickWithThrottle);\n window.addEventListener('mouseup', this.__handlePress);\n }\n\n override disconnectedCallback() {\n window.removeEventListener('mouseup', this.__handlePress);\n this.removeEventListener('click', this.__dispatchClickWithThrottle);\n super.disconnectedCallback();\n }\n\n __handlePress = (event: KeyboardEvent | MouseEvent) => {\n if (this.disabled || this.skeleton || this.softDisabled) return;\n if (\n event instanceof KeyboardEvent &&\n event.type === 'keydown' &&\n (event.key === 'Enter' || event.key === ' ')\n ) {\n this.isPressed = true;\n } else if (event.type === 'mousedown') {\n this.isPressed = true;\n } else {\n this.isPressed = false;\n }\n };\n\n __isLink() {\n return !!this.href;\n }\n\n __dispatchClickWithThrottle: (event: MouseEvent | KeyboardEvent) => void =\n event => {\n this.__dispatchClick(event);\n };\n\n __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n // If the button is soft-disabled or a disabled link, we need to explicitly\n // prevent the click from propagating to other event listeners as well as\n // prevent the default action.\n if (this.softDisabled || (this.disabled && this.href) || this.skeleton) {\n event.stopImmediatePropagation();\n event.preventDefault();\n return;\n }\n\n if (!isActivationClick(event) || !this.buttonElement) {\n return;\n }\n\n this.focus();\n dispatchActivationClick(this.buttonElement);\n };\n\n __convertTypeToVariantAndColor() {\n if (this.type === 'primary') {\n this.color = 'primary';\n this.variant = 'filled';\n } else if (this.type === 'secondary') {\n this.color = 'dark';\n this.variant = 'outlined';\n } else if (this.type === 'tertiary') {\n this.color = 'primary';\n this.variant = 'text';\n } else if (this.type === 'danger') {\n this.color = 'danger';\n this.variant = 'filled';\n }\n }\n\n __getDisabledReasonID() {\n return this.disabled && this.disabledReason\n ? `disabled-reason-${this.#id}`\n : nothing;\n }\n\n __renderDisabledReason() {\n const disabledReasonID = this.__getDisabledReasonID();\n if (disabledReasonID)\n return html`<div\n id=\"disabled-reason-${this.#id}\"\n role=\"tooltip\"\n aria-label=${this.disabledReason}\n class=\"screen-reader-only\"\n >\n {this.disabledReason}\n </div>`;\n return nothing;\n }\n\n __renderTooltip() {\n if (this.tooltip) {\n return html`<base-tooltip for=\"button\">${this.tooltip}</base-tooltip>`;\n }\n return nothing;\n }\n}\n","import { html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport PeacockComponent from 'src/PeacockComponent.js';\nimport styles from './button.scss';\nimport colorStyles from './button-colors.scss';\nimport sizeStyles from './button-sizes.scss';\nimport { observerSlotChangesWithCallback, throttle } from '../../utils.js';\nimport { spread } from '../../spread.js';\nimport { BaseButton } from '../BaseButton.js';\n\n/**\n * @label Button\n * @tag base-button\n * @rawTag button\n *\n * @summary Buttons help people initiate actions, from sending an email, to sharing a document, to liking a post.\n * @overview\n * <p>Buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways. Button labels express what action will occur when the user interacts with it.</p>\n *\n * @cssprop --button-container-shape: Defines the border radius of the button container shape.\n *\n * @cssprop --button-container-shape-start-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-start-end: Defines the end position of the button container shape.\n * @cssprop --button-container-shape-end-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-end-end: Defines the end position of the button container shape.\n *\n *\n * @cssprop --filled-button-container-color: Color of the filled button container.\n * @cssprop --filled-button-label-text-color: Text color of the filled button label.\n *\n * @cssprop --outlined-button-container-color: Color of the outlined button container.\n * @cssprop --outlined-button-label-text-color: Text color of the outlined button label.\n *\n * @cssprop --text-button-label-text-color: Text color of the text button label.\n *\n * @cssprop --tonal-button-container-color: Color of the tonal button container.\n * @cssprop --tonal-button-label-text-color: Text color of the tonal button label.\n *\n * @cssprop --elevated-button-container-color: Color of the elevated button container.\n * @cssprop --elevated-button-label-text-color: Text color of the elevated button label.\n *\n * @cssprop --neo-button-container-color: Color of the neo button container.\n * @cssprop --neo-button-label-text-color: Text color of the neo button label.\n *\n * @fires {MouseEvent} click - Dispatched when the button is clicked.\n *\n * @example\n * ```html\n * <base-button>Button</base-button>\n * ```\n * @tags display\n */\n@PeacockComponent\nexport class Button extends BaseButton {\n static override styles = [styles, colorStyles, sizeStyles];\n\n #tabindex?: number = 0;\n\n /**\n * Icon alignment.\n * Possible values are `\"start\"`, `\"end\"`. Defaults to `\"end\"`.\n */\n @property({ attribute: 'icon-align' })\n iconAlign: 'start' | 'end' = 'end';\n\n @state()\n private slotHasContent = false;\n\n override firstUpdated() {\n this.__dispatchClickWithThrottle = throttle(\n this.__dispatchClick,\n this.throttleDelay,\n );\n observerSlotChangesWithCallback(\n this.renderRoot.querySelector('slot'),\n hasContent => {\n this.slotHasContent = hasContent;\n this.requestUpdate();\n },\n );\n\n this.__convertTypeToVariantAndColor();\n }\n\n override render() {\n const isLink = this.__isLink();\n\n const cssClasses = {\n button: true,\n 'button-element': true,\n [`size-${this.size}`]: true,\n [`variant-${this.variant}`]: true,\n [`color-${this.color}`]: true,\n disabled: this.disabled || this.softDisabled,\n pressed: this.isPressed,\n 'has-content': this.slotHasContent,\n 'show-skeleton': this.skeleton,\n [`icon-align-${this.iconAlign}`]: true,\n };\n\n if (!isLink) {\n return html`<button\n class=${classMap(cssClasses)}\n id=\"button\"\n tabindex=${this.#tabindex}\n type=${this.htmlType}\n @mousedown=${this.__handlePress}\n @keydown=${this.__handlePress}\n @keyup=${this.__handlePress}\n ?aria-describedby=${this.__getDisabledReasonID()}\n aria-disabled=${`${this.disabled || this.softDisabled}`}\n ?disabled=${this.disabled}\n ${spread(this.configAria)}\n >\n ${this.renderButtonContent()}\n </button>\n ${this.__renderTooltip()}`;\n }\n return html`<a\n class=${classMap(cssClasses)}\n id=\"button\"\n tabindex=${this.#tabindex}\n href=${this.href}\n target=${this.target}\n @mousedown=${this.__handlePress}\n @keydown=${this.__handlePress}\n @keyup=${this.__handlePress}\n role=\"button\"\n ?aria-describedby=${this.__getDisabledReasonID()}\n aria-disabled=${`${this.disabled}`}\n ${spread(this.configAria)}\n >\n ${this.renderButtonContent()}\n </a>\n ${this.__renderTooltip()}`;\n }\n\n renderButtonContent() {\n return html`\n <focus-ring class=\"focus-ring\" .control=${this} element=\"buttonElement\"></focus-ring>\n <base-elevation class=\"elevation\"></base-elevation>\n <div class=\"neo-background\"></div>\n <div class=\"background\"></div>\n <div class=\"outline\"></div>\n <base-ripple class=\"ripple\"></base-ripple>\n <base-skeleton class=\"skeleton\"></base-skeleton>\n\n <div class=\"button-content\">\n <div class=\"slot-container\">\n <slot></slot>\n </div>\n\n <slot name=\"icon\"></slot>\n </div>\n\n ${this.__renderDisabledReason()}\n `;\n }\n}\n"],"names":["Directive","PartType","directive","LitElement","nothing","html","property","state","query","classMap","styles","colorStyles","sizeStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"button-DaL4va7Q.js","sources":["../../src/spread.ts","../../src/button/BaseButton.ts","../../src/button/button/button.ts"],"sourcesContent":["import {\n directive,\n Directive,\n ElementPart,\n PartInfo,\n PartType,\n} from 'lit/directive.js';\n\nclass SpreadDirective extends Directive {\n constructor(partInfo: PartInfo) {\n super(partInfo);\n if (partInfo.type !== PartType.ELEMENT) {\n throw new Error('spread() can only be used on elements');\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n render(_props: { [key: string]: any } | undefined) {\n return '';\n }\n\n update(part: ElementPart, [props]: [{ [key: string]: any } | undefined]) {\n if (!props) return;\n // eslint-disable-next-line guard-for-in,no-restricted-syntax\n for (const key in props) {\n const value = props[key];\n if (value === undefined || value === null) {\n part.element.removeAttribute(key);\n } else {\n part.element.setAttribute(key, value);\n }\n }\n }\n}\n\nexport const spread = directive(SpreadDirective);\n","import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { dispatchActivationClick, isActivationClick } from '../utils/dispatch-event-utils.js';\n\nexport class BaseButton extends LitElement {\n #id = crypto.randomUUID();\n\n @property({ type: String }) htmlType: 'button' | 'submit' | 'reset' =\n 'button';\n\n /**\n * Type is preset of color and variant. Type will be only applied.\n *\n */\n @property({ type: String }) type?: 'primary' | 'secondary' | 'tertiary';\n\n /**\n * The visual style of the button.\n *\n * Possible variant values:\n * `\"filled\"` is a filled button.\n * `\"outlined\"` is an outlined button.\n * `\"text\"` is a transparent button.\n * `\"tonal\"` is a light color button.\n * `\"elevated\"` is elevated button\n */\n @property() variant:\n | 'elevated'\n | 'filled'\n | 'tonal'\n | 'outlined'\n | 'text'\n | 'neo' = 'filled';\n\n /**\n * Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.\n */\n @property({ reflect: true }) color:\n | 'primary'\n | 'success'\n | 'danger'\n | 'warning'\n | 'light'\n | 'dark' = 'primary';\n\n /**\n * Button size.\n * Possible values are `\"sm\"`, `\"md\"`, `\"lg\"`. Defaults to `\"md\"`.\n */\n @property() size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n /**\n * If true, the user cannot interact with the button. Defaults to `false`.\n */\n @property({ type: Boolean, reflect: true })\n disabled: boolean = false;\n\n @property() skeleton: boolean = false;\n\n /**\n * If true, the user cannot interact with the button and the button is visually styled as disabled. But the button is still focusable. Defaults to `false`.\n */\n @property({ reflect: true, attribute: 'soft-disabled' })\n softDisabled: boolean = false;\n\n /**\n * If button is disabled, the reason why it is disabled.\n */\n @property({ attribute: 'disabled-reason' })\n disabledReason: string = '';\n\n /**\n * Hyperlink to navigate to on click.\n */\n @property({ reflect: true }) href?: string;\n\n @property({ reflect: true })\n configAria?: { [key: string]: any };\n\n /**\n * Sets or retrieves the window or frame at which to target content.\n */\n @property() target: string = '_self';\n\n @property() selected: boolean = false;\n\n /**\n * Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.\n */\n @property() throttleDelay = 200;\n\n @property() tooltip?: string;\n\n /**\n * States\n */\n @state()\n isPressed = false;\n\n @query('.button') readonly buttonElement!: HTMLElement | null;\n\n override focus() {\n this.buttonElement?.focus();\n }\n\n override blur() {\n this.buttonElement?.blur();\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.__dispatchClickWithThrottle);\n window.addEventListener('mouseup', this.__handlePress);\n }\n\n override disconnectedCallback() {\n window.removeEventListener('mouseup', this.__handlePress);\n this.removeEventListener('click', this.__dispatchClickWithThrottle);\n super.disconnectedCallback();\n }\n\n __handlePress = (event: KeyboardEvent | MouseEvent) => {\n if (this.disabled || this.skeleton || this.softDisabled) return;\n if (\n event instanceof KeyboardEvent &&\n event.type === 'keydown' &&\n (event.key === 'Enter' || event.key === ' ')\n ) {\n this.isPressed = true;\n } else if (event.type === 'mousedown') {\n this.isPressed = true;\n } else {\n this.isPressed = false;\n }\n };\n\n __isLink() {\n return !!this.href;\n }\n\n __dispatchClickWithThrottle: (event: MouseEvent | KeyboardEvent) => void =\n event => {\n this.__dispatchClick(event);\n };\n\n __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n // If the button is soft-disabled or a disabled link, we need to explicitly\n // prevent the click from propagating to other event listeners as well as\n // prevent the default action.\n if (this.softDisabled || (this.disabled && this.href) || this.skeleton) {\n event.stopImmediatePropagation();\n event.preventDefault();\n return;\n }\n\n if (!isActivationClick(event) || !this.buttonElement) {\n return;\n }\n\n this.focus();\n dispatchActivationClick(this.buttonElement);\n };\n\n __convertTypeToVariantAndColor() {\n if (this.type === 'primary') {\n this.color = 'primary';\n this.variant = 'filled';\n } else if (this.type === 'secondary') {\n this.color = 'dark';\n this.variant = 'outlined';\n } else if (this.type === 'tertiary') {\n this.color = 'primary';\n this.variant = 'text';\n } else if (this.type === 'danger') {\n this.color = 'danger';\n this.variant = 'filled';\n }\n }\n\n __getDisabledReasonID() {\n return this.disabled && this.disabledReason\n ? `disabled-reason-${this.#id}`\n : nothing;\n }\n\n __renderDisabledReason() {\n const disabledReasonID = this.__getDisabledReasonID();\n if (disabledReasonID)\n return html`<div\n id=\"disabled-reason-${this.#id}\"\n role=\"tooltip\"\n aria-label=${this.disabledReason}\n class=\"screen-reader-only\"\n >\n {this.disabledReason}\n </div>`;\n return nothing;\n }\n\n __renderTooltip() {\n if (this.tooltip) {\n return html`<base-tooltip for=\"button\">${this.tooltip}</base-tooltip>`;\n }\n return nothing;\n }\n}\n","import { html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport PeacockComponent from 'src/PeacockComponent.js';\nimport styles from './button.scss';\nimport colorStyles from './button-colors.scss';\nimport sizeStyles from './button-sizes.scss';\nimport { observerSlotChangesWithCallback, throttle } from '../../utils.js';\nimport { spread } from '../../spread.js';\nimport { BaseButton } from '../BaseButton.js';\n\n/**\n * @label Button\n * @tag base-button\n * @rawTag button\n *\n * @summary Buttons help people initiate actions, from sending an email, to sharing a document, to liking a post.\n * @overview\n * <p>Buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways. Button labels express what action will occur when the user interacts with it.</p>\n *\n * @cssprop --button-container-shape: Defines the border radius of the button container shape.\n *\n * @cssprop --button-container-shape-start-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-start-end: Defines the end position of the button container shape.\n * @cssprop --button-container-shape-end-start: Defines the start position of the button container shape.\n * @cssprop --button-container-shape-end-end: Defines the end position of the button container shape.\n *\n *\n * @cssprop --filled-button-container-color: Color of the filled button container.\n * @cssprop --filled-button-label-text-color: Text color of the filled button label.\n *\n * @cssprop --outlined-button-container-color: Color of the outlined button container.\n * @cssprop --outlined-button-label-text-color: Text color of the outlined button label.\n *\n * @cssprop --text-button-label-text-color: Text color of the text button label.\n *\n * @cssprop --tonal-button-container-color: Color of the tonal button container.\n * @cssprop --tonal-button-label-text-color: Text color of the tonal button label.\n *\n * @cssprop --elevated-button-container-color: Color of the elevated button container.\n * @cssprop --elevated-button-label-text-color: Text color of the elevated button label.\n *\n * @cssprop --neo-button-container-color: Color of the neo button container.\n * @cssprop --neo-button-label-text-color: Text color of the neo button label.\n *\n * @fires {MouseEvent} click - Dispatched when the button is clicked.\n *\n * @example\n * ```html\n * <base-button>Button</base-button>\n * ```\n * @tags display\n */\n@PeacockComponent\nexport class Button extends BaseButton {\n static override styles = [styles, colorStyles, sizeStyles];\n\n #tabindex?: number = 0;\n\n /**\n * Icon alignment.\n * Possible values are `\"start\"`, `\"end\"`. Defaults to `\"end\"`.\n */\n @property({ attribute: 'icon-align' })\n iconAlign: 'start' | 'end' = 'end';\n\n @state()\n private slotHasContent = false;\n\n override firstUpdated() {\n this.__dispatchClickWithThrottle = throttle(\n this.__dispatchClick,\n this.throttleDelay,\n );\n observerSlotChangesWithCallback(\n this.renderRoot.querySelector('slot'),\n hasContent => {\n this.slotHasContent = hasContent;\n this.requestUpdate();\n },\n );\n\n this.__convertTypeToVariantAndColor();\n }\n\n override render() {\n const isLink = this.__isLink();\n\n const cssClasses = {\n button: true,\n 'button-element': true,\n [`size-${this.size}`]: true,\n [`variant-${this.variant}`]: true,\n [`color-${this.color}`]: true,\n disabled: this.disabled || this.softDisabled,\n pressed: this.isPressed,\n 'has-content': this.slotHasContent,\n 'show-skeleton': this.skeleton,\n [`icon-align-${this.iconAlign}`]: true,\n };\n\n if (!isLink) {\n return html`<button\n class=${classMap(cssClasses)}\n id=\"button\"\n tabindex=${this.#tabindex}\n type=${this.htmlType}\n @mousedown=${this.__handlePress}\n @keydown=${this.__handlePress}\n @keyup=${this.__handlePress}\n ?aria-describedby=${this.__getDisabledReasonID()}\n aria-disabled=${`${this.disabled || this.softDisabled}`}\n ?disabled=${this.disabled}\n ${spread(this.configAria)}\n >\n ${this.renderButtonContent()}\n </button>\n ${this.__renderTooltip()}`;\n }\n return html`<a\n class=${classMap(cssClasses)}\n id=\"button\"\n tabindex=${this.#tabindex}\n href=${this.href}\n target=${this.target}\n @mousedown=${this.__handlePress}\n @keydown=${this.__handlePress}\n @keyup=${this.__handlePress}\n role=\"button\"\n ?aria-describedby=${this.__getDisabledReasonID()}\n aria-disabled=${`${this.disabled}`}\n ${spread(this.configAria)}\n >\n ${this.renderButtonContent()}\n </a>\n ${this.__renderTooltip()}`;\n }\n\n renderButtonContent() {\n return html`\n <focus-ring class=\"focus-ring\" .control=${this} element=\"buttonElement\"></focus-ring>\n <base-elevation class=\"elevation\"></base-elevation>\n <div class=\"neo-background\"></div>\n <div class=\"background\"></div>\n <div class=\"outline\"></div>\n <base-ripple class=\"ripple\"></base-ripple>\n <base-skeleton class=\"skeleton\"></base-skeleton>\n\n <div class=\"button-content\">\n <div class=\"slot-container\">\n <slot></slot>\n </div>\n\n <slot name=\"icon\"></slot>\n </div>\n\n ${this.__renderDisabledReason()}\n `;\n }\n}\n"],"names":["Directive","PartType","directive","LitElement","nothing","html","property","state","query","classMap","styles","colorStyles","sizeStyles"],"mappings":"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"}
|
package/dist/button.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import './PeacockComponent-CxJc63xj.js';
|
|
2
2
|
import './state-B09bP3XH.js';
|
|
3
3
|
import './class-map-BvQRv7eW.js';
|
|
4
|
-
export { B as Button } from './button-
|
|
4
|
+
export { B as Button } from './button-DaL4va7Q.js';
|
|
5
5
|
import './dispatch-event-utils-vbdiOSeC.js';
|
|
6
6
|
import './directive-Cuw6h7YA.js';
|
|
7
7
|
//# sourceMappingURL=button.js.map
|
|
@@ -4,7 +4,7 @@ import { e as e$1 } from './directive-Cuw6h7YA.js';
|
|
|
4
4
|
import { e as e$2 } from './unsafe-html-B-dV3Jps.js';
|
|
5
5
|
import { b as e, c as createCacheFetch, s as sanitizeSvg, o as observerSlotChangesWithCallback, t as throttle, e as e$4, r as redispatchEvent, a as isDarkMode } from './dispatch-event-utils-vbdiOSeC.js';
|
|
6
6
|
import { e as e$3 } from './class-map-BvQRv7eW.js';
|
|
7
|
-
import { c as css_248z$x, a as css_248z$y, b as BaseButton, s as spread } from './button-
|
|
7
|
+
import { c as css_248z$x, a as css_248z$y, b as BaseButton, s as spread } from './button-DaL4va7Q.js';
|
|
8
8
|
import { o as o$3 } from './style-map-B8xgVEc9.js';
|
|
9
9
|
import { B as BaseInput, o as observeThemeChange } from './observe-theme-change-NneLARW8.js';
|
|
10
10
|
|
|
@@ -6858,16 +6858,22 @@ __decorate([
|
|
|
6858
6858
|
|
|
6859
6859
|
var css_248z = i`@charset "UTF-8";
|
|
6860
6860
|
:host {
|
|
6861
|
-
display:
|
|
6861
|
+
display: block;
|
|
6862
|
+
height: 100%;
|
|
6863
|
+
width: 100%;
|
|
6862
6864
|
}
|
|
6863
6865
|
|
|
6864
6866
|
.image-wrapper {
|
|
6865
|
-
|
|
6866
|
-
|
|
6867
|
+
display: flex;
|
|
6868
|
+
align-items: center;
|
|
6869
|
+
justify-content: center;
|
|
6870
|
+
height: 100%;
|
|
6871
|
+
width: 100%;
|
|
6867
6872
|
}
|
|
6868
6873
|
|
|
6869
6874
|
img {
|
|
6870
6875
|
display: block;
|
|
6876
|
+
max-height: 100%;
|
|
6871
6877
|
max-width: 100%;
|
|
6872
6878
|
}
|
|
6873
6879
|
|
|
@@ -6883,7 +6889,7 @@ img.clickable {
|
|
|
6883
6889
|
}
|
|
6884
6890
|
|
|
6885
6891
|
/* Preview overlay — rendered in light DOM via portal, but we keep
|
|
6886
|
-
|
|
6892
|
+
a host-level overlay as a fallback when shadow DOM is used. */
|
|
6887
6893
|
.preview-overlay {
|
|
6888
6894
|
display: none;
|
|
6889
6895
|
position: fixed;
|
|
@@ -7039,4 +7045,4 @@ __decorate([
|
|
|
7039
7045
|
], Image.prototype, "_previewOpen", void 0);
|
|
7040
7046
|
|
|
7041
7047
|
export { Accordion as A, Badge as B, Chip as C, DatePicker as D, Elevation as E, Field as F, Icon as I, LinearProgress as L, NumberField as N, Ripple as R, Skeleton as S, Tag as T, Avatar as a, Breadcrumb as b, BreadcrumbItem as c, CircularProgress as d, Container as e, Divider as f, EmptyState as g, FocusRing as h, IconButton as i, Image as j, Input as k, Link as l, Spinner as m, Switch as n, Textarea as o, TimePicker as p, Tooltip as q };
|
|
7042
|
-
//# sourceMappingURL=image-
|
|
7048
|
+
//# sourceMappingURL=image-v3BujlY5.js.map
|