npm - @usecapsule/core-components - Versions diffs - 3.0.1 → 3.1.0 - Mend

@usecapsule/core-components 3.0.1 → 3.1.0

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.

Files changed (234) hide show

package/css/capsule-core.css CHANGED Viewed

@@ -59,6 +59,10 @@ html {
   --cpsl-font-family: var(--cpsl-default-font);
 }
+div {
+  box-sizing: border-box;
+}
 body.backdrop-no-scroll {
   overflow: hidden;
 }
@@ -97,8 +101,11 @@ body.backdrop-no-scroll {
   --cpsl-color-foreground-80: rgb(209, 209, 209);
   --cpsl-color-foreground-96: rgb(246, 246, 246);
   --cpsl-color-utility-red: rgb(240, 68, 56);
+  --cpsl-color-utility-red-light: rgb(251, 203, 199);
   --cpsl-color-utility-yellow: rgb(251, 188, 4);
+  --cpsl-color-utility-yellow-light: rgb(254, 236, 185);
   --cpsl-color-utility-green: rgb(52, 168, 83);
+  --cpsl-color-utility-green-light: rgb(198, 231, 207);
   --cpsl-color-text-primary: var(--cpsl-color-foreground-0);
   --cpsl-color-text-secondary: var(--cpsl-color-background-64);
   --cpsl-color-text-tertiary: var(--cpsl-color-foreground-32);
@@ -107,36 +114,57 @@ body.backdrop-no-scroll {
   --cpsl-color-text-disabled: var(--cpsl-color-foreground-48);
   --cpsl-color-text-error: var(--cpsl-color-utility-red);
   --cpsl-color-modal-surface-main: var(--cpsl-color-background-0);
-  --cpsl-color-modal-surface-footer: var(--cpsl-color-background-8);
+  --cpsl-color-modal-surface-footer: var(--cpsl-color-foreground-96);
   --cpsl-color-modal-border: var(--cpsl-color-background-8);
   --cpsl-color-input-surface-disabled: var(--cpsl-color-background-8);
   --cpsl-color-input-surface-default: var(--cpsl-color-background-4);
+  --cpsl-color-input-surface-hover: var(--cpsl-color-background-16);
   --cpsl-color-input-border-placeholder: var(--cpsl-color-background-4);
   --cpsl-color-input-border-active: var(--cpsl-color-foreground-0);
   --cpsl-color-input-border-error: var(--cpsl-color-utility-red);
-  --cpsl-color-tile-button-surface-default: var(--cpsl-color-background-0);
-  --cpsl-color-tile-button-surface-hover: var(--cpsl-color-background-8);
-  --cpsl-color-tile-button-surface-pressed: var(--cpsl-color-background-48);
-  --cpsl-color-tile-button-border: var(--cpsl-color-background-8);
+  --cpsl-color-select-surface-disabled: var(--cpsl-color-background-8);
+  --cpsl-color-select-surface-default: var(--cpsl-color-background-4);
+  --cpsl-color-select-surface-hover: var(--cpsl-color-background-0);
+  --cpsl-color-select-border-placeholder: var(--cpsl-color-background-4);
+  --cpsl-color-select-border-active: var(--cpsl-color-foreground-0);
+  --cpsl-color-select-border-error: var(--cpsl-color-utility-red);
+  --cpsl-color-select-dropdown-border: var(--cpsl-color-background-16);
+  --cpsl-color-file-surface-disabled: var(--cpsl-color-background-8);
+  --cpsl-color-file-surface-default: var(--cpsl-color-background-4);
+  --cpsl-color-file-surface-drag: var(--cpsl-color-background-16);
+  --cpsl-color-file-border-placeholder: var(--cpsl-color-background-4);
+  --cpsl-color-file-border-error: var(--cpsl-color-utility-red);
+  --cpsl-color-tile-button-surface-default: var(--cpsl-color-background-4);
+  --cpsl-color-tile-button-surface-hover: var(--cpsl-color-background-16);
+  --cpsl-color-tile-button-surface-pressed: var(--cpsl-color-background-16);
+  --cpsl-color-tile-button-border: var(--cpsl-color-background-4);
   --cpsl-color-primary-button-text: var(--cpsl-color-text-inverted);
   --cpsl-color-primary-button-surface-default: var(--cpsl-color-foreground-0);
   --cpsl-color-primary-button-surface-hover: var(--cpsl-color-foreground-16);
-  --cpsl-color-primary-button-surface-pressed: var(--cpsl-color-foreground-32);
-  --cpsl-color-primary-button-surface-disabled: var(--cpsl-color-background-32);
+  --cpsl-color-primary-button-surface-pressed: var(--cpsl-color-foreground-16);
+  --cpsl-color-primary-button-surface-disabled: var(--cpsl-color-background-16);
   --cpsl-color-primary-button-border-default: var(--cpsl-color-foreground-0);
-  --cpsl-color-primary-button-border-disabled: var(--cpsl-color-background-32);
+  --cpsl-color-primary-button-border-disabled: var(--cpsl-color-background-16);
   --cpsl-color-primary-button-outline: var(--cpsl-color-foreground-32);
   --cpsl-color-secondary-button-text: var(--cpsl-color-text-primary);
-  --cpsl-color-secondary-button-surface-default: var(--cpsl-color-background-0);
+  --cpsl-color-secondary-button-surface-default: transparent;
   --cpsl-color-secondary-button-surface-hover: var(--cpsl-color-background-16);
-  --cpsl-color-secondary-button-surface-pressed: var(--cpsl-color-background-32);
-  --cpsl-color-secondary-button-surface-disabled: var(--cpsl-color-foreground-32);
+  --cpsl-color-secondary-button-surface-pressed: var(--cpsl-color-background-16);
+  --cpsl-color-secondary-button-surface-disabled: var(--cpsl-color-foreground-96);
   --cpsl-color-secondary-button-border-default: var(--cpsl-color-background-32);
-  --cpsl-color-secondary-button-border-disabled: var(--cpsl-color-foreground-32);
+  --cpsl-color-secondary-button-border-disabled: var(--cpsl-color-foreground-96);
   --cpsl-color-secondary-button-outline: var(--cpsl-color-background-32);
-  --cpsl-color-icon-button-default: var(--cpsl-color-text-secondary);
-  --cpsl-color-icon-button-disabled: var(--cpsl-color-text-secondary);
-  --cpsl-color-icon-button-hover: var(--cpsl-color-text-primary);
+  --cpsl-color-destructive-button-text: var(--cpsl-color-text-error);
+  --cpsl-color-destructive-button-surface-default: transparent;
+  --cpsl-color-destructive-button-surface-hover: var(--cpsl-color-utility-red-light);
+  --cpsl-color-destructive-button-surface-pressed: var(--cpsl-color-utility-red-light);
+  --cpsl-color-destructive-button-surface-disabled: var(--cpsl-color-foreground-96);
+  --cpsl-color-destructive-button-border-default: var(--cpsl-color-utility-red);
+  --cpsl-color-destructive-button-border-disabled: var(--cpsl-color-foreground-96);
+  --cpsl-color-destructive-button-outline: var(--cpsl-color-background-32);
+  --cpsl-color-ghost-button-default: var(--cpsl-color-text-secondary);
+  --cpsl-color-ghost-button-disabled: var(--cpsl-color-text-secondary);
+  --cpsl-color-ghost-button-hover: var(--cpsl-color-text-primary);
   --cpsl-color-divider: var(--cpsl-color-background-32);
   --cpsl-color-spinner-path: var(--cpsl-color-background-32);
   --cpsl-color-spinner-circle: var(--cpsl-color-foreground-0);
@@ -180,22 +208,26 @@ body.backdrop-no-scroll {
   --cpsl-color-avatar-border: var(--cpsl-color-foreground-96);
   --cpsl-color-card-surface: var(--cpsl-color-background-0);
   --cpsl-color-card-border: var(--cpsl-color-background-16);
-  --cpsl-border-radius-input: 16px;
+  --cpsl-border-radius-input: 12px;
+  --cpsl-border-radius-select: 12px;
+  --cpsl-border-radius-file: 12px;
   --cpsl-border-radius-alert: 12px;
-  --cpsl-border-radius-tabs: 8px;
+  --cpsl-border-radius-tabs: 12px;
   --cpsl-border-radius-primary-button: 12px;
   --cpsl-border-radius-secondary-button: 12px;
-  --cpsl-border-radius-tile-button: 8px;
-  --cpsl-border-radius-modal: 20px;
+  --cpsl-border-radius-destructive-button: 12px;
+  --cpsl-border-radius-tile-button: 12px;
+  --cpsl-border-radius-modal: 24px;
   --cpsl-border-radius-pill: 1000px;
-  --cpsl-border-radius-qr-code: 24px;
-  --cpsl-border-radius-info-box: 8px;
-  --cpsl-border-radius-table-container: 20px;
+  --cpsl-border-radius-qr-code: 12px;
+  --cpsl-border-radius-info-box: 12px;
+  --cpsl-border-radius-table-container: 24px;
   --cpsl-border-radius-switch: 1000px;
   --cpsl-border-radius-checkbox: 4px;
   --cpsl-border-radius-radio: 1000px;
-  --cpsl-border-radius-avatar: 8px;
-  --cpsl-border-radius-card: 16px;
+  --cpsl-border-radius-avatar: 12px;
+  --cpsl-border-radius-card: 24px;
+  --cpsl-border-radius-button-group: 12px;
   --cpsl-font-size-body-2xs: clamp(8px, 0.625rem, 15px);
   --cpsl-font-size-body-xs: clamp(9.6px, 0.75rem, 18px);
   --cpsl-font-size-body-s: clamp(11.2px, 0.875rem, 21px);
@@ -236,5 +268,42 @@ body.backdrop-no-scroll {
     -webkit-transform: rotate(360deg);
   }
 }
+.cpsl-table {
+  width: 100%;
+  border-spacing: 0;
+  border-collapse: separate;
+  font-family: var(--cpsl-font-family, inherit);
+}
+.cpsl-table th {
+  -webkit-padding-start: var(--table-header-padding-start);
+  padding-inline-start: var(--table-header-padding-start);
+  -webkit-padding-end: var(--table-header-padding-end);
+  padding-inline-end: var(--table-header-padding-end);
+  padding-top: var(--table-header-padding-top);
+  padding-bottom: var(--table-header-padding-bottom);
+  background: var(--table-header-background-color);
+  color: var(--cpsl-color-text-primary);
+  font-weight: 500;
+  font-size: var(--cpsl-font-size-body-xs);
+  border-bottom: var(--table-header-border-width) solid var(--table-header-border-color);
+}
+.cpsl-table td {
+  -webkit-padding-start: var(--table-content-padding-start);
+  padding-inline-start: var(--table-content-padding-start);
+  -webkit-padding-end: var(--table-content-padding-end);
+  padding-inline-end: var(--table-content-padding-end);
+  padding-top: var(--table-content-padding-top);
+  padding-bottom: var(--table-content-padding-bottom);
+  color: var(--cpsl-color-text-primary);
+  font-size: var(--cpsl-font-size-body-s);
+  border-bottom: var(--table-content-border-width) solid var(--table-content-border-color);
+}
+.cpsl-table tr:last-child td {
+  border-bottom: none;
+}
+.cpsl-table.sticky-header thead {
+  position: sticky;
+  top: 0;
+}
 /*# sourceMappingURL=capsule-core.css.map */

package/css/capsule-core.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sourceRoot":"","sources":["../src/themes/capsule.functions.font.scss","../src/themes/capsule.mixins.scss","../src/css/capsule-core.scss"],"names":[],"mappings":"AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AC/CA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACZA;EACE;EACA;EACA;;;AAGF;EACE;;;AAiCF;EAvBE;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;AAeF;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAGJ;EACE;IACE;;;AAGJ;EACE;IACE;;EAEF;IACE;;EAEF;IACE","file":"capsule-core.css","sourcesContent":["@use 'sass:math';\n\n$baselineSize: 16px !default;\n$baselineUnit: 1rem !default;\n\n/*\n Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font($size, $unit: $baselineUnit) {\n @return (math.div($size, $baselineSize)) $unit;\n}\n\n/*\n Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font-max($size, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $maxScale: $size $maxScale;\n\n @return min($baseScale, $maxScale);\n}\n\n/*\n Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font-min($minScale, $size, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $minScale: $size $minScale;\n\n @return max($minScale, $baseScale);\n}\n\n/*\n Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font-clamp($minScale, $baseSize, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($baseSize, $unit);\n $maxScale: $baseSize $maxScale;\n $minScale: $baseSize * $minScale;\n\n @return clamp($minScale, $baseScale, $maxScale);\n}\n","/*\n A heuristic that applies CSS to tablet\n * viewports.\n \n Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n /\n@mixin tablet-viewport() {\n @media screen and (min-width: 768px) {\n @content;\n }\n}\n\n/\n A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n \n Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n /\n@mixin mobile-viewport() {\n @media screen and (max-width: 767px) {\n @content;\n }\n}\n\n@mixin input-cover() {\n @include position(0, null, null, 0);\n @include margin(0);\n\n position: absolute;\n\n width: 100%;\n height: 100%;\n\n border: 0;\n background: transparent;\n cursor: pointer;\n\n appearance: none;\n outline: none;\n\n &::-moz-focus-inner {\n border: 0;\n }\n}\n\n@mixin visually-hidden() {\n position: absolute;\n\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n width: 100%;\n height: 100%;\n\n margin: 0;\n padding: 0;\n\n border: 0;\n outline: 0;\n clip: rect(0 0 0 0);\n\n opacity: 0;\n overflow: hidden;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n@mixin text-inherit() {\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n letter-spacing: inherit;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n text-align: inherit;\n white-space: inherit;\n color: inherit;\n}\n\n@mixin button-state() {\n @include position(0, 0, 0, 0);\n\n position: absolute;\n\n content: '';\n\n opacity: 0;\n}\n\n// Get the key from a map based on the index\n@function index-to-key($map, $index) {\n $keys: map-keys($map);\n\n @return nth($keys, $index);\n}\n\n// Breakpoint Mixins\n// ---------------------------------------------------------------------------------\n\n// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$screen-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// ---------------------------------------------------------------------------------\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $screen-breakpoints) {\n $min: map-get($breakpoints, $name);\n\n @return if($name != index-to-key($breakpoints, 1), $min, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $screen-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, '', '-#{$name}');\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $screen-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next($name, $breakpoints: $screen-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Maximum breakpoint width. Null for the smallest (first) breakpoint.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n//\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\t// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\t// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $screen-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - 0.02, null);\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $screen-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Text Direction - ltr / rtl\n//\n// CSS defaults to use the ltr css, and adds [dir=rtl] selectors\n// to override ltr defaults.\n// ----------------------------------------------------------\n\n@mixin multi-dir() {\n @content;\n\n // $root: #{&};\n // @at-root [dir] {\n // #{$root} {\n // @content;\n // }\n // }\n}\n\n@mixin rtl() {\n $root: #{&};\n\n $rootSplit: str-split($root, ',');\n $selectors: #{add-root-selector($root, '[dir=rtl]')};\n $selectorsSplit: str-split($selectors, ',');\n\n $hostContextSelectors: ();\n $restSelectors: ();\n $dirSelectors: ();\n\n // Selectors must be split into individual selectors in case the browser\n // doesn't support a specific selector.\n // For example, Firefox and Safari doesn't support `:host-context()`.\n // If an invalid selector is used, then the entire group of selectors\n // will be ignored.\n // @link https://www.w3.org/TR/selectors-3/#grouping\n @each $selector in $selectorsSplit {\n // Group the selectors back into a single selector to optimize the output.\n @if str-index($selector, ':host-context') {\n $hostContextSelectors: append($hostContextSelectors, $selector, comma);\n } @else {\n // Group the selectors back into a single selector to optimize the output.\n $restSelectors: append($restSelectors, $selector, comma);\n }\n }\n\n // Supported by Chrome.\n @if length($hostContextSelectors) > 0 {\n @at-root #{$hostContextSelectors} {\n @content;\n }\n }\n\n // Supported by all browsers.\n @if length($restSelectors) > 0 {\n @at-root #{$restSelectors} {\n @content;\n }\n }\n\n // If browser can support `:dir()`, then add the `:dir()` selectors.\n @supports selector(:dir(rtl)) {\n // Adding :dir() in case the browser doesn't support `:host-context()` and does support `:dir()`.\n // `:host-context()` is added:\n // - through the `add-root-selector()` function.\n // - first so that it takes precedence over `:dir()`.\n // For example,\n // - Firefox doesn't support `:host-context()`, but does support `:dir()`.\n // - Safari doesn't support `:host-context()`, but Safari 16.4+ supports `:dir()`\n // @link https://webkit.org/blog/13966/webkit-features-in-safari-16-4/\n // -- However, there is a Webkit bug on v16 that prevents `:dir()` from working when\n // -- the app direction is changed dynamically. v17+ works fine.\n // -- @link https://bugs.webkit.org/show_bug.cgi?id=257133\n\n // Supported by Firefox.\n @at-root #{add-root-selector($root, \":dir(rtl)\", false)} {\n @content;\n }\n }\n}\n\n@mixin ltr() {\n @content;\n}\n\n// SVG Background Image Mixin\n// @param {string} $svg\n// ----------------------------------------------------------\n@mixin svg-background-image($svg, $flip-rtl: false) {\n $url: url-encode($svg);\n $viewBox: str-split(str-extract($svg, \"viewBox='\", \"'\"), ' ');\n\n @if $flip-rtl != true or $viewBox == null {\n @include multi-dir() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n } @else {\n $transform: \"transform='translate(#{nth($viewBox, 3)}, 0) scale(-1, 1)'\";\n $flipped-url: $svg;\n $flipped-url: str-replace($flipped-url, '<path', '<path #{$transform}');\n $flipped-url: str-replace($flipped-url, '<line', '<line #{$transform}');\n $flipped-url: str-replace($flipped-url, '<polygon', '<polygon #{$transform}');\n $flipped-url: url-encode($flipped-url);\n\n @include ltr() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n @include rtl() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$flipped-url}');\n }\n }\n}\n\n// Add property horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin property-horizontal($prop, $start, $end: $start) {\n @if $start == 0 and $end == 0 {\n #{$prop}-left: $start;\n #{$prop}-right: $end;\n } @else {\n -webkit-#{$prop}-start: $start;\n #{$prop}-inline-start: $start;\n -webkit-#{$prop}-end: $end;\n #{$prop}-inline-end: $end;\n }\n}\n\n// Add property for all directions\n// @param {string} $prop\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// @param {boolean} $content include content or use default\n// ----------------------------------------------------------\n@mixin property($prop, $top, $end: $top, $bottom: $top, $start: $end) {\n @include property-horizontal($prop, $start, $end);\n #{$prop}-top: $top;\n #{$prop}-bottom: $bottom;\n}\n\n// Add padding horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin padding-horizontal($start, $end: $start) {\n @include property-horizontal(padding, $start, $end);\n}\n\n// Add padding for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin padding($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(padding, $top, $end, $bottom, $start);\n}\n\n// Add margin horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin margin-horizontal($start, $end: $start) {\n @include property-horizontal(margin, $start, $end);\n}\n\n// Add margin for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin margin($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(margin, $top, $end, $bottom, $start);\n}\n\n// Add position horizontal\n// @param {string} $start - amount to position start\n// @param {string} $end - amount to left: 0; end\n// ----------------------------------------------------------\n@mixin position-horizontal($start: null, $end: null) {\n @if $start == $end {\n @include multi-dir() {\n left: $start;\n right: $end;\n }\n } @else {\n @at-root {\n @supports (inset-inline-start: 0) {\n & {\n inset-inline-start: $start;\n inset-inline-end: $end;\n }\n }\n }\n\n // TODO FW-3766\n @at-root {\n @supports not (inset-inline-start: 0) {\n & {\n @include ltr() {\n left: $start;\n right: $end;\n }\n @include rtl() {\n left: unset;\n right: unset;\n\n left: $end;\n right: $start;\n }\n }\n }\n }\n }\n}\n\n// Add position for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin position($top: null, $end: null, $bottom: null, $start: null) {\n @include position-horizontal($start, $end);\n top: $top;\n bottom: $bottom;\n}\n\n// Add border for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin border($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(border, $top, $end, $bottom, $start);\n}\n\n// Add border radius for all directions\n// @param {string} $top-start\n// @param {string} $top-end\n// @param {string} $bottom-end\n// @param {string} $bottom-start\n// ----------------------------------------------------------\n@mixin border-radius($top-start, $top-end: $top-start, $bottom-end: $top-start, $bottom-start: $top-end) {\n @if $top-start == $top-end and $top-start == $bottom-end and $top-start == $bottom-start {\n @include multi-dir() {\n border-radius: $top-start;\n }\n } @else {\n @include ltr() {\n border-top-left-radius: $top-start;\n border-top-right-radius: $top-end;\n border-bottom-right-radius: $bottom-end;\n border-bottom-left-radius: $bottom-start;\n }\n\n @include rtl() {\n border-top-left-radius: $top-end;\n border-top-right-radius: $top-start;\n border-bottom-right-radius: $bottom-start;\n border-bottom-left-radius: $bottom-end;\n }\n }\n}\n\n// Add direction for all directions\n// @param {string} $dir - Direction on LTR\n@mixin direction($dir) {\n $other-dir: null;\n\n @if $dir == ltr {\n $other-dir: rtl;\n } @else {\n $other-dir: ltr;\n }\n\n @include ltr() {\n direction: $dir;\n }\n @include rtl() {\n direction: $other-dir;\n }\n}\n\n// Add float for all directions\n// @param {string} $side\n// @param {string} $decorator - !important\n@mixin float($side, $decorator: null) {\n @if $side == start {\n @include ltr() {\n float: left $decorator;\n }\n @include rtl() {\n float: right $decorator;\n }\n } @else if $side == end {\n @include ltr() {\n float: right $decorator;\n }\n @include rtl() {\n float: left $decorator;\n }\n } @else {\n @include multi-dir() {\n float: $side $decorator;\n }\n }\n}\n\n@mixin background-position($horizontal, $horizontal-amount: null, $vertical: null, $vertical-amount: null) {\n @if $horizontal == start or $horizontal == end {\n $horizontal-ltr: null;\n $horizontal-rtl: null;\n @if $horizontal == start {\n $horizontal-ltr: left;\n $horizontal-rtl: right;\n } @else {\n $horizontal-ltr: right;\n $horizontal-rtl: left;\n }\n\n @include ltr() {\n background-position: $horizontal-ltr $horizontal-amount $vertical $vertical-amount;\n }\n @include rtl() {\n background-position: $horizontal-rtl $horizontal-amount $vertical $vertical-amount;\n }\n } @else {\n @include multi-dir() {\n background-position: $horizontal $horizontal-amount $vertical $vertical-amount;\n }\n }\n}\n\n@mixin transform-origin($x-axis, $y-axis: null) {\n @if $x-axis == start {\n @include ltr() {\n transform-origin: left $y-axis;\n }\n @include rtl() {\n transform-origin: right $y-axis;\n }\n } @else if $x-axis == end {\n @include ltr() {\n transform-origin: right $y-axis;\n }\n @include rtl() {\n transform-origin: left $y-axis;\n }\n } @else if $x-axis == left or $x-axis == right {\n @include multi-dir() {\n transform-origin: $x-axis $y-axis;\n }\n } @else {\n @include ltr() {\n transform-origin: $x-axis $y-axis;\n }\n @include rtl() {\n transform-origin: calc(100% - #{$x-axis}) $y-axis;\n }\n }\n}\n\n// Add transform for all directions\n// @param {string} $transforms - comma separated list of transforms\n@mixin transform($transforms...) {\n $extra: null;\n\n $x: null;\n $ltr-translate: null;\n $rtl-translate: null;\n\n @each $transform in $transforms {\n @if (str-index($transform, translate3d)) {\n $transform: str-replace($transform, 'translate3d(');\n $transform: str-replace($transform, ')');\n\n $coordinates: str-split($transform, ',');\n\n $x: nth($coordinates, 1);\n $y: nth($coordinates, 2);\n $z: nth($coordinates, 3);\n\n $ltr-translate: translate3d($x, $y, $z);\n $rtl-translate: translate3d(calc(-1 #{$x}), $y, $z);\n } @else {\n @if $extra == null {\n $extra: $transform;\n } @else {\n $extra: $extra $transform;\n }\n }\n }\n\n @if $x == '0' or $x == null {\n @include multi-dir() {\n transform: $ltr-translate $extra;\n }\n } @else {\n @include ltr() {\n transform: $ltr-translate $extra;\n }\n\n @include rtl() {\n transform: $rtl-translate $extra;\n }\n }\n}\n","@import '../themes/capsule.globals.scss';\n\n// Capsule Font Family\n// --------------------------------------------------\n\nhtml {\n --cpsl-default-font: 'Helvetica', sans-serif;\n --cpsl-default-dynamic-font: -apple-system-body;\n --cpsl-font-family: var(--cpsl-default-font);\n}\n\nbody.backdrop-no-scroll {\n overflow: hidden;\n}\n\n// Capsule Colors\n// --------------------------------------------------\n// Generates the default color vars\n\n@mixin generate-color($color-name) {\n $value: map-get($colors, $color-name);\n\n --cpsl-color-#{$color-name}: #{$value};\n}\n\n// Capsule Border Radii\n// --------------------------------------------------\n// Generates the default border vars\n\n@mixin generate-border-radius($border-radius-name) {\n $value: map-get($borderRadii, $border-radius-name);\n\n --cpsl-border-radius-#{$border-radius-name}: #{$value};\n}\n\n// Capsule Font Sizes\n// --------------------------------------------------\n// Generates the default font sizes\n\n@mixin generate-font-size($font-size-name) {\n $value: map-get($fontSizes, $font-size-name);\n\n --cpsl-font-size-#{$font-size-name}: #{dynamic-font-clamp(0.8, $value, 1.5)};\n}\n\n:root {\n @each $color-name, $value in $colors {\n @include generate-color($color-name);\n }\n @each $border-radius-name, $value in $borderRadii {\n @include generate-border-radius($border-radius-name);\n }\n @each $font-size-name, $value in $fontSizes {\n @include generate-font-size($font-size-name);\n }\n}\n\n@keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n -webkit-transform: rotate(360deg);\n }\n}\n@-moz-keyframes spin {\n 100% {\n -moz-transform: rotate(360deg);\n }\n}\n@-webkit-keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n }\n 50% {\n -webkit-transform: rotate(180deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n }\n}\n"]}
1	+ {"version":3,"sourceRoot":"","sources":["../src/themes/capsule.functions.font.scss","../src/themes/capsule.mixins.scss","../src/css/capsule-core.scss","../src/themes/capsule.globals.scss"],"names":[],"mappings":"AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AC/CA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACZA;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAiCF;EAvBE;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAUA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;AAeF;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAGJ;EACE;IACE;;;AAGJ;EACE;IACE;;EAEF;IACE;;EAEF;IACE;;;AAIJ;EACE;EAEA;EACA;EACA,aC5EiB;;AD8EjB;EDiOE,uBChOuH;EDiOvH,sBCjOuH;EDkOvH,qBClOkD;EDmOlD,oBCnOkD;EDiPpD,aCjPmB;EDkPnB,gBClPqF;EAEnF;EACA;EACA;EACA;EACA;;AAGF;EDuNE,uBCtN0H;EDuN1H,sBCvN0H;EDwN1H,qBCxNmD;EDyNnD,oBCzNmD;EDuOrD,aCvOmB;EDwOnB,gBCxOuF;EACrF;EACA;EACA;;AAGF;EACE;;AAIA;EACE;EACA","file":"capsule-core.css","sourcesContent":["@use 'sass:math';\n\n$baselineSize: 16px !default;\n$baselineUnit: 1rem !default;\n\n/*\n Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font($size, $unit: $baselineUnit) {\n @return (math.div($size, $baselineSize)) $unit;\n}\n\n/*\n Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font-max($size, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $maxScale: $size $maxScale;\n\n @return min($baseScale, $maxScale);\n}\n\n/*\n Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font-min($minScale, $size, $unit: $baselineUnit) {\n $baseScale: dynamic-font($size, $unit);\n $minScale: $size $minScale;\n\n @return max($minScale, $baseScale);\n}\n\n/*\n Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n /\n@function dynamic-font-clamp($minScale, $baseSize, $maxScale, $unit: $baselineUnit) {\n $baseScale: dynamic-font($baseSize, $unit);\n $maxScale: $baseSize $maxScale;\n $minScale: $baseSize * $minScale;\n\n @return clamp($minScale, $baseScale, $maxScale);\n}\n","/*\n A heuristic that applies CSS to tablet\n * viewports.\n \n Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n /\n@mixin tablet-viewport() {\n @media screen and (min-width: 768px) {\n @content;\n }\n}\n\n/\n A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n \n Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n /\n@mixin mobile-viewport() {\n @media screen and (max-width: 767px) {\n @content;\n }\n}\n\n@mixin input-cover() {\n @include position(0, null, null, 0);\n @include margin(0);\n\n position: absolute;\n\n width: 100%;\n height: 100%;\n\n border: 0;\n background: transparent;\n cursor: pointer;\n\n appearance: none;\n outline: none;\n\n &::-moz-focus-inner {\n border: 0;\n }\n}\n\n@mixin visually-hidden() {\n position: absolute;\n\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n width: 100%;\n height: 100%;\n\n margin: 0;\n padding: 0;\n\n border: 0;\n outline: 0;\n clip: rect(0 0 0 0);\n\n opacity: 0;\n overflow: hidden;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n@mixin text-inherit() {\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n letter-spacing: inherit;\n text-decoration: inherit;\n text-indent: inherit;\n text-overflow: inherit;\n text-transform: inherit;\n text-align: inherit;\n white-space: inherit;\n color: inherit;\n}\n\n@mixin button-state() {\n @include position(0, 0, 0, 0);\n\n position: absolute;\n\n content: '';\n\n opacity: 0;\n}\n\n// Get the key from a map based on the index\n@function index-to-key($map, $index) {\n $keys: map-keys($map);\n\n @return nth($keys, $index);\n}\n\n// Breakpoint Mixins\n// ---------------------------------------------------------------------------------\n\n// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n// (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$screen-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// ---------------------------------------------------------------------------------\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 576px\n@function breakpoint-min($name, $breakpoints: $screen-breakpoints) {\n $min: map-get($breakpoints, $name);\n\n @return if($name != index-to-key($breakpoints, 1), $min, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.\n// Useful for making responsive utilities.\n//\n// >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"\" (Returns a blank string)\n// >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $screen-breakpoints) {\n @return if(breakpoint-min($name, $breakpoints) == null, '', '-#{$name}');\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $screen-breakpoints) {\n $min: breakpoint-min($name, $breakpoints);\n @if $min {\n @media (min-width: $min) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n// >> breakpoint-next(sm)\n// md\n// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// md\n// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n// md\n@function breakpoint-next($name, $breakpoints: $screen-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n $n: index($breakpoint-names, $name);\n @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Maximum breakpoint width. Null for the smallest (first) breakpoint.\n// The maximum value is reduced by 0.02px to work around the limitations of\n// `min-` and `max-` prefixes and viewports with fractional widths.\n//\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\t// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\t// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n// >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n// 767.98px\n@function breakpoint-max($name, $breakpoints: $screen-breakpoints) {\n $max: map-get($breakpoints, $name);\n @return if($max and $max > 0, $max - 0.02, null);\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $screen-breakpoints) {\n $max: breakpoint-max($name, $breakpoints);\n @if $max {\n @media (max-width: $max) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n// Text Direction - ltr / rtl\n//\n// CSS defaults to use the ltr css, and adds [dir=rtl] selectors\n// to override ltr defaults.\n// ----------------------------------------------------------\n\n@mixin multi-dir() {\n @content;\n\n // $root: #{&};\n // @at-root [dir] {\n // #{$root} {\n // @content;\n // }\n // }\n}\n\n@mixin rtl() {\n $root: #{&};\n\n $rootSplit: str-split($root, ',');\n $selectors: #{add-root-selector($root, '[dir=rtl]')};\n $selectorsSplit: str-split($selectors, ',');\n\n $hostContextSelectors: ();\n $restSelectors: ();\n $dirSelectors: ();\n\n // Selectors must be split into individual selectors in case the browser\n // doesn't support a specific selector.\n // For example, Firefox and Safari doesn't support `:host-context()`.\n // If an invalid selector is used, then the entire group of selectors\n // will be ignored.\n // @link https://www.w3.org/TR/selectors-3/#grouping\n @each $selector in $selectorsSplit {\n // Group the selectors back into a single selector to optimize the output.\n @if str-index($selector, ':host-context') {\n $hostContextSelectors: append($hostContextSelectors, $selector, comma);\n } @else {\n // Group the selectors back into a single selector to optimize the output.\n $restSelectors: append($restSelectors, $selector, comma);\n }\n }\n\n // Supported by Chrome.\n @if length($hostContextSelectors) > 0 {\n @at-root #{$hostContextSelectors} {\n @content;\n }\n }\n\n // Supported by all browsers.\n @if length($restSelectors) > 0 {\n @at-root #{$restSelectors} {\n @content;\n }\n }\n\n // If browser can support `:dir()`, then add the `:dir()` selectors.\n @supports selector(:dir(rtl)) {\n // Adding :dir() in case the browser doesn't support `:host-context()` and does support `:dir()`.\n // `:host-context()` is added:\n // - through the `add-root-selector()` function.\n // - first so that it takes precedence over `:dir()`.\n // For example,\n // - Firefox doesn't support `:host-context()`, but does support `:dir()`.\n // - Safari doesn't support `:host-context()`, but Safari 16.4+ supports `:dir()`\n // @link https://webkit.org/blog/13966/webkit-features-in-safari-16-4/\n // -- However, there is a Webkit bug on v16 that prevents `:dir()` from working when\n // -- the app direction is changed dynamically. v17+ works fine.\n // -- @link https://bugs.webkit.org/show_bug.cgi?id=257133\n\n // Supported by Firefox.\n @at-root #{add-root-selector($root, \":dir(rtl)\", false)} {\n @content;\n }\n }\n}\n\n@mixin ltr() {\n @content;\n}\n\n// SVG Background Image Mixin\n// @param {string} $svg\n// ----------------------------------------------------------\n@mixin svg-background-image($svg, $flip-rtl: false) {\n $url: url-encode($svg);\n $viewBox: str-split(str-extract($svg, \"viewBox='\", \"'\"), ' ');\n\n @if $flip-rtl != true or $viewBox == null {\n @include multi-dir() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n } @else {\n $transform: \"transform='translate(#{nth($viewBox, 3)}, 0) scale(-1, 1)'\";\n $flipped-url: $svg;\n $flipped-url: str-replace($flipped-url, '<path', '<path #{$transform}');\n $flipped-url: str-replace($flipped-url, '<line', '<line #{$transform}');\n $flipped-url: str-replace($flipped-url, '<polygon', '<polygon #{$transform}');\n $flipped-url: url-encode($flipped-url);\n\n @include ltr() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$url}');\n }\n @include rtl() {\n background-image: url('data:image/svg+xml;charset=utf-8,#{$flipped-url}');\n }\n }\n}\n\n// Add property horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin property-horizontal($prop, $start, $end: $start) {\n @if $start == 0 and $end == 0 {\n #{$prop}-left: $start;\n #{$prop}-right: $end;\n } @else {\n -webkit-#{$prop}-start: $start;\n #{$prop}-inline-start: $start;\n -webkit-#{$prop}-end: $end;\n #{$prop}-inline-end: $end;\n }\n}\n\n// Add property for all directions\n// @param {string} $prop\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// @param {boolean} $content include content or use default\n// ----------------------------------------------------------\n@mixin property($prop, $top, $end: $top, $bottom: $top, $start: $end) {\n @include property-horizontal($prop, $start, $end);\n #{$prop}-top: $top;\n #{$prop}-bottom: $bottom;\n}\n\n// Add padding horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin padding-horizontal($start, $end: $start) {\n @include property-horizontal(padding, $start, $end);\n}\n\n// Add padding for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin padding($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(padding, $top, $end, $bottom, $start);\n}\n\n// Add margin horizontal\n// @param {string} $start\n// @param {string} $end\n// ----------------------------------------------------------\n@mixin margin-horizontal($start, $end: $start) {\n @include property-horizontal(margin, $start, $end);\n}\n\n// Add margin for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin margin($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(margin, $top, $end, $bottom, $start);\n}\n\n// Add position horizontal\n// @param {string} $start - amount to position start\n// @param {string} $end - amount to left: 0; end\n// ----------------------------------------------------------\n@mixin position-horizontal($start: null, $end: null) {\n @if $start == $end {\n @include multi-dir() {\n left: $start;\n right: $end;\n }\n } @else {\n @at-root {\n @supports (inset-inline-start: 0) {\n & {\n inset-inline-start: $start;\n inset-inline-end: $end;\n }\n }\n }\n\n // TODO FW-3766\n @at-root {\n @supports not (inset-inline-start: 0) {\n & {\n @include ltr() {\n left: $start;\n right: $end;\n }\n @include rtl() {\n left: unset;\n right: unset;\n\n left: $end;\n right: $start;\n }\n }\n }\n }\n }\n}\n\n// Add position for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin position($top: null, $end: null, $bottom: null, $start: null) {\n @include position-horizontal($start, $end);\n top: $top;\n bottom: $bottom;\n}\n\n// Add border for all directions\n// @param {string} $top\n// @param {string} $end\n// @param {string} $bottom\n// @param {string} $start\n// ----------------------------------------------------------\n@mixin border($top, $end: $top, $bottom: $top, $start: $end) {\n @include property(border, $top, $end, $bottom, $start);\n}\n\n// Add border radius for all directions\n// @param {string} $top-start\n// @param {string} $top-end\n// @param {string} $bottom-end\n// @param {string} $bottom-start\n// ----------------------------------------------------------\n@mixin border-radius($top-start, $top-end: $top-start, $bottom-end: $top-start, $bottom-start: $top-end) {\n @if $top-start == $top-end and $top-start == $bottom-end and $top-start == $bottom-start {\n @include multi-dir() {\n border-radius: $top-start;\n }\n } @else {\n @include ltr() {\n border-top-left-radius: $top-start;\n border-top-right-radius: $top-end;\n border-bottom-right-radius: $bottom-end;\n border-bottom-left-radius: $bottom-start;\n }\n\n @include rtl() {\n border-top-left-radius: $top-end;\n border-top-right-radius: $top-start;\n border-bottom-right-radius: $bottom-start;\n border-bottom-left-radius: $bottom-end;\n }\n }\n}\n\n// Add direction for all directions\n// @param {string} $dir - Direction on LTR\n@mixin direction($dir) {\n $other-dir: null;\n\n @if $dir == ltr {\n $other-dir: rtl;\n } @else {\n $other-dir: ltr;\n }\n\n @include ltr() {\n direction: $dir;\n }\n @include rtl() {\n direction: $other-dir;\n }\n}\n\n// Add float for all directions\n// @param {string} $side\n// @param {string} $decorator - !important\n@mixin float($side, $decorator: null) {\n @if $side == start {\n @include ltr() {\n float: left $decorator;\n }\n @include rtl() {\n float: right $decorator;\n }\n } @else if $side == end {\n @include ltr() {\n float: right $decorator;\n }\n @include rtl() {\n float: left $decorator;\n }\n } @else {\n @include multi-dir() {\n float: $side $decorator;\n }\n }\n}\n\n@mixin background-position($horizontal, $horizontal-amount: null, $vertical: null, $vertical-amount: null) {\n @if $horizontal == start or $horizontal == end {\n $horizontal-ltr: null;\n $horizontal-rtl: null;\n @if $horizontal == start {\n $horizontal-ltr: left;\n $horizontal-rtl: right;\n } @else {\n $horizontal-ltr: right;\n $horizontal-rtl: left;\n }\n\n @include ltr() {\n background-position: $horizontal-ltr $horizontal-amount $vertical $vertical-amount;\n }\n @include rtl() {\n background-position: $horizontal-rtl $horizontal-amount $vertical $vertical-amount;\n }\n } @else {\n @include multi-dir() {\n background-position: $horizontal $horizontal-amount $vertical $vertical-amount;\n }\n }\n}\n\n@mixin transform-origin($x-axis, $y-axis: null) {\n @if $x-axis == start {\n @include ltr() {\n transform-origin: left $y-axis;\n }\n @include rtl() {\n transform-origin: right $y-axis;\n }\n } @else if $x-axis == end {\n @include ltr() {\n transform-origin: right $y-axis;\n }\n @include rtl() {\n transform-origin: left $y-axis;\n }\n } @else if $x-axis == left or $x-axis == right {\n @include multi-dir() {\n transform-origin: $x-axis $y-axis;\n }\n } @else {\n @include ltr() {\n transform-origin: $x-axis $y-axis;\n }\n @include rtl() {\n transform-origin: calc(100% - #{$x-axis}) $y-axis;\n }\n }\n}\n\n// Add transform for all directions\n// @param {string} $transforms - comma separated list of transforms\n@mixin transform($transforms...) {\n $extra: null;\n\n $x: null;\n $ltr-translate: null;\n $rtl-translate: null;\n\n @each $transform in $transforms {\n @if (str-index($transform, translate3d)) {\n $transform: str-replace($transform, 'translate3d(');\n $transform: str-replace($transform, ')');\n\n $coordinates: str-split($transform, ',');\n\n $x: nth($coordinates, 1);\n $y: nth($coordinates, 2);\n $z: nth($coordinates, 3);\n\n $ltr-translate: translate3d($x, $y, $z);\n $rtl-translate: translate3d(calc(-1 #{$x}), $y, $z);\n } @else {\n @if $extra == null {\n $extra: $transform;\n } @else {\n $extra: $extra $transform;\n }\n }\n }\n\n @if $x == '0' or $x == null {\n @include multi-dir() {\n transform: $ltr-translate $extra;\n }\n } @else {\n @include ltr() {\n transform: $ltr-translate $extra;\n }\n\n @include rtl() {\n transform: $rtl-translate $extra;\n }\n }\n}\n","@import '../themes/capsule.globals.scss';\n\n// Capsule Font Family\n// --------------------------------------------------\n\nhtml {\n --cpsl-default-font: 'Helvetica', sans-serif;\n --cpsl-default-dynamic-font: -apple-system-body;\n --cpsl-font-family: var(--cpsl-default-font);\n}\n\ndiv {\n box-sizing: border-box;\n}\n\nbody.backdrop-no-scroll {\n overflow: hidden;\n}\n\n// Capsule Colors\n// --------------------------------------------------\n// Generates the default color vars\n\n@mixin generate-color($color-name) {\n $value: map-get($colors, $color-name);\n\n --cpsl-color-#{$color-name}: #{$value};\n}\n\n// Capsule Border Radii\n// --------------------------------------------------\n// Generates the default border vars\n\n@mixin generate-border-radius($border-radius-name) {\n $value: map-get($borderRadii, $border-radius-name);\n\n --cpsl-border-radius-#{$border-radius-name}: #{$value};\n}\n\n// Capsule Font Sizes\n// --------------------------------------------------\n// Generates the default font sizes\n\n@mixin generate-font-size($font-size-name) {\n $value: map-get($fontSizes, $font-size-name);\n\n --cpsl-font-size-#{$font-size-name}: #{dynamic-font-clamp(0.8, $value, 1.5)};\n}\n\n:root {\n @each $color-name, $value in $colors {\n @include generate-color($color-name);\n }\n @each $border-radius-name, $value in $borderRadii {\n @include generate-border-radius($border-radius-name);\n }\n @each $font-size-name, $value in $fontSizes {\n @include generate-font-size($font-size-name);\n }\n}\n\n@keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n -webkit-transform: rotate(360deg);\n }\n}\n@-moz-keyframes spin {\n 100% {\n -moz-transform: rotate(360deg);\n }\n}\n@-webkit-keyframes spin {\n 0% {\n -webkit-transform: rotate(0deg);\n }\n 50% {\n -webkit-transform: rotate(180deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n }\n}\n\n.cpsl-table {\n width: 100%;\n\n border-spacing: 0;\n border-collapse: separate;\n font-family: $font-family-base;\n\n & th {\n @include padding(var(--table-header-padding-top), var(--table-header-padding-end), var(--table-header-padding-bottom), var(--table-header-padding-start));\n\n background: var(--table-header-background-color);\n color: var(--cpsl-color-text-primary);\n font-weight: 500;\n font-size: var(--cpsl-font-size-body-xs);\n border-bottom: var(--table-header-border-width) solid var(--table-header-border-color);\n }\n\n & td {\n @include padding(var(--table-content-padding-top), var(--table-content-padding-end), var(--table-content-padding-bottom), var(--table-content-padding-start));\n color: var(--cpsl-color-text-primary);\n font-size: var(--cpsl-font-size-body-s);\n border-bottom: var(--table-content-border-width) solid var(--table-content-border-color);\n }\n\n & tr:last-child td {\n border-bottom: none;\n }\n\n &.sticky-header {\n & thead {\n position: sticky;\n top: 0;\n }\n }\n}\n","// Global Utility Functions\n@import './capsule.functions.string';\n\n// Global Color Functions\n@import './capsule.functions.color';\n\n// Global Font Functions\n@import './capsule.functions.font';\n\n// Global Mixins\n@import './capsule.mixins';\n\n// Default Theme\n@import './capsule.theme.default';\n\n// Default General\n// --------------------------------------------------\n$font-family-base: var(--cpsl-font-family, inherit) !default;\n$font-size-base: var(--cpsl-font-size-base, 16px) !default;\n\n// The minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries\n$screen-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n) !default;\n"]}

package/dist/capsule/capsule.esm.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{p as e,b as t}from"./p-86e48e61.js";export{s as setNonce}from"./p-86e48e61.js";import{g as l}from"./p-e1255160.js";const a=()=>{const t=import.meta.url;const s={};if(t!==""){s.resourcesUrl=new URL(".",t).href}return e(s)};a().then((async e=>{await l();return t([["p-d28b96ba",[[1,"cpsl-animation",{src:[1],replayAnimation:[64]}]]],["p-0d0a0037",[[1,"cpsl-col",{offset:[1],offsetXs:[1,"offset-xs"],offsetSm:[1,"offset-sm"],offsetMd:[1,"offset-md"],offsetLg:[1,"offset-lg"],offsetXl:[1,"offset-xl"],pull:[1],pullXs:[1,"pull-xs"],pullSm:[1,"pull-sm"],pullMd:[1,"pull-md"],pullLg:[1,"pull-lg"],pullXl:[1,"pull-xl"],push:[1],pushXs:[1,"push-xs"],pushSm:[1,"push-sm"],pushMd:[1,"push-md"],pushLg:[1,"push-lg"],pushXl:[1,"push-xl"],size:[1],sizeXs:[1,"size-xs"],sizeSm:[1,"size-sm"],sizeMd:[1,"size-md"],sizeLg:[1,"size-lg"],sizeXl:[1,"size-xl"]},[[9,"resize","onResize"]]]]],["p-fa078837",[[1,"cpsl-grid",{fixed:[4]}]]],["p-fcead80b",[[1,"cpsl-info-box"]]],["p-ad14a817",[[1,"cpsl-row"]]],["p-107e1ff5",[[1,"cpsl-pagination",{initialPage:[2,"initial-page"],totalPages:[2,"total-pages"],visiblePages:[1026,"visible-pages"],currentPage:[32]},null,{currentPage:["watchChange"]}],[1,"cpsl-alert",{icon:[1],variant:[1]}],[1,"cpsl-checkbox",{checked:[4]}],[1,"cpsl-code-input",{code:[1025],errorText:[1,"error-text"],helperText:[1,"helper-text"],length:[2],type:[1]}],[1,"cpsl-drawer",{anchor:[1],open:[4],size:[2],transitionDuration:[2,"transition-duration"],transitionFunction:[1,"transition-function"],variant:[1]}],[1,"cpsl-modal",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],footerExpanded:[4,"footer-expanded"],footerTransitionDuration:[2,"footer-transition-duration"],noOverlay:[4,"no-overlay"],open:[4],zIndexOverride:[2,"z-index-override"],hasFooter:[32]},null,{footerExpanded:["toggleHeight"],open:["toggleModal"]}],[1,"cpsl-slide-button",{disabled:[4],endIcon:[1,"end-icon"],endText:[1,"end-text"],startIcon:[1,"start-icon"],startText:[1,"start-text"]}],[1,"cpsl-table",{columns:[16],rows:[16]}],[1,"cpsl-tile-button",{src:[1],icon:[1]}],[1,"cpsl-app-bar",{height:[2],position:[1]}],[1,"cpsl-avatar",{alt:[1],src:[1],variant:[1]}],[1,"cpsl-card"],[1,"cpsl-divider"],[1,"cpsl-dropdown",{width:[1],hasCpslSearch:[4,"has-cpsl-search"],items:[16],selectedItem:[1040],isOpen:[32],searchQuery:[32],filteredItems:[32]},[[9,"resize","handleResize"]],{selectedItem:["handleSelectedItemChange"],isOpen:["handleOpenChange"]}],[1,"cpsl-input",{autocapitalize:[1],autocomplete:[1],autocorrect:[1],noAutoDisable:[4,"no-auto-disable"],autofocus:[4],disabled:[4],enterkeyhint:[1],errorText:[1,"error-text"],helperText:[1,"helper-text"],inputmode:[1],label:[1],max:[8],maxlength:[2],min:[8],minlength:[2],multiple:[4],name:[1],pattern:[1],placeholder:[1],readonly:[4],required:[4],showOptionalLabel:[4,"show-optional-label"],spellcheck:[4],startIconSrc:[1,"start-icon-src"],startIcon:[1,"start-icon"],step:[1],type:[1],value:[1025],hasFocus:[32]},null,{disabled:["handleDisable"]}],[1,"cpsl-nav-button-group",{selectedId:[1,"selected-id"]},null,{selectedId:["selectItem"]}],[1,"cpsl-pill",{text:[1]}],[1,"cpsl-progress-indicator",{totalSteps:[2,"total-steps"],step:[2]}],[1,"cpsl-qr-code",{url:[1],imageSrc:[1,"image-src"],size:[2]}],[1,"cpsl-radio",{checked:[4]}],[1,"cpsl-spinner",{size:[2],speed:[2]}],[1,"cpsl-switch",{checked:[4]}],[1,"cpsl-tab",{selected:[4],tab:[1]},[[8,"cpslTabsChanged","onTabsChanged"],[8,"cpslTabsInit","onTabsInit"]]],[1,"cpsl-tabs",{fullWidth:[4,"full-width"],selectedTab:[1,"selected-tab"],selectedTabRect:[32],loaded:[32]},null,{fullWidth:["updateSlider"],selectedTab:["updateTab"]}],[1,"cpsl-button",{disabled:[516],fullWidth:[4,"full-width"],size:[1],variant:[1]}],[1,"cpsl-button-group",{selectedId:[1,"selected-id"]},null,{selectedId:["selectItem"]}],[1,"cpsl-overlay",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],open:[4],zIndexOverride:[2,"z-index-override"]},null,{open:["toggleHeight"]}],[1,"cpsl-text",{color:[1],variant:[1],weight:[1]}],[1,"cpsl-icon",{src:[1],icon:[1]}]]]],e)}));
+import{p as e,b as t}from"./p-6e71539d.js";export{s as setNonce}from"./p-6e71539d.js";import{g as r}from"./p-e1255160.js";var o=()=>{const t=import.meta.url;const r={};if(t!==""){r.resourcesUrl=new URL(".",t).href}return e(r)};o().then((async e=>{await r();return t([["p-5ed5e96c",[[1,"cpsl-modal-v2",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],elevated:[4],noOverlay:[4,"no-overlay"],open:[4],zIndexOverride:[2,"z-index-override"]},null,{open:["toggleHeight"]}]]],["p-86e6cba5",[[1,"cpsl-animation",{src:[1],replayAnimation:[64]}]]],["p-70f95c93",[[1,"cpsl-col",{offset:[1],offsetXs:[1,"offset-xs"],offsetSm:[1,"offset-sm"],offsetMd:[1,"offset-md"],offsetLg:[1,"offset-lg"],offsetXl:[1,"offset-xl"],pull:[1],pullXs:[1,"pull-xs"],pullSm:[1,"pull-sm"],pullMd:[1,"pull-md"],pullLg:[1,"pull-lg"],pullXl:[1,"pull-xl"],push:[1],pushXs:[1,"push-xs"],pushSm:[1,"push-sm"],pushMd:[1,"push-md"],pushLg:[1,"push-lg"],pushXl:[1,"push-xl"],size:[1],sizeXs:[1,"size-xs"],sizeSm:[1,"size-sm"],sizeMd:[1,"size-md"],sizeLg:[1,"size-lg"],sizeXl:[1,"size-xl"]},[[9,"resize","onResize"]]]]],["p-f9351426",[[1,"cpsl-grid",{fixed:[4]}]]],["p-52d6ebee",[[1,"cpsl-info-box"]]],["p-397edab5",[[1,"cpsl-row"]]],["p-6e900654",[[1,"cpsl-pagination",{initialPage:[2,"initial-page"],totalPages:[2,"total-pages"],visiblePages:[1026,"visible-pages"],currentPage:[32]},null,{currentPage:["watchChange"]}],[1,"cpsl-file-upload",{errorText:[1,"error-text"],externalFilename:[1,"external-filename"],externalSrc:[1,"external-src"],fileTypes:[16],helperText:[1,"helper-text"],label:[1],required:[4],showOptionalLabel:[4,"show-optional-label"],uploadFile:[16],file:[32],dragOver:[32],dragError:[32],isUploading:[32],uploadError:[32]}],[1,"cpsl-select",{disabled:[4],dropdownMaxHeight:[2,"dropdown-max-height"],errorText:[1,"error-text"],formatValue:[16],helperText:[1,"helper-text"],id:[1],label:[1],placeholder:[1],required:[4],selectedValue:[1,"selected-value"],showFormattedSelectedItem:[4,"show-formatted-selected-item"],showOptionalLabel:[4,"show-optional-label"],anchorEl:[32],hasFocus:[32],popoverOpen:[32],hasSelectedItem:[32]},[[0,"cpslSelectItemClick","selectItemClickHandler"],[0,"cpslOpen","onPopoverOpen"],[0,"cpslClose","onPopoverClose"]],{selectedValue:["onValueChange","handleValueChange"]}],[1,"cpsl-alert",{icon:[1],variant:[1]}],[1,"cpsl-checkbox",{checked:[4]}],[1,"cpsl-code-input",{code:[1025],errorText:[1,"error-text"],helperText:[1,"helper-text"],length:[2],type:[1]}],[1,"cpsl-drawer",{anchor:[1],anchorPosition:[2,"anchor-position"],noOverlay:[4,"no-overlay"],open:[4],size:[8],transitionDuration:[2,"transition-duration"],transitionFunction:[1,"transition-function"],variant:[1],zIndexOverride:[2,"z-index-override"],closedAnchorPosition:[32],showTransition:[32]}],[1,"cpsl-modal",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],footerExpanded:[4,"footer-expanded"],footerTransitionDuration:[2,"footer-transition-duration"],noOverlay:[4,"no-overlay"],open:[4],zIndexOverride:[2,"z-index-override"],hasFooter:[32]},null,{footerExpanded:["toggleHeight"],open:["toggleModal"]}],[1,"cpsl-slide-button",{disabled:[4],endIcon:[1,"end-icon"],endText:[1,"end-text"],startIcon:[1,"start-icon"],startText:[1,"start-text"]}],[1,"cpsl-table",{hasHorizontalScroll:[32],hasVerticalScroll:[32]}],[1,"cpsl-tile-button",{src:[1],icon:[1]}],[1,"cpsl-app-bar",{height:[2],position:[1],zIndexOverride:[2,"z-index-override"]}],[1,"cpsl-avatar",{alt:[1],src:[1],variant:[1]}],[1,"cpsl-divider"],[1,"cpsl-dropdown",{width:[1],hasCpslSearch:[4,"has-cpsl-search"],items:[16],selectedItem:[1040],isOpen:[32],searchQuery:[32],filteredItems:[32]},[[9,"resize","handleResize"]],{selectedItem:["handleSelectedItemChange"],isOpen:["handleOpenChange"]}],[1,"cpsl-input",{autocapitalize:[1],autocomplete:[1],autocorrect:[1],noAutoDisable:[4,"no-auto-disable"],autofocus:[4],disabled:[4],enterkeyhint:[1],errorText:[1,"error-text"],helperText:[1,"helper-text"],inputmode:[1],label:[1],max:[8],maxlength:[2],min:[8],minlength:[2],multiple:[4],name:[1],pattern:[1],placeholder:[1],readonly:[4],required:[4],showOptionalLabel:[4,"show-optional-label"],spellcheck:[4],startIconSrc:[1,"start-icon-src"],startIcon:[1,"start-icon"],step:[1],type:[1],value:[1025],hasFocus:[32]},null,{disabled:["handleDisable"]}],[1,"cpsl-nav-button-group",{selectedId:[1,"selected-id"]},null,{selectedId:["selectItem"]}],[1,"cpsl-pill",{text:[1]}],[1,"cpsl-progress-indicator",{totalSteps:[2,"total-steps"],step:[2]}],[1,"cpsl-qr-code",{url:[1],imageSrc:[1,"image-src"],size:[2]}],[1,"cpsl-radio",{checked:[4]}],[1,"cpsl-select-item",{selected:[4],value:[1]}],[1,"cpsl-switch",{checked:[4]}],[1,"cpsl-tab",{selected:[4],tab:[1]},[[8,"cpslTabsChanged","onTabsChanged"],[8,"cpslTabsInit","onTabsInit"]]],[1,"cpsl-tabs",{fullWidth:[4,"full-width"],selectedTab:[1,"selected-tab"],selectedTabRect:[32],loaded:[32]},null,{fullWidth:["updateSlider"],selectedTab:["updateTab"]}],[1,"cpsl-button",{as:[1],disabled:[516],fullWidth:[4,"full-width"],href:[1],size:[1],target:[1],variant:[513]}],[1,"cpsl-button-group",{selectedId:[1,"selected-id"]},null,{selectedId:["selectItem"]}],[1,"cpsl-popover",{anchorEl:[16],anchorOriginHorizontal:[1,"anchor-origin-horizontal"],anchorOriginVertical:[1,"anchor-origin-vertical"],autoWidth:[4,"auto-width"],disabled:[4],preventBlur:[4,"prevent-blur"],transformOriginHorizontal:[1,"transform-origin-horizontal"],transformOriginVertical:[1,"transform-origin-vertical"],triggerAction:[1,"trigger-action"],trigger:[1],windowPadding:[2,"window-padding"],open:[32],positionX:[32],positionY:[32],closePopover:[64]},null,{trigger:["onTriggerChange"],triggerAction:["onTriggerChange"],preventBlur:["onTriggerChange"],anchorOriginHorizontal:["onAnchorChange"],anchorOriginVertical:["onAnchorChange"],open:["onOpenChange"]}],[1,"cpsl-spinner",{size:[2],speed:[2]}],[1,"cpsl-card"],[1,"cpsl-overlay",{enterTransitionDuration:[2,"enter-transition-duration"],exitTransitionDuration:[2,"exit-transition-duration"],open:[4],zIndexOverride:[2,"z-index-override"]},null,{open:["toggleHeight"]}],[1,"cpsl-text",{color:[1],variant:[1],weight:[1]}],[1,"cpsl-icon",{src:[1],icon:[1]}]]]],e)}));
 //# sourceMappingURL=capsule.esm.js.map

package/dist/capsule/capsule.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","src","replayAnimation","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","pull","pullXs","pullSm","pullMd","pullLg","pullXl","push","pushXs","pushSm","pushMd","pushLg","pushXl","size","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","fixed","initialPage","totalPages","visiblePages","currentPage","~~icon~~","~~variant~~","~~checked~~","~~code~~","~~errorText~~","~~helperText~~","~~length~~","~~type~~","~~anchor~~","~~open~~","~~transitionDuration~~","~~transitionFunction~~","~~enterTransitionDuration~~","~~exitTransitionDuration~~","~~footerExpanded~~","~~footerTransitionDuration~~","~~noOverlay~~","~~zIndexOverride~~","~~hasFooter~~","~~disabled~~","endIcon","endText","startIcon","startText","~~columns~~","~~rows~~","height","position","alt","width","hasCpslSearch","items","selectedItem","isOpen","searchQuery","filteredItems","autocapitalize","autocomplete","autocorrect","noAutoDisable","autofocus","enterkeyhint","inputmode","~~label","~~max","maxlength","min","minlength","multiple","name","pattern","~~placeholder","~~readonly","~~required","showOptionalLabel","~~spellcheck","startIconSrc","step","value","~~hasFocus","~~selectedId","text","totalSteps","imageSrc","~~speed","~~selected","tab","fullWidth","selectedTab","selectedTabRect","loaded","color","weight"],"sources":["~~../~~node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/\n Stencil Client Patch Browser v4.12.5 \| MIT Licensed \| https://stenciljs.com\n /\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, ~~promiseResolve~~, H } from '@stencil/core';\~~nconst~~ patchBrowser = () => {\n ~~// NOTE!! This fn cannot use async/await!\n~~ if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo('Running in development mode.');\n }\n if (BUILD.cloneNodeFix) {\n ~~// opted-in to polyfill cloneNode() for slot polyfilled components\n~~ patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts\n ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(~~`\\/$~~{NAMESPACE}(\\\\.esm)?\\\\.js($\|\\\\?\|#)`).test(s.src) ~~\|\|\n~~ s.getAttribute('data-stencil-namespace') === NAMESPACE)\n : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm \|\| {})['data-opts'] \|\| {} : {};\n if (importMeta !== '') {\n opts.resourcesUrl = new URL(~~'.'~~, importMeta).href;\n }\n return promiseResolve(opts);\n};\~~nconst~~ patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function (deep) {\n if (this.nodeName === 'TEMPLATE') {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n ~~// Node.ATTRIBUTE_NODE === 2, and checking because IE11\n~~ if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/!__STENCIL_LAZY_DATA__/], options);\n});\n"],"mappings":"~~0HAKA~~,~~MAAMA~~,EAAe,~~KAajB~~,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,~~CACnBE~~,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,~~IACrD~~,~~CACI~~,OAAOC,EAAeJ,EAAK,~~ECnB/BH~~,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAc,~~oCAA8B~~,~~CAAOC~~,~~IAAE~~,IAAAC,gBAAA,uCAAAC,OAAA,IAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,2EAAAC,MAAA,kHAAAC,YAAA,mBAAAC,WAAA,kBAAAC,aAAA,uBAAAC,YAAA,YAAAA,YAAA,~~mCAAAC~~,KAAA,IAAAC,QAAA,0BAAAC,QAAA,4BAAAC,KAAA,~~OAAAC~~,UAAA,~~iBAAAC~~,WAAA,~~kBAAAC~~,OAAA,IAAAC,KAAA,wBAAAC,OAAA,IAAAC,KAAA,~~IAAApB~~,KAAA,~~IAAAqB~~,mBAAA,0BAAAC,mBAAA,~~0BAAAV~~,QAAA,~~uBAAAW~~,wBAAA,gCAAAC,uBAAA,+~~BAAAC~~,eAAA,sBAAAC,yBAAA,~~iCAAAC~~,UAAA,~~iBAAAP~~,KAAA,~~IAAAQ~~,eAAA,~~uBAAAC~~,UAAA,~~YAAAJ~~,eAAA,~~iBAAAL~~,KAAA,~~0CAAAU~~,SAAA,~~IAAAC~~,QAAA,eAAAC,QAAA,eAAAC,UAAA,iBAAAC,UAAA,oCAAAC,~~QAAA~~,KAAAC,~~KAAA~~,~~8BAAAxD~~,IAAA,~~IAAA+B~~,KAAA,~~yBAAA0B~~,OAAA,IAAAC,SAAA,~~wBAAAC~~,IAAA,~~IAAA3D~~,IAAA,~~IAAAgC~~,QAAA,~~6DAAA4B~~,MAAA,IAAAC,cAAA,sBAAAC,MAAA,KAAAC,aAAA,OAAAC,OAAA,KAAAC,YAAA,KAAAC,cAAA,qCAAAH,aAAA,6BAAAC,OAAA,wCAAAG,eAAA,IAAAC,aAAA,IAAAC,YAAA,IAAAC,cAAA,sBAAAC,UAAA,~~IAAArB~~,SAAA,~~IAAAsB~~,aAAA,~~IAAArC~~,UAAA,~~iBAAAC~~,WAAA,~~kBAAAqC~~,UAAA,~~IAAAC~~,MAAA,~~IAAAC~~,IAAA,IAAAC,UAAA,IAAAC,IAAA,IAAAC,UAAA,IAAAC,SAAA,IAAAC,KAAA,IAAAC,QAAA,~~IAAAC~~,YAAA,~~IAAAC~~,SAAA,~~IAAAC~~,SAAA,IAAAC,kBAAA,~~0BAAAC~~,WAAA,IAAAC,aAAA,~~qBAAAlC~~,UAAA,~~iBAAAmC~~,KAAA,~~IAAAlD~~,KAAA,~~IAAAmD~~,MAAA,~~OAAAC~~,SAAA,~~YAAAxC~~,SAAA,~~gDAAAyC~~,WAAA,yBAAAA,WAAA,iCAAAC,KAAA,oCAAAC,WAAA,~~kBAAAL~~,KAAA,~~yBAAAnG~~,IAAA,~~IAAAyG~~,SAAA,~~gBAAA1E~~,KAAA,~~uBAAAa~~,QAAA,~~yBAAAb~~,~~KAAA~~,~~IAAA2E~~,MAAA,~~wBAAA9D~~,QAAA,~~qBAAA+D~~,SAAA,IAAAC,IAAA,8FAAAC,UAAA,iBAAAC,YAAA,mBAAAC,gBAAA,KAAAC,OAAA,YAAAH,UAAA,iBAAAC,YAAA,~~kCAAAjD~~,SAAA,~~MAAAgD~~,UAAA,~~iBAAA9E~~,KAAA,~~IAAAY~~,QAAA,~~8BAAA2D~~,WAAA,yBAAAA,WAAA,~~oCAAAhD~~,wBAAA,gCAAAC,uBAAA,+~~BAAAJ~~,KAAA,~~IAAAQ~~,eAAA,~~8BAAAR~~,KAAA,~~mCAAA8D~~,MAAA,~~IAAAtE~~,QAAA,~~IAAAuE~~,OAAA,~~sBAAAvG~~,IAAA,~~IAAA+B~~,KAAA,~~SAAAlC~~,EAAA"}
1	+ {"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","enterTransitionDuration","exitTransitionDuration","elevated","noOverlay","open","zIndexOverride","src","replayAnimation","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","pull","pullXs","pullSm","pullMd","pullLg","pullXl","push","pushXs","pushSm","pushMd","pushLg","pushXl","size","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","fixed","initialPage","totalPages","visiblePages","currentPage","errorText","externalFilename","externalSrc","fileTypes","helperText","label","required","showOptionalLabel","uploadFile","file","dragOver","dragError","isUploading","uploadError","disabled","dropdownMaxHeight","formatValue","id","placeholder","selectedValue","showFormattedSelectedItem","anchorEl","hasFocus","popoverOpen","hasSelectedItem","icon","variant","checked","code","length","type","anchor","anchorPosition","transitionDuration","transitionFunction","closedAnchorPosition","showTransition","footerExpanded","footerTransitionDuration","hasFooter","endIcon","endText","startIcon","startText","hasHorizontalScroll","hasVerticalScroll","height","position","alt","width","hasCpslSearch","items","selectedItem","isOpen","searchQuery","filteredItems","autocapitalize","autocomplete","autocorrect","noAutoDisable","autofocus","enterkeyhint","inputmode","max","maxlength","min","minlength","multiple","name","pattern","readonly","spellcheck","startIconSrc","step","value","selectedId","text","totalSteps","imageSrc","selected","tab","fullWidth","selectedTab","selectedTabRect","loaded","as","target","anchorOriginHorizontal","anchorOriginVertical","autoWidth","preventBlur","transformOriginHorizontal","transformOriginVertical","triggerAction","trigger","windowPadding","positionX","positionY","closePopover","speed","color","weight"],"sources":["../../web-sdk/node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/\n Stencil Client Patch Browser v4.18.3 \| MIT Licensed \| https://stenciljs.com\n /\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo(\"Running in development mode.\");\n }\n if (BUILD.cloneNodeFix) {\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($\|\\\\?\|#)`).test(s.src) \|\| s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n ) : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm \|\| {})[\"data-opts\"] \|\| {} : {};\n if (importMeta !== \"\") {\n opts.resourcesUrl = new URL(\".\", importMeta).href;\n }\n return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function(deep) {\n if (this.nodeName === \"TEMPLATE\") {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport {\n patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n await globalScripts();\n return bootstrapLazy([/!__STENCIL_LAZY_DATA__/], options);\n});\n"],"mappings":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAc,mCAA8B,CAAAC,wBAAS,gCAAAC,uBAAA,+BAAAC,SAAA,IAAAC,UAAA,iBAAAC,KAAA,IAAAC,eAAA,8BAAAD,KAAA,yDAAAE,IAAA,IAAAC,gBAAA,uCAAAC,OAAA,IAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,SAAA,gBAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,KAAA,IAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,cAAAC,OAAA,2EAAAC,MAAA,kHAAAC,YAAA,mBAAAC,WAAA,kBAAAC,aAAA,uBAAAC,YAAA,YAAAA,YAAA,yCAAAC,UAAA,iBAAAC,iBAAA,wBAAAC,YAAA,mBAAAC,UAAA,KAAAC,WAAA,kBAAAC,MAAA,IAAAC,SAAA,IAAAC,kBAAA,0BAAAC,WAAA,KAAAC,KAAA,KAAAC,SAAA,KAAAC,UAAA,KAAAC,YAAA,KAAAC,YAAA,yBAAAC,SAAA,IAAAC,kBAAA,0BAAAf,UAAA,iBAAAgB,YAAA,KAAAZ,WAAA,kBAAAa,GAAA,IAAAZ,MAAA,IAAAa,YAAA,IAAAZ,SAAA,IAAAa,cAAA,qBAAAC,0BAAA,mCAAAb,kBAAA,0BAAAc,SAAA,KAAAC,SAAA,KAAAC,YAAA,KAAAC,gBAAA,4HAAAL,cAAA,yDAAAM,KAAA,IAAAC,QAAA,0BAAAC,QAAA,4BAAAC,KAAA,OAAA5B,UAAA,iBAAAI,WAAA,kBAAAyB,OAAA,IAAAC,KAAA,wBAAAC,OAAA,IAAAC,eAAA,sBAAAlE,UAAA,iBAAAC,KAAA,IAAAsB,KAAA,IAAA4C,mBAAA,0BAAAC,mBAAA,0BAAAR,QAAA,IAAA1D,eAAA,uBAAAmE,qBAAA,KAAAC,eAAA,wBAAAzE,wBAAA,gCAAAC,uBAAA,+BAAAyE,eAAA,sBAAAC,yBAAA,iCAAAxE,UAAA,iBAAAC,KAAA,IAAAC,eAAA,uBAAAuE,UAAA,YAAAF,eAAA,iBAAAtE,KAAA,0CAAA+C,SAAA,IAAA0B,QAAA,eAAAC,QAAA,eAAAC,UAAA,iBAAAC,UAAA,oCAAAC,oBAAA,KAAAC,kBAAA,8BAAA5E,IAAA,IAAAwD,KAAA,yBAAAqB,OAAA,IAAAC,SAAA,IAAA/E,eAAA,2CAAAgF,IAAA,IAAA/E,IAAA,IAAAyD,QAAA,6CAAAuB,MAAA,IAAAC,cAAA,sBAAAC,MAAA,KAAAC,aAAA,OAAAC,OAAA,KAAAC,YAAA,KAAAC,cAAA,qCAAAH,aAAA,6BAAAC,OAAA,wCAAAG,eAAA,IAAAC,aAAA,IAAAC,YAAA,IAAAC,cAAA,sBAAAC,UAAA,IAAA9C,SAAA,IAAA+C,aAAA,IAAA7D,UAAA,iBAAAI,WAAA,kBAAA0D,UAAA,IAAAzD,MAAA,IAAA0D,IAAA,IAAAC,UAAA,IAAAC,IAAA,IAAAC,UAAA,IAAAC,SAAA,IAAAC,KAAA,IAAAC,QAAA,IAAAnD,YAAA,IAAAoD,SAAA,IAAAhE,SAAA,IAAAC,kBAAA,0BAAAgE,WAAA,IAAAC,aAAA,qBAAA9B,UAAA,iBAAA+B,KAAA,IAAA3C,KAAA,IAAA4C,MAAA,OAAApD,SAAA,YAAAR,SAAA,gDAAA6D,WAAA,yBAAAA,WAAA,iCAAAC,KAAA,oCAAAC,WAAA,kBAAAJ,KAAA,yBAAAzH,IAAA,IAAA8H,SAAA,gBAAAzF,KAAA,uBAAAsC,QAAA,6BAAAoD,SAAA,IAAAL,MAAA,wBAAA/C,QAAA,qBAAAoD,SAAA,IAAAC,IAAA,8FAAAC,UAAA,iBAAAC,YAAA,mBAAAC,gBAAA,KAAAC,OAAA,YAAAH,UAAA,iBAAAC,YAAA,kCAAAG,GAAA,IAAAvE,SAAA,MAAAmE,UAAA,iBAAA7H,KAAA,IAAAiC,KAAA,IAAAiG,OAAA,IAAA5D,QAAA,gCAAAiD,WAAA,yBAAAA,WAAA,oCAAAtD,SAAA,KAAAkE,uBAAA,+BAAAC,qBAAA,6BAAAC,UAAA,iBAAA3E,SAAA,IAAA4E,YAAA,mBAAAC,0BAAA,kCAAAC,wBAAA,gCAAAC,cAAA,qBAAAC,QAAA,IAAAC,cAAA,qBAAAhI,KAAA,KAAAiI,UAAA,KAAAC,UAAA,KAAAC,aAAA,YAAAJ,QAAA,oBAAAD,cAAA,oBAAAH,YAAA,oBAAAH,uBAAA,mBAAAC,qBAAA,mBAAAzH,KAAA,sCAAAsB,KAAA,IAAA8G,MAAA,yCAAAxI,wBAAA,gCAAAC,uBAAA,+BAAAG,KAAA,IAAAC,eAAA,8BAAAD,KAAA,mCAAAqI,MAAA,IAAA1E,QAAA,IAAA2E,OAAA,sBAAApI,IAAA,IAAAwD,KAAA,SAAAjE,EAAA","ignoreList":[]}

package/dist/capsule/index.esm.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{D as o,C as n,U as t}from"./p-b6b38e73.js";const r=({borderRadius:o})=>{if(!Boolean(o)){return}let n,t,r,e;const c=1e3;let s=false;let u=false;switch(o){case"none":{u=true;n=0;t=0;r=0;e=0;break}case"xs":{n=2;t=4;r=12;e=20;break}case"sm":{n=2;t=8;r=16;e=24;break}case"lg":{n=8;t=16;r=24;e=32;break}case"full":{n=8;t=16;r=24;e=32;s=true;break}default:case"md":{n=4;t=12;r=20;e=28;break}}document.documentElement.style.setProperty("--cpsl-border-radius-input",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-alert",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tabs",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-primary-button",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-secondary-button",`${s?c:t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tile-button",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-modal",`${r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-pill",`${u?0:c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-qr-code",`${e}px`);document.documentElement.style.setProperty("--cpsl-border-radius-info-box",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-table-container",`${r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-switch",`${u?0:c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-checkbox",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-radio",`${c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-avatar",`${t}px`);document.documentElement.style.setProperty("--cpsl-border-radius-card",`${r}px`)};const e={body2XS:"body-2xs",bodyXS:"body-xs",bodyS:"body-s",bodyM:"body-m",bodyL:"body-l",bodyXL:"body-xl",headingXS:"heading-xs",headingS:"heading-s",headingM:"heading-m",headingL:"heading-l",headingXL:"heading-xl",heading2XL:"heading-2xl"};const c=({font:o,customFontSizes:n})=>{if(Boolean(o)){document.documentElement.style.setProperty("--cpsl-default-font",o)}Object.entries(e).forEach((([o,t])=>{if(n===null||n===void 0?void 0:n[o]){document.documentElement.style.setProperty(`--cpsl-font-size-${t}`,n[o])}else{document.documentElement.style.removeProperty(`--cpsl-font-size-${t}`)}}))};function s(o,n,t){return Math.min(Math.max(o,t),n)}class u extends Error{constructor(o){super(`Failed to parse color: "${o}"`)}}var d=u;function a(o){if(typeof o!=="string")throw new d(o);if(o.trim().toLowerCase()==="transparent")return[0,0,0,0];let n=o.trim();n=k.test(o)?f(o):o;const t=b.exec(n);if(t){const o=Array.from(t).slice(1);return[...o.slice(0,3).map((o=>parseInt(p(o,2),16))),parseInt(p(o[3]||"f",2),16)/255]}const r=g.exec(n);if(r){const o=Array.from(r).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,16))),parseInt(o[3]||"ff",16)/255]}const e=m.exec(n);if(e){const o=Array.from(e).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,10))),parseFloat(o[3]||"1")]}const c=h.exec(n);if(c){const[n,t,r,e]=Array.from(c).slice(1).map(parseFloat);if(s(0,100,t)!==t)throw new d(o);if(s(0,100,r)!==r)throw new d(o);return[...y(n,t,r),Number.isNaN(e)?1:e]}throw new d(o)}function l(o){let n=5381;let t=o.length;while(t){n=n*33^o.charCodeAt(--t)}return(n>>>0)%2341}const i=o=>parseInt(o.replace(/_/g,""),36);const _="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce(((o,n)=>{const t=i(n.substring(0,3));const r=i(n.substring(3)).toString(16);let e="";for(let o=0;o<6-r.length;o++){e+="0"}o[t]=`${e}${r}`;return o}),{});function f(o){const n=o.toLowerCase().trim();const t=_[l(n)];if(!t)throw new d(o);return`#${t}`}const p=(o,n)=>Array.from(Array(n)).map((()=>o)).join("");const b=new RegExp(`^#${p("([a-f0-9])",3)}([a-f0-9])?$`,"i");const g=new RegExp(`^#${p("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i");const m=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${p(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i");const h=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i;const k=/^[a-z]+$/i;const z=o=>Math.round(o*255);const y=(o,n,t)=>{let r=t/100;if(n===0){return[r,r,r].map(z)}const e=(o%360+360)%360/60;const c=(1-Math.abs(2*r-1))*(n/100);const s=c*(1-Math.abs(e%2-1));let u=0;let d=0;let a=0;if(e>=0&&e<1){u=c;d=s}else if(e>=1&&e<2){u=s;d=c}else if(e>=2&&e<3){d=c;a=s}else if(e>=3&&e<4){d=s;a=c}else if(e>=4&&e<5){u=s;a=c}else if(e>=5&&e<6){u=c;a=s}const l=r-c/2;const i=u+l;const _=d+l;const f=a+l;return[i,_,f].map(z)};function x(o){if(o==="transparent")return 0;function n(o){const n=o/255;return n<=.04045?n/12.92:Math.pow((n+.055)/1.055,2.4)}const[t,r,e]=a(o);return.2126*n(t)+.7152*n(r)+.0722*n(e)}function w(o,n,t,r){return`rgba(${s(0,255,o).toFixed()}, ${s(0,255,n).toFixed()}, ${s(0,255,t).toFixed()}, ${parseFloat(s(0,1,r).toFixed(3))})`}function $(o,n,t){const r=(o,n)=>n===3?o:o/255;const[e,c,s,u]=a(o).map(r);const[d,l,i,_]=a(n).map(r);const f=_-u;const p=t*2-1;const b=p*f===-1?p:p+f/(1+p*f);const g=(b+1)/2;const m=1-g;const h=(e*m+d*g)*255;const k=(c*m+l*g)*255;const z=(s*m+i*g)*255;const y=_*t+u*(1-t);return w(h,k,z,y)}function j(o){return x(o)>.179}function v(o,n,t){return{r:255*t(o.r/255,n.r/255),g:255*t(o.g/255,n.g/255),b:255*t(o.b/255,n.b/255)}}function q(o,n){return o*n}function F(o,n){return o+n-o*n}function M(o,n){return C(n,o)}function C(o,n){return n<=.5?q(o,2*n):F(o,2*n-1)}function S(o,n,t){return Math.min(Math.max(o||0,n),t)}function A(o){return{r:S(o.r,0,255),g:S(o.g,0,255),b:S(o.b,0,255),a:S(o.a,0,1)}}function I(o){return{r:255*o.r,g:255*o.g,b:255*o.b,a:o.a}}function O(o){return{r:o.r/255,g:o.g/255,b:o.b/255,a:o.a}}function B(o,n){void 0===n&&(n=0);var t=Math.pow(10,n);return{r:Math.round(o.r*t)/t,g:Math.round(o.g*t)/t,b:Math.round(o.b*t)/t,a:o.a}}function R(o,n,t,r,e,c){return(1-n/t)*r+n/t*Math.round((1-o)*e+o*c)}function X(o,n,t,r,e){void 0===e&&(e={unitInput:!1,unitOutput:!1,roundOutput:!0}),e.unitInput&&(o=I(o),n=I(n)),o=A(o);var c=(n=A(n)).a+o.a-n.a*o.a,s=t(o,n,r),u=A({r:R(o.a,n.a,c,o.r,n.r,s.r),g:R(o.a,n.a,c,o.g,n.g,s.g),b:R(o.a,n.a,c,o.b,n.b,s.b),a:c});return u=e.unitOutput?O(u):e.roundOutput?B(u):function(o){return B(o,9)}(u),u}function L(o,n){return X(o,n,v,M)}const E=o=>{const n=(new Option).style;n.color=o;return n.color!==""};const P=o=>o.replace(/([a-z0–9])([A-Z])/g,"$1-$2").toLowerCase();const D=(o,n)=>{let t={};for(const r in n){const e=`${o}-${P(r)}`;if(typeof n[r]==="object"&&n[r]!==null){t=Object.assign(Object.assign({},t),D(e,n[r]))}else{t[e]=n[r]}}return t};const N=o=>D("--cpsl-color",o);const U=(o,n)=>{const t=a(o);const r=a(n);const e=L({r:t[0],g:t[1],b:t[2],a:.1},{r:r[0],g:r[1],b:r[2],a:r[3]});return w(e.r,e.g,e.b,e.a)};const Z=({foregroundColor:r,backgroundColor:e,customPalette:c})=>{if(!Boolean(r)||!E(r)){r=o.foregroundColor}if(!Boolean(e)||!E(e)){e=o.backgroundColor}const s=!j(e);const u={foregroundColors:[],backgroundColors:[],isDarkBackground:s};const d=s?"#FFFFFF":"#000000";const a=s?"#000000":"#FFFFFF";n.forEach((o=>{u.foregroundColors.push($(r,a,o));u.backgroundColors.push($(e,d,o))}));document.documentElement.style.setProperty("--cpsl-color-background-0",u.backgroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-background-4",u.backgroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-background-8",u.backgroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-background-16",u.backgroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-background-32",u.backgroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-background-48",u.backgroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-background-64",u.backgroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-background-80",u.backgroundColors[7]);document.documentElement.style.setProperty("--cpsl-color-background-96",u.backgroundColors[8]);document.documentElement.style.setProperty("--cpsl-color-foreground-0",u.foregroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-foreground-4",u.foregroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-foreground-8",u.foregroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-foreground-16",u.foregroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-foreground-32",u.foregroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-foreground-48",u.foregroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-foreground-64",u.foregroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-foreground-80",u.foregroundColors[7]);document.documentElement.style.setProperty("--cpsl-color-foreground-96",u.foregroundColors[8]);document.documentElement.style.setProperty("--cpsl-color-utility-red",U(r,t.red));document.documentElement.style.setProperty("--cpsl-color-utility-yellow",U(r,t.yellow));document.documentElement.style.setProperty("--cpsl-color-utility-green",U(r,t.green));if(Boolean(c)){const o=N(c);Object.entries(o).forEach((([o,n])=>document.documentElement.style.setProperty(o,n)))}return u};const G=({foregroundColor:n=o.foregroundColor,backgroundColor:t=o.backgroundColor,font:e,customPalette:s,borderRadius:u,customFontSizes:d})=>{const a=Z({foregroundColor:n,backgroundColor:t,customPalette:s});c({font:e,customFontSizes:d});r({borderRadius:u});return a.isDarkBackground};export{G as generateTheme};
+import{D as o,C as t,U as n}from"./p-f2393be6.js";function r(o,t,n){return Math.min(Math.max(o,n),t)}class e extends Error{constructor(o){super(`Failed to parse color: "${o}"`)}}var c=e;function s(o){if(typeof o!=="string")throw new c(o);if(o.trim().toLowerCase()==="transparent")return[0,0,0,0];let t=o.trim();t=g.test(o)?a(o):o;const n=_.exec(t);if(n){const o=Array.from(n).slice(1);return[...o.slice(0,3).map((o=>parseInt(i(o,2),16))),parseInt(i(o[3]||"f",2),16)/255]}const e=p.exec(t);if(e){const o=Array.from(e).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,16))),parseInt(o[3]||"ff",16)/255]}const s=f.exec(t);if(s){const o=Array.from(s).slice(1);return[...o.slice(0,3).map((o=>parseInt(o,10))),parseFloat(o[3]||"1")]}const u=b.exec(t);if(u){const[t,n,e,s]=Array.from(u).slice(1).map(parseFloat);if(r(0,100,n)!==n)throw new c(o);if(r(0,100,e)!==e)throw new c(o);return[...h(t,n,e),Number.isNaN(s)?1:s]}throw new c(o)}function u(o){let t=5381;let n=o.length;while(n){t=t*33^o.charCodeAt(--n)}return(t>>>0)%2341}const d=o=>parseInt(o.replace(/_/g,""),36);const l="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce(((o,t)=>{const n=d(t.substring(0,3));const r=d(t.substring(3)).toString(16);let e="";for(let o=0;o<6-r.length;o++){e+="0"}o[n]=`${e}${r}`;return o}),{});function a(o){const t=o.toLowerCase().trim();const n=l[u(t)];if(!n)throw new c(o);return`#${n}`}const i=(o,t)=>Array.from(Array(t)).map((()=>o)).join("");const _=new RegExp(`^#${i("([a-f0-9])",3)}([a-f0-9])?$`,"i");const p=new RegExp(`^#${i("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i");const f=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${i(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i");const b=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i;const g=/^[a-z]+$/i;const m=o=>Math.round(o*255);const h=(o,t,n)=>{let r=n/100;if(t===0){return[r,r,r].map(m)}const e=(o%360+360)%360/60;const c=(1-Math.abs(2*r-1))*(t/100);const s=c*(1-Math.abs(e%2-1));let u=0;let d=0;let l=0;if(e>=0&&e<1){u=c;d=s}else if(e>=1&&e<2){u=s;d=c}else if(e>=2&&e<3){d=c;l=s}else if(e>=3&&e<4){d=s;l=c}else if(e>=4&&e<5){u=s;l=c}else if(e>=5&&e<6){u=c;l=s}const a=r-c/2;const i=u+a;const _=d+a;const p=l+a;return[i,_,p].map(m)};function y(o){if(o==="transparent")return 0;function t(o){const t=o/255;return t<=.04045?t/12.92:Math.pow((t+.055)/1.055,2.4)}const[n,r,e]=s(o);return.2126*t(n)+.7152*t(r)+.0722*t(e)}function k(o,t,n,e){return`rgba(${r(0,255,o).toFixed()}, ${r(0,255,t).toFixed()}, ${r(0,255,n).toFixed()}, ${parseFloat(r(0,1,e).toFixed(3))})`}function z(o,t,n){const r=(o,t)=>t===3?o:o/255;const[e,c,u,d]=s(o).map(r);const[l,a,i,_]=s(t).map(r);const p=_-d;const f=n*2-1;const b=f*p===-1?f:f+p/(1+f*p);const g=(b+1)/2;const m=1-g;const h=(e*m+l*g)*255;const y=(c*m+a*g)*255;const z=(u*m+i*g)*255;const x=_*n+d*(1-n);return k(h,y,z,x)}function x(o){return y(o)>.179}function $(o,t,n){return{r:255*n(o.r/255,t.r/255),g:255*n(o.g/255,t.g/255),b:255*n(o.b/255,t.b/255)}}function w(o,t){return o*t}function j(o,t){return o+t-o*t}function v(o,t){return F(t,o)}function F(o,t){return t<=.5?w(o,2*t):j(o,2*t-1)}function q(o,t,n){return Math.min(Math.max(o||0,t),n)}function M(o){return{r:q(o.r,0,255),g:q(o.g,0,255),b:q(o.b,0,255),a:q(o.a,0,1)}}function B(o){return{r:255*o.r,g:255*o.g,b:255*o.b,a:o.a}}function C(o){return{r:o.r/255,g:o.g/255,b:o.b/255,a:o.a}}function R(o,t){void 0===t&&(t=0);var n=Math.pow(10,t);return{r:Math.round(o.r*n)/n,g:Math.round(o.g*n)/n,b:Math.round(o.b*n)/n,a:o.a}}function O(o,t,n,r,e,c){return(1-t/n)*r+t/n*Math.round((1-o)*e+o*c)}function S(o,t,n,r,e){void 0===e&&(e={unitInput:!1,unitOutput:!1,roundOutput:!0}),e.unitInput&&(o=B(o),t=B(t)),o=M(o);var c=(t=M(t)).a+o.a-t.a*o.a,s=n(o,t,r),u=M({r:O(o.a,t.a,c,o.r,t.r,s.r),g:O(o.a,t.a,c,o.g,t.g,s.g),b:O(o.a,t.a,c,o.b,t.b,s.b),a:c});return u=e.unitOutput?C(u):e.roundOutput?R(u):function(o){return R(o,9)}(u),u}function A(o,t){return S(o,t,$,v)}const I=o=>{const t=(new Option).style;t.color=o;return t.color!==""};const X=o=>o.replace(/([a-z0–9])([A-Z])/g,"$1-$2").toLowerCase();const L=(o,t)=>{let n={};for(const r in t){const e=`${o}-${X(r)}`;if(typeof t[r]==="object"&&t[r]!==null){n=Object.assign(Object.assign({},n),L(e,t[r]))}else{n[e]=t[r]}}return n};const E=o=>L("--cpsl-color",o);const P=o=>L("--cpsl-border-radius",o);const D=(o,t)=>{const n=s(o);const r=s(t);const e=A({r:n[0],g:n[1],b:n[2],a:.1},{r:r[0],g:r[1],b:r[2],a:r[3]});return k(e.r,e.g,e.b,e.a)};const N=({borderRadius:o,customBorderRadii:t})=>{let n,r,e=4;const c=1e3;let s=false;let u=false;switch(o){case"none":{u=true;n=0;r=0;e=0;break}case"xs":{n=2;r=4;e=2;break}case"sm":{n=4;r=8;break}case"md":{n=8;r=16;break}case"xl":{n=16;r=32;break}case"full":{n=24;r=32;s=true;break}default:case"lg":{n=12;r=24;break}}document.documentElement.style.setProperty("--cpsl-border-radius-input",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-select",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-file",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-alert",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tabs",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-primary-button",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-secondary-button",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-destructive-button",`${s?c:n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-tile-button",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-qr-code",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-info-box",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-table-container",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-avatar",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-button-group",`${n}px`);document.documentElement.style.setProperty("--cpsl-border-radius-card",`${r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-modal",`${r}px`);document.documentElement.style.setProperty("--cpsl-border-radius-checkbox",`${e}px`);document.documentElement.style.setProperty("--cpsl-border-radius-switch",`${u?0:c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-pill",`${u?0:c}px`);document.documentElement.style.setProperty("--cpsl-border-radius-radio",`${c}px`);if(Boolean(t)){const o=P(t);Object.entries(o).forEach((([o,t])=>document.documentElement.style.setProperty(o,t)))}};const U={body2XS:"body-2xs",bodyXS:"body-xs",bodyS:"body-s",bodyM:"body-m",bodyL:"body-l",bodyXL:"body-xl",headingXS:"heading-xs",headingS:"heading-s",headingM:"heading-m",headingL:"heading-l",headingXL:"heading-xl",heading2XL:"heading-2xl"};const Z=({font:o,customFontSizes:t})=>{if(Boolean(o)){document.documentElement.style.setProperty("--cpsl-default-font",o)}Object.entries(U).forEach((([o,n])=>{if(t===null||t===void 0?void 0:t[o]){document.documentElement.style.setProperty(`--cpsl-font-size-${n}`,t[o])}else{document.documentElement.style.removeProperty(`--cpsl-font-size-${n}`)}}))};const G=({foregroundColor:r,backgroundColor:e,customPalette:c})=>{if(!Boolean(r)||!I(r)){r=o.foregroundColor}if(!Boolean(e)||!I(e)){e=o.backgroundColor}const s=!x(e);const u={foregroundColors:[],backgroundColors:[],isDarkBackground:s};const d=s?"#FFFFFF":"#000000";const l=s?"#000000":"#FFFFFF";t.forEach((o=>{u.foregroundColors.push(z(r,l,o));u.backgroundColors.push(z(e,d,o))}));document.documentElement.style.setProperty("--cpsl-color-background-0",u.backgroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-background-4",u.backgroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-background-8",u.backgroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-background-16",u.backgroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-background-32",u.backgroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-background-48",u.backgroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-background-64",u.backgroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-background-80",u.backgroundColors[7]);document.documentElement.style.setProperty("--cpsl-color-background-96",u.backgroundColors[8]);document.documentElement.style.setProperty("--cpsl-color-foreground-0",u.foregroundColors[0]);document.documentElement.style.setProperty("--cpsl-color-foreground-4",u.foregroundColors[1]);document.documentElement.style.setProperty("--cpsl-color-foreground-8",u.foregroundColors[2]);document.documentElement.style.setProperty("--cpsl-color-foreground-16",u.foregroundColors[3]);document.documentElement.style.setProperty("--cpsl-color-foreground-32",u.foregroundColors[4]);document.documentElement.style.setProperty("--cpsl-color-foreground-48",u.foregroundColors[5]);document.documentElement.style.setProperty("--cpsl-color-foreground-64",u.foregroundColors[6]);document.documentElement.style.setProperty("--cpsl-color-foreground-80",u.foregroundColors[7]);document.documentElement.style.setProperty("--cpsl-color-foreground-96",u.foregroundColors[8]);const a="#FFFFFF";const i=.72;const _=D(r,n.red);const p=D(r,n.yellow);const f=D(r,n.green);document.documentElement.style.setProperty("--cpsl-color-utility-red",_);document.documentElement.style.setProperty("--cpsl-color-utility-yellow",p);document.documentElement.style.setProperty("--cpsl-color-utility-green",f);document.documentElement.style.setProperty("--cpsl-color-utility-red-light",z(_,a,i));document.documentElement.style.setProperty("--cpsl-color-utility-yellow-light",z(p,a,i));document.documentElement.style.setProperty("--cpsl-color-utility-green-light",z(f,a,i));if(Boolean(c)){const o=E(c);Object.entries(o).forEach((([o,t])=>document.documentElement.style.setProperty(o,t)))}return u};const H=({foregroundColor:t=o.foregroundColor,backgroundColor:n=o.backgroundColor,font:r,customPalette:e,borderRadius:c,customFontSizes:s,customBorderRadii:u})=>{const d=G({foregroundColor:t,backgroundColor:n,customPalette:e});Z({font:r,customFontSizes:s});N({borderRadius:c,customBorderRadii:u});return d.isDarkBackground};export{H as generateTheme};
 //# sourceMappingURL=index.esm.js.map