@usecapsule/core-components 2.0.2 → 2.0.4-dev.dropdown

package/dist/collection/interface.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=interface.js.map

package/dist/collection/interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interface.js","sourceRoot":"","sources":["../../src/interface.ts"],"names":[],"mappings":"","sourcesContent":["import { Icons } from './assets/icons';\n\nexport type PredefinedColors = 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';\n\n// From: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete\nexport type AutocompleteTypes =\n  | 'on'\n  | 'off'\n  | 'name'\n  | 'honorific-prefix'\n  | 'given-name'\n  | 'additional-name'\n  | 'family-name'\n  | 'honorific-suffix'\n  | 'nickname'\n  | 'email'\n  | 'username'\n  | 'new-password'\n  | 'current-password'\n  | 'one-time-code'\n  | 'organization-title'\n  | 'organization'\n  | 'street-address'\n  | 'address-line1'\n  | 'address-line2'\n  | 'address-line3'\n  | 'address-level4'\n  | 'address-level3'\n  | 'address-level2'\n  | 'address-level1'\n  | 'country'\n  | 'country-name'\n  | 'postal-code'\n  | 'cc-name'\n  | 'cc-given-name'\n  | 'cc-additional-name'\n  | 'cc-family-name'\n  | 'cc-family-name'\n  | 'cc-number'\n  | 'cc-exp'\n  | 'cc-exp-month'\n  | 'cc-exp-year'\n  | 'cc-csc'\n  | 'cc-type'\n  | 'transaction-currency'\n  | 'transaction-amount'\n  | 'language'\n  | 'bday'\n  | 'bday-day'\n  | 'bday-month'\n  | 'bday-year'\n  | 'sex'\n  | 'tel'\n  | 'tel-country-code'\n  | 'tel-national'\n  | 'tel-area-code'\n  | 'tel-local'\n  | 'tel-extension'\n  | 'impp'\n  | 'url'\n  | 'photo';\n\nexport type TextFieldTypes = 'date' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' | 'time' | 'week' | 'month' | 'datetime-local';\n\nexport type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);\n\nexport type Color = LiteralUnion<PredefinedColors, string>;\n\nexport type CssClassMap = { [className: string]: boolean };\n\nexport type IconType = keyof typeof Icons;\n\nexport type Theme = {\n  foregroundColor?: string;\n  backgroundColor?: string;\n  borderRadius?: BorderRadius;\n  font?: string;\n  customPalette?: CustomPalette;\n  customFontSizes?: CustomFontSizes;\n};\n\nexport type BorderRadius = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'full';\n\nexport interface CustomFontSizes {\n  body2XS?: string;\n  bodyXS?: string;\n  bodyS?: string;\n  bodyM?: string;\n  bodyL?: string;\n  bodyXL?: string;\n  headingXS?: string;\n  headingS?: string;\n  headingM?: string;\n  headingL?: string;\n  headingXL?: string;\n  heading2XL?: string;\n}\n\nexport interface CustomPalette {\n  text?: {\n    primary?: string;\n    secondary?: string;\n    subtle?: string;\n    inverted?: string;\n    error?: string;\n  };\n  modal?: {\n    surface?: {\n      main?: string;\n      footer?: string;\n    };\n    border?: string;\n  };\n  input?: {\n    surface?: {\n      disabled?: string;\n      default?: string;\n    };\n    border?: {\n      placeholder?: string;\n      active?: string;\n      error?: string;\n    };\n  };\n  tileButton?: {\n    surface?: {\n      default?: string;\n      hover?: string;\n      pressed?: string;\n    };\n    border?: string;\n  };\n  primaryButton?: {\n    surface?: {\n      default?: string;\n      hover?: string;\n      pressed?: string;\n      disabled?: string;\n    };\n    border?: {\n      default?: string;\n      disabled?: string;\n    };\n    outline?: string;\n  };\n  secondaryButton?: {\n    surface?: {\n      default?: string;\n      hover?: string;\n      pressed?: string;\n      disabled?: string;\n    };\n    border?: {\n      default?: string;\n      disabled?: string;\n    };\n    outline?: string;\n  };\n  divider?: string;\n  spinner?: {\n    path?: string;\n    circle?: string;\n  };\n  pill?: {\n    text?: string;\n    container?: {\n      background?: string;\n      border?: string;\n    };\n  };\n  progressIndicator?: {\n    active?: string;\n    next?: string;\n    previous?: string;\n  };\n  qr?: {\n    fill?: string;\n    background?: string;\n    border?: string;\n  };\n  slideButton?: {\n    slider?: {\n      background?: string;\n      border?: string;\n      text?: string;\n      container?: {\n        start?: {\n          background?: string;\n          border?: string;\n        };\n        end?: {\n          background?: string;\n          border?: string;\n        };\n      };\n    };\n    start?: {\n      text?: string;\n    };\n    end?: {\n      text?: string;\n    };\n  };\n  alert?: {\n    surface?: {\n      error?: string;\n    };\n    border?: {\n      error?: string;\n    };\n  };\n}\n"]}

package/dist/collection/utils/media.js

@@ -0,0 +1,18 @@
+export const SIZE_TO_MEDIA = {
+    xs: '(min-width: 0px)',
+    sm: '(min-width: 576px)',
+    md: '(min-width: 768px)',
+    lg: '(min-width: 992px)',
+    xl: '(min-width: 1200px)',
+};
+export const matchBreakpoint = (breakpoint) => {
+    if (breakpoint === undefined || breakpoint === '') {
+        return true;
+    }
+    if (window.matchMedia) {
+        const mediaQuery = SIZE_TO_MEDIA[breakpoint];
+        return window.matchMedia(mediaQuery).matches;
+    }
+    return false;
+};
+//# sourceMappingURL=media.js.map

package/dist/collection/utils/media.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media.js","sourceRoot":"","sources":["../../../src/utils/media.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAQ;IAChC,EAAE,EAAE,kBAAkB;IACtB,EAAE,EAAE,oBAAoB;IACxB,EAAE,EAAE,oBAAoB;IACxB,EAAE,EAAE,oBAAoB;IACxB,EAAE,EAAE,qBAAqB;CAC1B,CAAC;AAKF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,UAA8B,EAAE,EAAE;IAChE,IAAI,UAAU,KAAK,SAAS,IAAI,UAAU,KAAK,EAAE,EAAE,CAAC;QAClD,OAAO,IAAI,CAAC;IACd,CAAC;IACD,IAAK,MAAc,CAAC,UAAU,EAAE,CAAC;QAC/B,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;QAC7C,OAAO,MAAM,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC;IAC/C,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC,CAAC","sourcesContent":["export const SIZE_TO_MEDIA: any = {\n  xs: '(min-width: 0px)',\n  sm: '(min-width: 576px)',\n  md: '(min-width: 768px)',\n  lg: '(min-width: 992px)',\n  xl: '(min-width: 1200px)',\n};\n\n// Check if the window matches the media query\n// at the breakpoint passed\n// e.g. matchBreakpoint('sm') => true if screen width exceeds 576px\nexport const matchBreakpoint = (breakpoint: string | undefined) => {\n  if (breakpoint === undefined || breakpoint === '') {\n    return true;\n  }\n  if ((window as any).matchMedia) {\n    const mediaQuery = SIZE_TO_MEDIA[breakpoint];\n    return window.matchMedia(mediaQuery).matches;\n  }\n  return false;\n};\n"]}

package/dist/collection/utils/theme/generateBorderRadii.js

@@ -0,0 +1,56 @@
+export const generateBorderRadii = ({ borderRadius }) => {
+    if (!Boolean(borderRadius)) {
+        return;
+    }
+    let smallRadius = 8;
+    let mediumRadius = 16;
+    let largeRadius = 24;
+    const fullRadius = 1000;
+    let isFull = false;
+    let isNone = false;
+    switch (borderRadius) {
+        case 'none': {
+            isNone = true;
+            smallRadius = 0;
+            mediumRadius = 0;
+            largeRadius = 0;
+            break;
+        }
+        case 'xs': {
+            smallRadius = 4;
+            mediumRadius = 12;
+            largeRadius = 20;
+            break;
+        }
+        case 'md': {
+            smallRadius = 12;
+            mediumRadius = 20;
+            largeRadius = 28;
+            break;
+        }
+        case 'lg': {
+            smallRadius = 16;
+            mediumRadius = 24;
+            largeRadius = 32;
+            break;
+        }
+        case 'full': {
+            smallRadius = 16;
+            mediumRadius = 24;
+            largeRadius = 32;
+            isFull = true;
+            break;
+        }
+    }
+    document.documentElement.style.setProperty('--cpsl-border-radius-input', `${isFull ? fullRadius : smallRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-alert', `${smallRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-tabs', `${isFull ? fullRadius : smallRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-primary-button', `${isFull ? fullRadius : smallRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-secondary-button', `${isFull ? fullRadius : smallRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-tile-button', `${smallRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-modal', `${mediumRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-pill', `${isNone ? 0 : fullRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-qr-code', `${largeRadius}px`);
+    document.documentElement.style.setProperty('--cpsl-border-radius-info-box', `${smallRadius}px`);
+};
+//# sourceMappingURL=generateBorderRadii.js.map

package/dist/collection/utils/theme/generateBorderRadii.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateBorderRadii.js","sourceRoot":"","sources":["../../../../src/utils/theme/generateBorderRadii.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,EAAE,YAAY,EAA+B,EAAE,EAAE;IACnF,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,CAAC;QAC3B,OAAO;IACT,CAAC;IAED,IAAI,WAAW,GAAG,CAAC,CAAC;IACpB,IAAI,YAAY,GAAG,EAAE,CAAC;IACtB,IAAI,WAAW,GAAG,EAAE,CAAC;IACrB,MAAM,UAAU,GAAG,IAAI,CAAC;IACxB,IAAI,MAAM,GAAG,KAAK,CAAC;IACnB,IAAI,MAAM,GAAG,KAAK,CAAC;IAEnB,QAAQ,YAAY,EAAE,CAAC;QACrB,KAAK,MAAM,CAAC,CAAC,CAAC;YACZ,MAAM,GAAG,IAAI,CAAC;YACd,WAAW,GAAG,CAAC,CAAC;YAChB,YAAY,GAAG,CAAC,CAAC;YACjB,WAAW,GAAG,CAAC,CAAC;YAChB,MAAM;QACR,CAAC;QACD,KAAK,IAAI,CAAC,CAAC,CAAC;YACV,WAAW,GAAG,CAAC,CAAC;YAChB,YAAY,GAAG,EAAE,CAAC;YAClB,WAAW,GAAG,EAAE,CAAC;YACjB,MAAM;QACR,CAAC;QACD,KAAK,IAAI,CAAC,CAAC,CAAC;YACV,WAAW,GAAG,EAAE,CAAC;YACjB,YAAY,GAAG,EAAE,CAAC;YAClB,WAAW,GAAG,EAAE,CAAC;YACjB,MAAM;QACR,CAAC;QACD,KAAK,IAAI,CAAC,CAAC,CAAC;YACV,WAAW,GAAG,EAAE,CAAC;YACjB,YAAY,GAAG,EAAE,CAAC;YAClB,WAAW,GAAG,EAAE,CAAC;YACjB,MAAM;QACR,CAAC;QACD,KAAK,MAAM,CAAC,CAAC,CAAC;YACZ,WAAW,GAAG,EAAE,CAAC;YACjB,YAAY,GAAG,EAAE,CAAC;YAClB,WAAW,GAAG,EAAE,CAAC;YACjB,MAAM,GAAG,IAAI,CAAC;YACd,MAAM;QACR,CAAC;IACH,CAAC;IAED,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC;IACnH,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,WAAW,IAAI,CAAC,CAAC;IAC7F,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,2BAA2B,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC;IAClH,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,qCAAqC,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC;IAC5H,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,uCAAuC,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC;IAC9H,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,kCAAkC,EAAE,GAAG,WAAW,IAAI,CAAC,CAAC;IACnG,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,YAAY,IAAI,CAAC,CAAC;IAC9F,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,2BAA2B,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,CAAC;IACxG,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,8BAA8B,EAAE,GAAG,WAAW,IAAI,CAAC,CAAC;IAC/F,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,+BAA+B,EAAE,GAAG,WAAW,IAAI,CAAC,CAAC;AAClG,CAAC,CAAC","sourcesContent":["import { Theme } from '../../interface';\n\nexport const generateBorderRadii = ({ borderRadius }: Pick<Theme, 'borderRadius'>) => {\n  if (!Boolean(borderRadius)) {\n    return;\n  }\n\n  let smallRadius = 8;\n  let mediumRadius = 16;\n  let largeRadius = 24;\n  const fullRadius = 1000;\n  let isFull = false;\n  let isNone = false;\n\n  switch (borderRadius) {\n    case 'none': {\n      isNone = true;\n      smallRadius = 0;\n      mediumRadius = 0;\n      largeRadius = 0;\n      break;\n    }\n    case 'xs': {\n      smallRadius = 4;\n      mediumRadius = 12;\n      largeRadius = 20;\n      break;\n    }\n    case 'md': {\n      smallRadius = 12;\n      mediumRadius = 20;\n      largeRadius = 28;\n      break;\n    }\n    case 'lg': {\n      smallRadius = 16;\n      mediumRadius = 24;\n      largeRadius = 32;\n      break;\n    }\n    case 'full': {\n      smallRadius = 16;\n      mediumRadius = 24;\n      largeRadius = 32;\n      isFull = true;\n      break;\n    }\n  }\n\n  document.documentElement.style.setProperty('--cpsl-border-radius-input', `${isFull ? fullRadius : smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-alert', `${smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-tabs', `${isFull ? fullRadius : smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-primary-button', `${isFull ? fullRadius : smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-secondary-button', `${isFull ? fullRadius : smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-tile-button', `${smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-modal', `${mediumRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-pill', `${isNone ? 0 : fullRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-qr-code', `${largeRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-info-box', `${smallRadius}px`);\n};\n"]}

package/dist/collection/utils/theme/generateFont.js

@@ -0,0 +1,28 @@
+const FONT_NAME_MAP = {
+    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',
+};
+export const generateFont = ({ font, customFontSizes }) => {
+    if (Boolean(font)) {
+        document.documentElement.style.setProperty('--cpsl-default-font', font);
+    }
+    Object.entries(FONT_NAME_MAP).forEach(([key, value]) => {
+        if (customFontSizes === null || customFontSizes === void 0 ? void 0 : customFontSizes[key]) {
+            document.documentElement.style.setProperty(`--cpsl-font-size-${value}`, customFontSizes[key]);
+        }
+        else {
+            document.documentElement.style.removeProperty(`--cpsl-font-size-${value}`);
+        }
+    });
+};
+//# sourceMappingURL=generateFont.js.map

package/dist/collection/utils/theme/generateFont.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateFont.js","sourceRoot":"","sources":["../../../../src/utils/theme/generateFont.ts"],"names":[],"mappings":"AAEA,MAAM,aAAa,GAAG;IACpB,OAAO,EAAE,UAAU;IACnB,MAAM,EAAE,SAAS;IACjB,KAAK,EAAE,QAAQ;IACf,KAAK,EAAE,QAAQ;IACf,KAAK,EAAE,QAAQ;IACf,MAAM,EAAE,SAAS;IACjB,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,WAAW;IACrB,QAAQ,EAAE,WAAW;IACrB,QAAQ,EAAE,WAAW;IACrB,SAAS,EAAE,YAAY;IACvB,UAAU,EAAE,aAAa;CAC1B,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,eAAe,EAA2C,EAAE,EAAE;IACjG,IAAI,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC;QAClB,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,qBAAqB,EAAE,IAAI,CAAC,CAAC;IAC1E,CAAC;IAED,MAAM,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;QACrD,IAAI,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAG,GAAG,CAAC,EAAE,CAAC;YAC3B,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,KAAK,EAAE,EAAE,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC;QAChG,CAAC;aAAM,CAAC;YACN,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,cAAc,CAAC,oBAAoB,KAAK,EAAE,CAAC,CAAC;QAC7E,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["import { Theme } from '../../interface';\n\nconst FONT_NAME_MAP = {\n  body2XS: 'body-2xs',\n  bodyXS: 'body-xs',\n  bodyS: 'body-s',\n  bodyM: 'body-m',\n  bodyL: 'body-l',\n  bodyXL: 'body-xl',\n  headingXS: 'heading-xs',\n  headingS: 'heading-s',\n  headingM: 'heading-m',\n  headingL: 'heading-l',\n  headingXL: 'heading-xl',\n  heading2XL: 'heading-2xl',\n};\n\nexport const generateFont = ({ font, customFontSizes }: Pick<Theme, 'font' | 'customFontSizes'>) => {\n  if (Boolean(font)) {\n    document.documentElement.style.setProperty('--cpsl-default-font', font);\n  }\n\n  Object.entries(FONT_NAME_MAP).forEach(([key, value]) => {\n    if (customFontSizes?.[key]) {\n      document.documentElement.style.setProperty(`--cpsl-font-size-${value}`, customFontSizes[key]);\n    } else {\n      document.documentElement.style.removeProperty(`--cpsl-font-size-${value}`);\n    }\n  });\n};\n"]}

package/dist/collection/utils/theme/generatePalette.js

@@ -0,0 +1,46 @@
+import { mix, readableColorIsBlack } from "color2k";
+import { getCssColors, isColor } from "./utils";
+import { DEFAULT_THEME } from "../../constants";
+const MIXES = [0, 0.08, 0.16, 0.32, 0.48, 0.64, 0.8, 0.96];
+export const generatePalette = ({ foregroundColor, backgroundColor, customPalette }) => {
+    if (!Boolean(foregroundColor) || !isColor(foregroundColor)) {
+        foregroundColor = DEFAULT_THEME.foregroundColor;
+    }
+    if (!Boolean(backgroundColor) || !isColor(backgroundColor)) {
+        backgroundColor = DEFAULT_THEME.backgroundColor;
+    }
+    const isDarkBackground = !readableColorIsBlack(backgroundColor);
+    const palette = {
+        foregroundColors: [],
+        backgroundColors: [],
+        isDarkBackground,
+    };
+    const backgroundMixColor = isDarkBackground ? '#FFFFFF' : '#000000';
+    const foregroundMixColor = isDarkBackground ? '#000000' : '#FFFFFF';
+    MIXES.forEach(value => {
+        palette.foregroundColors.push(mix(foregroundColor, foregroundMixColor, value));
+        palette.backgroundColors.push(mix(backgroundColor, backgroundMixColor, value));
+    });
+    document.documentElement.style.setProperty('--cpsl-color-background-0', palette.backgroundColors[0]);
+    document.documentElement.style.setProperty('--cpsl-color-background-8', palette.backgroundColors[1]);
+    document.documentElement.style.setProperty('--cpsl-color-background-16', palette.backgroundColors[2]);
+    document.documentElement.style.setProperty('--cpsl-color-background-32', palette.backgroundColors[3]);
+    document.documentElement.style.setProperty('--cpsl-color-background-48', palette.backgroundColors[4]);
+    document.documentElement.style.setProperty('--cpsl-color-background-64', palette.backgroundColors[5]);
+    document.documentElement.style.setProperty('--cpsl-color-background-80', palette.backgroundColors[6]);
+    document.documentElement.style.setProperty('--cpsl-color-background-96', palette.backgroundColors[7]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-0', palette.foregroundColors[0]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-8', palette.foregroundColors[1]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-16', palette.foregroundColors[2]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-32', palette.foregroundColors[3]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-48', palette.foregroundColors[4]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-64', palette.foregroundColors[5]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-80', palette.foregroundColors[6]);
+    document.documentElement.style.setProperty('--cpsl-color-foreground-96', palette.foregroundColors[7]);
+    if (Boolean(customPalette)) {
+        const cssColorVars = getCssColors(customPalette);
+        Object.entries(cssColorVars).forEach(([k, v]) => document.documentElement.style.setProperty(k, v));
+    }
+    return palette;
+};
+//# sourceMappingURL=generatePalette.js.map

package/dist/collection/utils/theme/generatePalette.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generatePalette.js","sourceRoot":"","sources":["../../../../src/utils/theme/generatePalette.ts"],"names":[],"mappings":"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","sourcesContent":["import { mix, readableColorIsBlack } from 'color2k';\nimport { Theme } from '../../interface';\nimport { getCssColors, isColor } from './utils';\nimport { DEFAULT_THEME } from '../../constants';\n\nexport type Palette = {\n  foregroundColors: string[];\n  backgroundColors: string[];\n  isDarkBackground: boolean;\n};\n\nconst MIXES = [0, 0.08, 0.16, 0.32, 0.48, 0.64, 0.8, 0.96];\n\nexport const generatePalette = ({ foregroundColor, backgroundColor, customPalette }: Pick<Theme, 'foregroundColor' | 'backgroundColor' | 'customPalette'>): Palette => {\n  if (!Boolean(foregroundColor) || !isColor(foregroundColor)) {\n    foregroundColor = DEFAULT_THEME.foregroundColor;\n  }\n  if (!Boolean(backgroundColor) || !isColor(backgroundColor)) {\n    backgroundColor = DEFAULT_THEME.backgroundColor;\n  }\n\n  const isDarkBackground = !readableColorIsBlack(backgroundColor);\n\n  const palette: Palette = {\n    foregroundColors: [],\n    backgroundColors: [],\n    isDarkBackground,\n  };\n\n  const backgroundMixColor = isDarkBackground ? '#FFFFFF' : '#000000';\n  const foregroundMixColor = isDarkBackground ? '#000000' : '#FFFFFF';\n\n  MIXES.forEach(value => {\n    palette.foregroundColors.push(mix(foregroundColor, foregroundMixColor, value));\n    palette.backgroundColors.push(mix(backgroundColor, backgroundMixColor, value));\n  });\n\n  // BACKGROUND\n  document.documentElement.style.setProperty('--cpsl-color-background-0', palette.backgroundColors[0]);\n  document.documentElement.style.setProperty('--cpsl-color-background-8', palette.backgroundColors[1]);\n  document.documentElement.style.setProperty('--cpsl-color-background-16', palette.backgroundColors[2]);\n  document.documentElement.style.setProperty('--cpsl-color-background-32', palette.backgroundColors[3]);\n  document.documentElement.style.setProperty('--cpsl-color-background-48', palette.backgroundColors[4]);\n  document.documentElement.style.setProperty('--cpsl-color-background-64', palette.backgroundColors[5]);\n  document.documentElement.style.setProperty('--cpsl-color-background-80', palette.backgroundColors[6]);\n  document.documentElement.style.setProperty('--cpsl-color-background-96', palette.backgroundColors[7]);\n\n  // FOREGROUND\n  document.documentElement.style.setProperty('--cpsl-color-foreground-0', palette.foregroundColors[0]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-8', palette.foregroundColors[1]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-16', palette.foregroundColors[2]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-32', palette.foregroundColors[3]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-48', palette.foregroundColors[4]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-64', palette.foregroundColors[5]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-80', palette.foregroundColors[6]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-96', palette.foregroundColors[7]);\n\n  if (Boolean(customPalette)) {\n    const cssColorVars = getCssColors(customPalette);\n    Object.entries(cssColorVars).forEach(([k, v]) => document.documentElement.style.setProperty(k, v));\n  }\n\n  return palette;\n};\n"]}

package/dist/collection/utils/theme/generateTheme.js

@@ -0,0 +1,11 @@
+import { DEFAULT_THEME } from "../../constants";
+import { generateBorderRadii } from "./generateBorderRadii";
+import { generateFont } from "./generateFont";
+import { generatePalette } from "./generatePalette";
+export const generateTheme = ({ foregroundColor = DEFAULT_THEME.foregroundColor, backgroundColor = DEFAULT_THEME.backgroundColor, font, customPalette, borderRadius, customFontSizes, }) => {
+    const palette = generatePalette({ foregroundColor, backgroundColor, customPalette });
+    generateFont({ font, customFontSizes });
+    generateBorderRadii({ borderRadius });
+    return palette.isDarkBackground;
+};
+//# sourceMappingURL=generateTheme.js.map

package/dist/collection/utils/theme/generateTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateTheme.js","sourceRoot":"","sources":["../../../../src/utils/theme/generateTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAMpD,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,eAAe,GAAG,aAAa,CAAC,eAAe,EAC/C,eAAe,GAAG,aAAa,CAAC,eAAe,EAC/C,IAAI,EACJ,aAAa,EACb,YAAY,EACZ,eAAe,GACT,EAAW,EAAE;IACnB,MAAM,OAAO,GAAG,eAAe,CAAC,EAAE,eAAe,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC,CAAC;IAErF,YAAY,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC,CAAC;IAExC,mBAAmB,CAAC,EAAE,YAAY,EAAE,CAAC,CAAC;IAEtC,OAAO,OAAO,CAAC,gBAAgB,CAAC;AAClC,CAAC,CAAC","sourcesContent":["import { DEFAULT_THEME } from '../../constants';\nimport { Theme } from '../../interface';\nimport { generateBorderRadii } from './generateBorderRadii';\nimport { generateFont } from './generateFont';\nimport { generatePalette } from './generatePalette';\n\n/**\n * Generates css theme variables.\n * @returns @boolean Whether background is dark or not.\n */\nexport const generateTheme = ({\n  foregroundColor = DEFAULT_THEME.foregroundColor,\n  backgroundColor = DEFAULT_THEME.backgroundColor,\n  font,\n  customPalette,\n  borderRadius,\n  customFontSizes,\n}: Theme): boolean => {\n  const palette = generatePalette({ foregroundColor, backgroundColor, customPalette });\n\n  generateFont({ font, customFontSizes });\n\n  generateBorderRadii({ borderRadius });\n\n  return palette.isDarkBackground;\n};\n"]}

package/dist/collection/utils/theme/utils.js

@@ -0,0 +1,21 @@
+export const isColor = strColor => {
+    const s = new Option().style;
+    s.color = strColor;
+    return s.color !== '';
+};
+const toKebabCase = (pascal) => pascal.replace(/([a-z0–9])([A-Z])/g, '$1-$2').toLowerCase();
+const buildVars = (prev, obj) => {
+    let resp = {};
+    for (const k in obj) {
+        const name = `${prev}-${toKebabCase(k)}`;
+        if (typeof obj[k] === 'object' && obj[k] !== null) {
+            resp = Object.assign(Object.assign({}, resp), buildVars(name, obj[k]));
+        }
+        else {
+            resp[name] = obj[k];
+        }
+    }
+    return resp;
+};
+export const getCssColors = (customPalette) => buildVars('--cpsl-color', customPalette);
+//# sourceMappingURL=utils.js.map

package/dist/collection/utils/theme/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/utils/theme/utils.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,EAAE;IAChC,MAAM,CAAC,GAAG,IAAI,MAAM,EAAE,CAAC,KAAK,CAAC;IAC7B,CAAC,CAAC,KAAK,GAAG,QAAQ,CAAC;IACnB,OAAO,CAAC,CAAC,KAAK,KAAK,EAAE,CAAC;AACxB,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,MAAc,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,oBAAoB,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC;AAGpG,MAAM,SAAS,GAAG,CAAC,IAAY,EAAE,GAAQ,EAA2B,EAAE;IACpE,IAAI,IAAI,GAAG,EAAE,CAAC;IAEd,KAAK,MAAM,CAAC,IAAI,GAAG,EAAE,CAAC;QACpB,MAAM,IAAI,GAAG,GAAG,IAAI,IAAI,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;QACzC,IAAI,OAAO,GAAG,CAAC,CAAC,CAAC,KAAK,QAAQ,IAAI,GAAG,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC;YAClD,IAAI,mCAAQ,IAAI,GAAK,SAAS,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAE,CAAC;QACjD,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC;IACH,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,aAA4B,EAA2B,EAAE,CAAC,SAAS,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC","sourcesContent":["import { CustomPalette } from '../../interface';\n\nexport const isColor = strColor => {\n  const s = new Option().style;\n  s.color = strColor;\n  return s.color !== '';\n};\n\nconst toKebabCase = (pascal: string) => pascal.replace(/([a-z0–9])([A-Z])/g, '$1-$2').toLowerCase();\n\n// This function handles arrays and objects\nconst buildVars = (prev: string, obj: any): { [k: string]: string } => {\n  let resp = {};\n\n  for (const k in obj) {\n    const name = `${prev}-${toKebabCase(k)}`;\n    if (typeof obj[k] === 'object' && obj[k] !== null) {\n      resp = { ...resp, ...buildVars(name, obj[k]) };\n    } else {\n      resp[name] = obj[k];\n    }\n  }\n\n  return resp;\n};\n\nexport const getCssColors = (customPalette: CustomPalette): { [k: string]: string } => buildVars('--cpsl-color', customPalette);\n"]}

package/dist/esm/_commonjsHelpers-1789f0cf.js

@@ -0,0 +1,9 @@
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+export { commonjsGlobal as c, getDefaultExportFromCjs as g };
+
+//# sourceMappingURL=_commonjsHelpers-1789f0cf.js.map

package/dist/esm/_commonjsHelpers-1789f0cf.js.map

@@ -0,0 +1 @@
+{"file":"_commonjsHelpers-1789f0cf.js","mappings":";;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/esm/capsule.js

@@ -0,0 +1,22 @@
+import { p as promiseResolve, b as bootstrapLazy } from './index-f00e090c.js';
+export { s as setNonce } from './index-f00e090c.js';
+import { g as globalScripts } from './app-globals-0f993ce5.js';
+
+/*
+ Stencil Client Patch Browser v4.12.5 | MIT Licensed | https://stenciljs.com
+ */
+const patchBrowser = () => {
+    const importMeta = import.meta.url;
+    const opts = {};
+    if (importMeta !== '') {
+        opts.resourcesUrl = new URL('.', importMeta).href;
+    }
+    return promiseResolve(opts);
+};
+
+patchBrowser().then(async (options) => {
+  await globalScripts();
+  return bootstrapLazy([["cpsl-animation",[[1,"cpsl-animation",{"src":[1],"replayAnimation":[64]}]]],["cpsl-col",[[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"]]]]],["cpsl-grid",[[1,"cpsl-grid",{"fixed":[4]}]]],["cpsl-info-box",[[1,"cpsl-info-box"]]],["cpsl-row",[[1,"cpsl-row"]]],["cpsl-alert_18",[[1,"cpsl-code-input",{"code":[1025],"errorText":[1,"error-text"],"helperText":[1,"helper-text"],"length":[2],"type":[1]}],[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],"spellcheck":[4],"startIconSrc":[1,"start-icon-src"],"startIcon":[1,"start-icon"],"step":[1],"type":[1],"value":[1025],"hasFocus":[32]},null,{"disabled":["handleDisable"]}],[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],"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-tile-button",{"src":[1],"icon":[1]}],[1,"cpsl-alert",{"type":[1],"icon":[1]}],[1,"cpsl-button",{"disabled":[516],"variant":[513]}],[1,"cpsl-divider"],[1,"cpsl-dropdown",{"width":[1],"items":[16],"isOpen":[32],"selectedItem":[32]},null,{"isOpen":["handleOpenChange"]}],[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-spinner",{"size":[2],"speed":[2]}],[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-text",{"color":[1],"variant":[1],"weight":[1]}],[1,"cpsl-overlay",{"open":[4],"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"]},null,{"open":["toggleHeight"]}],[1,"cpsl-icon",{"src":[1],"icon":[1]}]]]], options);
+});
+
+//# sourceMappingURL=capsule.js.map

package/dist/esm/capsule.js.map

@@ -0,0 +1 @@
+{"file":"capsule.js","mappings":";;;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAa3B,IAAI,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC,IAAI,MAAM,IAAI,GAAiE,EAAE,CAAC;AAClF,IAAI,IAAI,UAAU,KAAK,EAAE,EAAE;AAC3B,QAAQ,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AAC1D,KAAK;AACL,IAAI,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;ACpBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE,CAAC;AACxB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC","names":[],"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"],"version":3}