@usecapsule/core-components 2.0.10 → 3.0.1-dev.1

package/dist/capsule/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["generateBorderRadii","borderRadius","Boolean","smallRadius","mediumRadius","largeRadius","fullRadius","isFull","isNone","document","documentElement","style","setProperty","FONT_NAME_MAP","body2XS","bodyXS","bodyS","bodyM","bodyL","bodyXL","headingXS","headingS","headingM","headingL","headingXL","heading2XL","generateFont","font","customFontSizes","Object","entries","forEach","key","value","removeProperty","guard","low","high","Math","min","max","ColorError","Error","constructor","color","super","ColorError$1","parseToRgba","trim","toLowerCase","normalizedColor","namedColorRegex","test","nameToHex","reducedHexMatch","reducedHexRegex","exec","arr","Array","from","slice","map","x","parseInt","r","hexMatch","hexRegex","rgbaMatch","rgbaRegex","parseFloat","hslaMatch","hslaRegex","h","s","l","a","hslToRgb","Number","isNaN","hash","str","i","length","charCodeAt","colorToInt","replace","compressedColorMap","split","reduce","acc","next","substring","hex","toString","prefix","normalizedColorName","result","amount","join","RegExp","roundColor","round","hue","saturation","lightness","huePrime","chroma","abs","secondComponent","red","green","blue","lightnessModification","finalRed","finalGreen","finalBlue","getLuminance","f","channel","pow","g","b","rgba","alpha","toFixed","mix","color1","color2","weight","normalize","n","index","r1","g1","b1","a1","r2","g2","b2","a2","alphaDelta","normalizedWeight","combinedWeight","weight2","weight1","readableColorIsBlack","isColor","strColor","Option","toKebabCase","pascal","buildVars","prev","obj","resp","k","name","assign","getCssColors","customPalette","MIXES","generatePalette","foregroundColor","backgroundColor","DEFAULT_THEME","isDarkBackground","palette","foregroundColors","backgroundColors","backgroundMixColor","foregroundMixColor","push","cssColorVars","v","generateTheme"],"sources":["src/utils/theme/generateBorderRadii.ts","src/utils/theme/generateFont.ts","../node_modules/color2k/dist/index.module.es.js","src/utils/theme/utils.ts","src/utils/theme/generatePalette.ts","src/utils/theme/generateTheme.ts"],"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","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","/**\n * A simple guard function:\n *\n * ```js\n * Math.min(Math.max(low, value), high)\n * ```\n */\nfunction guard(low, high, value) {\n  return Math.min(Math.max(low, value), high);\n}\n\nclass ColorError extends Error {\n  constructor(color) {\n    super(`Failed to parse color: \"${color}\"`);\n  }\n}\nvar ColorError$1 = ColorError;\n\n/**\n * Parses a color into red, gree, blue, alpha parts\n *\n * @param color the input color. Can be a RGB, RBGA, HSL, HSLA, or named color\n */\nfunction parseToRgba(color) {\n  if (typeof color !== 'string') throw new ColorError$1(color);\n  if (color.trim().toLowerCase() === 'transparent') return [0, 0, 0, 0];\n  let normalizedColor = color.trim();\n  normalizedColor = namedColorRegex.test(color) ? nameToHex(color) : color;\n  const reducedHexMatch = reducedHexRegex.exec(normalizedColor);\n  if (reducedHexMatch) {\n    const arr = Array.from(reducedHexMatch).slice(1);\n    return [...arr.slice(0, 3).map(x => parseInt(r(x, 2), 16)), parseInt(r(arr[3] || 'f', 2), 16) / 255];\n  }\n  const hexMatch = hexRegex.exec(normalizedColor);\n  if (hexMatch) {\n    const arr = Array.from(hexMatch).slice(1);\n    return [...arr.slice(0, 3).map(x => parseInt(x, 16)), parseInt(arr[3] || 'ff', 16) / 255];\n  }\n  const rgbaMatch = rgbaRegex.exec(normalizedColor);\n  if (rgbaMatch) {\n    const arr = Array.from(rgbaMatch).slice(1);\n    return [...arr.slice(0, 3).map(x => parseInt(x, 10)), parseFloat(arr[3] || '1')];\n  }\n  const hslaMatch = hslaRegex.exec(normalizedColor);\n  if (hslaMatch) {\n    const [h, s, l, a] = Array.from(hslaMatch).slice(1).map(parseFloat);\n    if (guard(0, 100, s) !== s) throw new ColorError$1(color);\n    if (guard(0, 100, l) !== l) throw new ColorError$1(color);\n    return [...hslToRgb(h, s, l), Number.isNaN(a) ? 1 : a];\n  }\n  throw new ColorError$1(color);\n}\nfunction hash(str) {\n  let hash = 5381;\n  let i = str.length;\n  while (i) {\n    hash = hash * 33 ^ str.charCodeAt(--i);\n  }\n\n  /* JavaScript does bitwise operations (like XOR, above) on 32-bit signed\n   * integers. Since we want the results to be always positive, convert the\n   * signed int to an unsigned by doing an unsigned bitshift. */\n  return (hash >>> 0) % 2341;\n}\nconst colorToInt = x => parseInt(x.replace(/_/g, ''), 36);\nconst compressedColorMap = '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((acc, next) => {\n  const key = colorToInt(next.substring(0, 3));\n  const hex = colorToInt(next.substring(3)).toString(16);\n\n  // NOTE: padStart could be used here but it breaks Node 6 compat\n  // https://github.com/ricokahler/color2k/issues/351\n  let prefix = '';\n  for (let i = 0; i < 6 - hex.length; i++) {\n    prefix += '0';\n  }\n  acc[key] = `${prefix}${hex}`;\n  return acc;\n}, {});\n\n/**\n * Checks if a string is a CSS named color and returns its equivalent hex value, otherwise returns the original color.\n */\nfunction nameToHex(color) {\n  const normalizedColorName = color.toLowerCase().trim();\n  const result = compressedColorMap[hash(normalizedColorName)];\n  if (!result) throw new ColorError$1(color);\n  return `#${result}`;\n}\nconst r = (str, amount) => Array.from(Array(amount)).map(() => str).join('');\nconst reducedHexRegex = new RegExp(`^#${r('([a-f0-9])', 3)}([a-f0-9])?$`, 'i');\nconst hexRegex = new RegExp(`^#${r('([a-f0-9]{2})', 3)}([a-f0-9]{2})?$`, 'i');\nconst rgbaRegex = new RegExp(`^rgba?\\\\(\\\\s*(\\\\d+)\\\\s*${r(',\\\\s*(\\\\d+)\\\\s*', 2)}(?:,\\\\s*([\\\\d.]+))?\\\\s*\\\\)$`, 'i');\nconst hslaRegex = /^hsla?\\(\\s*([\\d.]+)\\s*,\\s*([\\d.]+)%\\s*,\\s*([\\d.]+)%(?:\\s*,\\s*([\\d.]+))?\\s*\\)$/i;\nconst namedColorRegex = /^[a-z]+$/i;\nconst roundColor = color => {\n  return Math.round(color * 255);\n};\nconst hslToRgb = (hue, saturation, lightness) => {\n  let l = lightness / 100;\n  if (saturation === 0) {\n    // achromatic\n    return [l, l, l].map(roundColor);\n  }\n\n  // formulae from https://en.wikipedia.org/wiki/HSL_and_HSV\n  const huePrime = (hue % 360 + 360) % 360 / 60;\n  const chroma = (1 - Math.abs(2 * l - 1)) * (saturation / 100);\n  const secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));\n  let red = 0;\n  let green = 0;\n  let blue = 0;\n  if (huePrime >= 0 && huePrime < 1) {\n    red = chroma;\n    green = secondComponent;\n  } else if (huePrime >= 1 && huePrime < 2) {\n    red = secondComponent;\n    green = chroma;\n  } else if (huePrime >= 2 && huePrime < 3) {\n    green = chroma;\n    blue = secondComponent;\n  } else if (huePrime >= 3 && huePrime < 4) {\n    green = secondComponent;\n    blue = chroma;\n  } else if (huePrime >= 4 && huePrime < 5) {\n    red = secondComponent;\n    blue = chroma;\n  } else if (huePrime >= 5 && huePrime < 6) {\n    red = chroma;\n    blue = secondComponent;\n  }\n  const lightnessModification = l - chroma / 2;\n  const finalRed = red + lightnessModification;\n  const finalGreen = green + lightnessModification;\n  const finalBlue = blue + lightnessModification;\n  return [finalRed, finalGreen, finalBlue].map(roundColor);\n};\n\n// taken from:\n// https://github.com/styled-components/polished/blob/a23a6a2bb26802b3d922d9c3b67bac3f3a54a310/src/internalHelpers/_rgbToHsl.js\n\n/**\n * Parses a color in hue, saturation, lightness, and the alpha channel.\n *\n * Hue is a number between 0 and 360, saturation, lightness, and alpha are\n * decimal percentages between 0 and 1\n */\nfunction parseToHsla(color) {\n  const [red, green, blue, alpha] = parseToRgba(color).map((value, index) =>\n  // 3rd index is alpha channel which is already normalized\n  index === 3 ? value : value / 255);\n  const max = Math.max(red, green, blue);\n  const min = Math.min(red, green, blue);\n  const lightness = (max + min) / 2;\n\n  // achromatic\n  if (max === min) return [0, 0, lightness, alpha];\n  const delta = max - min;\n  const saturation = lightness > 0.5 ? delta / (2 - max - min) : delta / (max + min);\n  const hue = 60 * (red === max ? (green - blue) / delta + (green < blue ? 6 : 0) : green === max ? (blue - red) / delta + 2 : (red - green) / delta + 4);\n  return [hue, saturation, lightness, alpha];\n}\n\n/**\n * Takes in hsla parts and constructs an hsla string\n *\n * @param hue The color circle (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue\n * @param saturation Percentage of saturation, given as a decimal between 0 and 1\n * @param lightness Percentage of lightness, given as a decimal between 0 and 1\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction hsla(hue, saturation, lightness, alpha) {\n  return `hsla(${(hue % 360).toFixed()}, ${guard(0, 100, saturation * 100).toFixed()}%, ${guard(0, 100, lightness * 100).toFixed()}%, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Adjusts the current hue of the color by the given degrees. Wraps around when\n * over 360.\n *\n * @param color input color\n * @param degrees degrees to adjust the input color, accepts degree integers\n * (0 - 360) and wraps around on overflow\n */\nfunction adjustHue(color, degrees) {\n  const [h, s, l, a] = parseToHsla(color);\n  return hsla(h + degrees, s, l, a);\n}\n\n/**\n * Darkens using lightness. This is equivalent to subtracting the lightness\n * from the L in HSL.\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction darken(color, amount) {\n  const [hue, saturation, lightness, alpha] = parseToHsla(color);\n  return hsla(hue, saturation, lightness - amount, alpha);\n}\n\n/**\n * Desaturates the input color by the given amount via subtracting from the `s`\n * in `hsla`.\n *\n * @param amount The amount to desaturate, given as a decimal between 0 and 1\n */\nfunction desaturate(color, amount) {\n  const [h, s, l, a] = parseToHsla(color);\n  return hsla(h, s - amount, l, a);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getLuminance.js\n\n/**\n * Returns a number (float) representing the luminance of a color.\n */\nfunction getLuminance(color) {\n  if (color === 'transparent') return 0;\n  function f(x) {\n    const channel = x / 255;\n    return channel <= 0.04045 ? channel / 12.92 : Math.pow((channel + 0.055) / 1.055, 2.4);\n  }\n  const [r, g, b] = parseToRgba(color);\n  return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getContrast.js\n\n/**\n * Returns the contrast ratio between two colors based on\n * [W3's recommended equation for calculating contrast](http://www.w3.org/TR/WCAG20/#contrast-ratiodef).\n */\nfunction getContrast(color1, color2) {\n  const luminance1 = getLuminance(color1);\n  const luminance2 = getLuminance(color2);\n  return luminance1 > luminance2 ? (luminance1 + 0.05) / (luminance2 + 0.05) : (luminance2 + 0.05) / (luminance1 + 0.05);\n}\n\n/**\n * Takes in rgba parts and returns an rgba string\n *\n * @param red The amount of red in the red channel, given in a number between 0 and 255 inclusive\n * @param green The amount of green in the red channel, given in a number between 0 and 255 inclusive\n * @param blue The amount of blue in the red channel, given in a number between 0 and 255 inclusive\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction rgba(red, green, blue, alpha) {\n  return `rgba(${guard(0, 255, red).toFixed()}, ${guard(0, 255, green).toFixed()}, ${guard(0, 255, blue).toFixed()}, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Mixes two colors together. Taken from sass's implementation.\n */\nfunction mix(color1, color2, weight) {\n  const normalize = (n, index) =>\n  // 3rd index is alpha channel which is already normalized\n  index === 3 ? n : n / 255;\n  const [r1, g1, b1, a1] = parseToRgba(color1).map(normalize);\n  const [r2, g2, b2, a2] = parseToRgba(color2).map(normalize);\n\n  // The formula is copied from the original Sass implementation:\n  // http://sass-lang.com/documentation/Sass/Script/Functions.html#mix-instance_method\n  const alphaDelta = a2 - a1;\n  const normalizedWeight = weight * 2 - 1;\n  const combinedWeight = normalizedWeight * alphaDelta === -1 ? normalizedWeight : normalizedWeight + alphaDelta / (1 + normalizedWeight * alphaDelta);\n  const weight2 = (combinedWeight + 1) / 2;\n  const weight1 = 1 - weight2;\n  const r = (r1 * weight1 + r2 * weight2) * 255;\n  const g = (g1 * weight1 + g2 * weight2) * 255;\n  const b = (b1 * weight1 + b2 * weight2) * 255;\n  const a = a2 * weight + a1 * (1 - weight);\n  return rgba(r, g, b, a);\n}\n\n/**\n * Given a series colors, this function will return a `scale(x)` function that\n * accepts a percentage as a decimal between 0 and 1 and returns the color at\n * that percentage in the scale.\n *\n * ```js\n * const scale = getScale('red', 'yellow', 'green');\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(0.5)); // rgba(255, 255, 0, 1)\n * console.log(scale(1)); // rgba(0, 128, 0, 1)\n * ```\n *\n * If you'd like to limit the domain and range like chroma-js, we recommend\n * wrapping scale again.\n *\n * ```js\n * const _scale = getScale('red', 'yellow', 'green');\n * const scale = x => _scale(x / 100);\n *\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(50)); // rgba(255, 255, 0, 1)\n * console.log(scale(100)); // rgba(0, 128, 0, 1)\n * ```\n */\nfunction getScale(...colors) {\n  return n => {\n    const lastIndex = colors.length - 1;\n    const lowIndex = guard(0, lastIndex, Math.floor(n * lastIndex));\n    const highIndex = guard(0, lastIndex, Math.ceil(n * lastIndex));\n    const color1 = colors[lowIndex];\n    const color2 = colors[highIndex];\n    const unit = 1 / lastIndex;\n    const weight = (n - unit * lowIndex) / unit;\n    return mix(color1, color2, weight);\n  };\n}\n\nconst guidelines = {\n  decorative: 1.5,\n  readable: 3,\n  aa: 4.5,\n  aaa: 7\n};\n\n/**\n * Returns whether or not a color has bad contrast against a background\n * according to a given standard.\n */\nfunction hasBadContrast(color, standard = 'aa', background = '#fff') {\n  return getContrast(color, background) < guidelines[standard];\n}\n\n/**\n * Lightens a color by a given amount. This is equivalent to\n * `darken(color, -amount)`\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction lighten(color, amount) {\n  return darken(color, -amount);\n}\n\n/**\n * Takes in a color and makes it more transparent by convert to `rgba` and\n * decreasing the amount in the alpha channel.\n *\n * @param amount The amount to increase the transparency by, given as a decimal between 0 and 1\n */\nfunction transparentize(color, amount) {\n  const [r, g, b, a] = parseToRgba(color);\n  return rgba(r, g, b, a - amount);\n}\n\n/**\n * Takes a color and un-transparentizes it. Equivalent to\n * `transparentize(color, -amount)`\n *\n * @param amount The amount to increase the opacity by, given as a decimal between 0 and 1\n */\nfunction opacify(color, amount) {\n  return transparentize(color, -amount);\n}\n\n/**\n * An alternative function to `readableColor`. Returns whether or not the \n * readable color (i.e. the color to be place on top the input color) should be\n * black.\n */\nfunction readableColorIsBlack(color) {\n  return getLuminance(color) > 0.179;\n}\n\n/**\n * Returns black or white for best contrast depending on the luminosity of the\n * given color.\n */\nfunction readableColor(color) {\n  return readableColorIsBlack(color) ? '#000' : '#fff';\n}\n\n/**\n * Saturates a color by converting it to `hsl` and increasing the saturation\n * amount. Equivalent to `desaturate(color, -amount)`\n * \n * @param color Input color\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction saturate(color, amount) {\n  return desaturate(color, -amount);\n}\n\n/**\n * Takes in any color and returns it as a hex code.\n */\nfunction toHex(color) {\n  const [r, g, b, a] = parseToRgba(color);\n  let hex = x => {\n    const h = guard(0, 255, x).toString(16);\n    // NOTE: padStart could be used here but it breaks Node 6 compat\n    // https://github.com/ricokahler/color2k/issues/351\n    return h.length === 1 ? `0${h}` : h;\n  };\n  return `#${hex(r)}${hex(g)}${hex(b)}${a < 1 ? hex(Math.round(a * 255)) : ''}`;\n}\n\n/**\n * Takes in any color and returns it as an rgba string.\n */\nfunction toRgba(color) {\n  return rgba(...parseToRgba(color));\n}\n\n/**\n * Takes in any color and returns it as an hsla string.\n */\nfunction toHsla(color) {\n  return hsla(...parseToHsla(color));\n}\n\nexport { ColorError$1 as ColorError, adjustHue, darken, desaturate, getContrast, getLuminance, getScale, guard, hasBadContrast, hsla, lighten, mix, opacify, parseToHsla, parseToRgba, readableColor, readableColorIsBlack, rgba, saturate, toHex, toHsla, toRgba, transparentize };\n//# sourceMappingURL=index.module.es.js.map\n","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","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","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"],"mappings":"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"}
+{"version":3,"names":["generateBorderRadii","borderRadius","Boolean","xSmallRadius","smallRadius","mediumRadius","largeRadius","fullRadius","isFull","isNone","document","documentElement","style","setProperty","FONT_NAME_MAP","body2XS","bodyXS","bodyS","bodyM","bodyL","bodyXL","headingXS","headingS","headingM","headingL","headingXL","heading2XL","generateFont","font","customFontSizes","Object","entries","forEach","key","value","removeProperty","guard","low","high","Math","min","max","ColorError","Error","constructor","color","super","ColorError$1","parseToRgba","trim","toLowerCase","normalizedColor","namedColorRegex","test","nameToHex","reducedHexMatch","reducedHexRegex","exec","arr","Array","from","slice","map","x","parseInt","r","hexMatch","hexRegex","rgbaMatch","rgbaRegex","parseFloat","hslaMatch","hslaRegex","h","s","l","a","hslToRgb","Number","isNaN","hash","str","i","length","charCodeAt","colorToInt","replace","compressedColorMap","split","reduce","acc","next","substring","hex","toString","prefix","normalizedColorName","result","amount","join","RegExp","roundColor","round","hue","saturation","lightness","huePrime","chroma","abs","secondComponent","red","green","blue","lightnessModification","finalRed","finalGreen","finalBlue","getLuminance","f","channel","pow","g","b","rgba","alpha","toFixed","mix","color1","color2","weight","normalize","n","index","r1","g1","b1","a1","r2","g2","b2","a2","alphaDelta","normalizedWeight","combinedWeight","weight2","weight1","readableColorIsBlack","t","u","M","m","d","p","v","o","O","unitInput","unitOutput","roundOutput","e","c","D","isColor","strColor","Option","toKebabCase","pascal","buildVars","prev","obj","resp","k","name","assign","getCssColors","customPalette","overlayMix","baseColor","overlayColor","baseRGBA","overlayRGBA","finalRGBA","overlay","generatePalette","foregroundColor","backgroundColor","DEFAULT_THEME","isDarkBackground","palette","foregroundColors","backgroundColors","backgroundMixColor","foregroundMixColor","COLOR_MIXES","push","utilityLightMixColor","utilityLightMixValue","UTILITY_COLORS","yellow","cssColorVars","generateTheme"],"sources":["src/utils/theme/generateBorderRadii.ts","src/utils/theme/generateFont.ts","../node_modules/color2k/dist/index.module.es.js","../node_modules/color-blend/dist/index.modern.js","src/utils/theme/utils.ts","src/utils/theme/generatePalette.ts","src/utils/theme/generateTheme.ts"],"sourcesContent":["import { Theme } from '../../interface';\n\nexport const generateBorderRadii = ({ borderRadius }: Pick<Theme, 'borderRadius'>) => {\n  if (!Boolean(borderRadius)) {\n    return;\n  }\n\n  let xSmallRadius: number, smallRadius: number, mediumRadius: number, largeRadius: number;\n  const fullRadius = 1000;\n  let isFull = false;\n  let isNone = false;\n\n  switch (borderRadius) {\n    case 'none': {\n      isNone = true;\n      xSmallRadius = 0;\n      smallRadius = 0;\n      mediumRadius = 0;\n      largeRadius = 0;\n      break;\n    }\n    case 'xs': {\n      xSmallRadius = 2;\n      smallRadius = 4;\n      mediumRadius = 12;\n      largeRadius = 20;\n      break;\n    }\n    case 'sm': {\n      xSmallRadius = 2;\n      smallRadius = 8;\n      mediumRadius = 16;\n      largeRadius = 24;\n      break;\n    }\n    case 'lg': {\n      xSmallRadius = 8;\n      smallRadius = 16;\n      mediumRadius = 24;\n      largeRadius = 32;\n      break;\n    }\n    case 'full': {\n      xSmallRadius = 8;\n      smallRadius = 16;\n      mediumRadius = 24;\n      largeRadius = 32;\n      isFull = true;\n      break;\n    }\n    default:\n    case 'md': {\n      xSmallRadius = 4;\n      smallRadius = 12;\n      mediumRadius = 20;\n      largeRadius = 28;\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-select', `${isFull ? fullRadius : smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-file', `${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-destructive-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  document.documentElement.style.setProperty('--cpsl-border-radius-table-container', `${mediumRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-switch', `${isNone ? 0 : fullRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-checkbox', `${xSmallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-radio', `${fullRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-avatar', `${smallRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-card', `${mediumRadius}px`);\n  document.documentElement.style.setProperty('--cpsl-border-radius-button-group', `${xSmallRadius}px`);\n};\n","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","/**\n * A simple guard function:\n *\n * ```js\n * Math.min(Math.max(low, value), high)\n * ```\n */\nfunction guard(low, high, value) {\n  return Math.min(Math.max(low, value), high);\n}\n\nclass ColorError extends Error {\n  constructor(color) {\n    super(`Failed to parse color: \"${color}\"`);\n  }\n}\nvar ColorError$1 = ColorError;\n\n/**\n * Parses a color into red, gree, blue, alpha parts\n *\n * @param color the input color. Can be a RGB, RBGA, HSL, HSLA, or named color\n */\nfunction parseToRgba(color) {\n  if (typeof color !== 'string') throw new ColorError$1(color);\n  if (color.trim().toLowerCase() === 'transparent') return [0, 0, 0, 0];\n  let normalizedColor = color.trim();\n  normalizedColor = namedColorRegex.test(color) ? nameToHex(color) : color;\n  const reducedHexMatch = reducedHexRegex.exec(normalizedColor);\n  if (reducedHexMatch) {\n    const arr = Array.from(reducedHexMatch).slice(1);\n    return [...arr.slice(0, 3).map(x => parseInt(r(x, 2), 16)), parseInt(r(arr[3] || 'f', 2), 16) / 255];\n  }\n  const hexMatch = hexRegex.exec(normalizedColor);\n  if (hexMatch) {\n    const arr = Array.from(hexMatch).slice(1);\n    return [...arr.slice(0, 3).map(x => parseInt(x, 16)), parseInt(arr[3] || 'ff', 16) / 255];\n  }\n  const rgbaMatch = rgbaRegex.exec(normalizedColor);\n  if (rgbaMatch) {\n    const arr = Array.from(rgbaMatch).slice(1);\n    return [...arr.slice(0, 3).map(x => parseInt(x, 10)), parseFloat(arr[3] || '1')];\n  }\n  const hslaMatch = hslaRegex.exec(normalizedColor);\n  if (hslaMatch) {\n    const [h, s, l, a] = Array.from(hslaMatch).slice(1).map(parseFloat);\n    if (guard(0, 100, s) !== s) throw new ColorError$1(color);\n    if (guard(0, 100, l) !== l) throw new ColorError$1(color);\n    return [...hslToRgb(h, s, l), Number.isNaN(a) ? 1 : a];\n  }\n  throw new ColorError$1(color);\n}\nfunction hash(str) {\n  let hash = 5381;\n  let i = str.length;\n  while (i) {\n    hash = hash * 33 ^ str.charCodeAt(--i);\n  }\n\n  /* JavaScript does bitwise operations (like XOR, above) on 32-bit signed\n   * integers. Since we want the results to be always positive, convert the\n   * signed int to an unsigned by doing an unsigned bitshift. */\n  return (hash >>> 0) % 2341;\n}\nconst colorToInt = x => parseInt(x.replace(/_/g, ''), 36);\nconst compressedColorMap = '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((acc, next) => {\n  const key = colorToInt(next.substring(0, 3));\n  const hex = colorToInt(next.substring(3)).toString(16);\n\n  // NOTE: padStart could be used here but it breaks Node 6 compat\n  // https://github.com/ricokahler/color2k/issues/351\n  let prefix = '';\n  for (let i = 0; i < 6 - hex.length; i++) {\n    prefix += '0';\n  }\n  acc[key] = `${prefix}${hex}`;\n  return acc;\n}, {});\n\n/**\n * Checks if a string is a CSS named color and returns its equivalent hex value, otherwise returns the original color.\n */\nfunction nameToHex(color) {\n  const normalizedColorName = color.toLowerCase().trim();\n  const result = compressedColorMap[hash(normalizedColorName)];\n  if (!result) throw new ColorError$1(color);\n  return `#${result}`;\n}\nconst r = (str, amount) => Array.from(Array(amount)).map(() => str).join('');\nconst reducedHexRegex = new RegExp(`^#${r('([a-f0-9])', 3)}([a-f0-9])?$`, 'i');\nconst hexRegex = new RegExp(`^#${r('([a-f0-9]{2})', 3)}([a-f0-9]{2})?$`, 'i');\nconst rgbaRegex = new RegExp(`^rgba?\\\\(\\\\s*(\\\\d+)\\\\s*${r(',\\\\s*(\\\\d+)\\\\s*', 2)}(?:,\\\\s*([\\\\d.]+))?\\\\s*\\\\)$`, 'i');\nconst hslaRegex = /^hsla?\\(\\s*([\\d.]+)\\s*,\\s*([\\d.]+)%\\s*,\\s*([\\d.]+)%(?:\\s*,\\s*([\\d.]+))?\\s*\\)$/i;\nconst namedColorRegex = /^[a-z]+$/i;\nconst roundColor = color => {\n  return Math.round(color * 255);\n};\nconst hslToRgb = (hue, saturation, lightness) => {\n  let l = lightness / 100;\n  if (saturation === 0) {\n    // achromatic\n    return [l, l, l].map(roundColor);\n  }\n\n  // formulae from https://en.wikipedia.org/wiki/HSL_and_HSV\n  const huePrime = (hue % 360 + 360) % 360 / 60;\n  const chroma = (1 - Math.abs(2 * l - 1)) * (saturation / 100);\n  const secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));\n  let red = 0;\n  let green = 0;\n  let blue = 0;\n  if (huePrime >= 0 && huePrime < 1) {\n    red = chroma;\n    green = secondComponent;\n  } else if (huePrime >= 1 && huePrime < 2) {\n    red = secondComponent;\n    green = chroma;\n  } else if (huePrime >= 2 && huePrime < 3) {\n    green = chroma;\n    blue = secondComponent;\n  } else if (huePrime >= 3 && huePrime < 4) {\n    green = secondComponent;\n    blue = chroma;\n  } else if (huePrime >= 4 && huePrime < 5) {\n    red = secondComponent;\n    blue = chroma;\n  } else if (huePrime >= 5 && huePrime < 6) {\n    red = chroma;\n    blue = secondComponent;\n  }\n  const lightnessModification = l - chroma / 2;\n  const finalRed = red + lightnessModification;\n  const finalGreen = green + lightnessModification;\n  const finalBlue = blue + lightnessModification;\n  return [finalRed, finalGreen, finalBlue].map(roundColor);\n};\n\n// taken from:\n// https://github.com/styled-components/polished/blob/a23a6a2bb26802b3d922d9c3b67bac3f3a54a310/src/internalHelpers/_rgbToHsl.js\n\n/**\n * Parses a color in hue, saturation, lightness, and the alpha channel.\n *\n * Hue is a number between 0 and 360, saturation, lightness, and alpha are\n * decimal percentages between 0 and 1\n */\nfunction parseToHsla(color) {\n  const [red, green, blue, alpha] = parseToRgba(color).map((value, index) =>\n  // 3rd index is alpha channel which is already normalized\n  index === 3 ? value : value / 255);\n  const max = Math.max(red, green, blue);\n  const min = Math.min(red, green, blue);\n  const lightness = (max + min) / 2;\n\n  // achromatic\n  if (max === min) return [0, 0, lightness, alpha];\n  const delta = max - min;\n  const saturation = lightness > 0.5 ? delta / (2 - max - min) : delta / (max + min);\n  const hue = 60 * (red === max ? (green - blue) / delta + (green < blue ? 6 : 0) : green === max ? (blue - red) / delta + 2 : (red - green) / delta + 4);\n  return [hue, saturation, lightness, alpha];\n}\n\n/**\n * Takes in hsla parts and constructs an hsla string\n *\n * @param hue The color circle (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue\n * @param saturation Percentage of saturation, given as a decimal between 0 and 1\n * @param lightness Percentage of lightness, given as a decimal between 0 and 1\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction hsla(hue, saturation, lightness, alpha) {\n  return `hsla(${(hue % 360).toFixed()}, ${guard(0, 100, saturation * 100).toFixed()}%, ${guard(0, 100, lightness * 100).toFixed()}%, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Adjusts the current hue of the color by the given degrees. Wraps around when\n * over 360.\n *\n * @param color input color\n * @param degrees degrees to adjust the input color, accepts degree integers\n * (0 - 360) and wraps around on overflow\n */\nfunction adjustHue(color, degrees) {\n  const [h, s, l, a] = parseToHsla(color);\n  return hsla(h + degrees, s, l, a);\n}\n\n/**\n * Darkens using lightness. This is equivalent to subtracting the lightness\n * from the L in HSL.\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction darken(color, amount) {\n  const [hue, saturation, lightness, alpha] = parseToHsla(color);\n  return hsla(hue, saturation, lightness - amount, alpha);\n}\n\n/**\n * Desaturates the input color by the given amount via subtracting from the `s`\n * in `hsla`.\n *\n * @param amount The amount to desaturate, given as a decimal between 0 and 1\n */\nfunction desaturate(color, amount) {\n  const [h, s, l, a] = parseToHsla(color);\n  return hsla(h, s - amount, l, a);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getLuminance.js\n\n/**\n * Returns a number (float) representing the luminance of a color.\n */\nfunction getLuminance(color) {\n  if (color === 'transparent') return 0;\n  function f(x) {\n    const channel = x / 255;\n    return channel <= 0.04045 ? channel / 12.92 : Math.pow((channel + 0.055) / 1.055, 2.4);\n  }\n  const [r, g, b] = parseToRgba(color);\n  return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);\n}\n\n// taken from:\n// https://github.com/styled-components/polished/blob/0764c982551b487469043acb56281b0358b3107b/src/color/getContrast.js\n\n/**\n * Returns the contrast ratio between two colors based on\n * [W3's recommended equation for calculating contrast](http://www.w3.org/TR/WCAG20/#contrast-ratiodef).\n */\nfunction getContrast(color1, color2) {\n  const luminance1 = getLuminance(color1);\n  const luminance2 = getLuminance(color2);\n  return luminance1 > luminance2 ? (luminance1 + 0.05) / (luminance2 + 0.05) : (luminance2 + 0.05) / (luminance1 + 0.05);\n}\n\n/**\n * Takes in rgba parts and returns an rgba string\n *\n * @param red The amount of red in the red channel, given in a number between 0 and 255 inclusive\n * @param green The amount of green in the red channel, given in a number between 0 and 255 inclusive\n * @param blue The amount of blue in the red channel, given in a number between 0 and 255 inclusive\n * @param alpha Percentage of opacity, given as a decimal between 0 and 1\n */\nfunction rgba(red, green, blue, alpha) {\n  return `rgba(${guard(0, 255, red).toFixed()}, ${guard(0, 255, green).toFixed()}, ${guard(0, 255, blue).toFixed()}, ${parseFloat(guard(0, 1, alpha).toFixed(3))})`;\n}\n\n/**\n * Mixes two colors together. Taken from sass's implementation.\n */\nfunction mix(color1, color2, weight) {\n  const normalize = (n, index) =>\n  // 3rd index is alpha channel which is already normalized\n  index === 3 ? n : n / 255;\n  const [r1, g1, b1, a1] = parseToRgba(color1).map(normalize);\n  const [r2, g2, b2, a2] = parseToRgba(color2).map(normalize);\n\n  // The formula is copied from the original Sass implementation:\n  // http://sass-lang.com/documentation/Sass/Script/Functions.html#mix-instance_method\n  const alphaDelta = a2 - a1;\n  const normalizedWeight = weight * 2 - 1;\n  const combinedWeight = normalizedWeight * alphaDelta === -1 ? normalizedWeight : normalizedWeight + alphaDelta / (1 + normalizedWeight * alphaDelta);\n  const weight2 = (combinedWeight + 1) / 2;\n  const weight1 = 1 - weight2;\n  const r = (r1 * weight1 + r2 * weight2) * 255;\n  const g = (g1 * weight1 + g2 * weight2) * 255;\n  const b = (b1 * weight1 + b2 * weight2) * 255;\n  const a = a2 * weight + a1 * (1 - weight);\n  return rgba(r, g, b, a);\n}\n\n/**\n * Given a series colors, this function will return a `scale(x)` function that\n * accepts a percentage as a decimal between 0 and 1 and returns the color at\n * that percentage in the scale.\n *\n * ```js\n * const scale = getScale('red', 'yellow', 'green');\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(0.5)); // rgba(255, 255, 0, 1)\n * console.log(scale(1)); // rgba(0, 128, 0, 1)\n * ```\n *\n * If you'd like to limit the domain and range like chroma-js, we recommend\n * wrapping scale again.\n *\n * ```js\n * const _scale = getScale('red', 'yellow', 'green');\n * const scale = x => _scale(x / 100);\n *\n * console.log(scale(0)); // rgba(255, 0, 0, 1)\n * console.log(scale(50)); // rgba(255, 255, 0, 1)\n * console.log(scale(100)); // rgba(0, 128, 0, 1)\n * ```\n */\nfunction getScale(...colors) {\n  return n => {\n    const lastIndex = colors.length - 1;\n    const lowIndex = guard(0, lastIndex, Math.floor(n * lastIndex));\n    const highIndex = guard(0, lastIndex, Math.ceil(n * lastIndex));\n    const color1 = colors[lowIndex];\n    const color2 = colors[highIndex];\n    const unit = 1 / lastIndex;\n    const weight = (n - unit * lowIndex) / unit;\n    return mix(color1, color2, weight);\n  };\n}\n\nconst guidelines = {\n  decorative: 1.5,\n  readable: 3,\n  aa: 4.5,\n  aaa: 7\n};\n\n/**\n * Returns whether or not a color has bad contrast against a background\n * according to a given standard.\n */\nfunction hasBadContrast(color, standard = 'aa', background = '#fff') {\n  return getContrast(color, background) < guidelines[standard];\n}\n\n/**\n * Lightens a color by a given amount. This is equivalent to\n * `darken(color, -amount)`\n *\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction lighten(color, amount) {\n  return darken(color, -amount);\n}\n\n/**\n * Takes in a color and makes it more transparent by convert to `rgba` and\n * decreasing the amount in the alpha channel.\n *\n * @param amount The amount to increase the transparency by, given as a decimal between 0 and 1\n */\nfunction transparentize(color, amount) {\n  const [r, g, b, a] = parseToRgba(color);\n  return rgba(r, g, b, a - amount);\n}\n\n/**\n * Takes a color and un-transparentizes it. Equivalent to\n * `transparentize(color, -amount)`\n *\n * @param amount The amount to increase the opacity by, given as a decimal between 0 and 1\n */\nfunction opacify(color, amount) {\n  return transparentize(color, -amount);\n}\n\n/**\n * An alternative function to `readableColor`. Returns whether or not the \n * readable color (i.e. the color to be place on top the input color) should be\n * black.\n */\nfunction readableColorIsBlack(color) {\n  return getLuminance(color) > 0.179;\n}\n\n/**\n * Returns black or white for best contrast depending on the luminosity of the\n * given color.\n */\nfunction readableColor(color) {\n  return readableColorIsBlack(color) ? '#000' : '#fff';\n}\n\n/**\n * Saturates a color by converting it to `hsl` and increasing the saturation\n * amount. Equivalent to `desaturate(color, -amount)`\n * \n * @param color Input color\n * @param amount The amount to darken, given as a decimal between 0 and 1\n */\nfunction saturate(color, amount) {\n  return desaturate(color, -amount);\n}\n\n/**\n * Takes in any color and returns it as a hex code.\n */\nfunction toHex(color) {\n  const [r, g, b, a] = parseToRgba(color);\n  let hex = x => {\n    const h = guard(0, 255, x).toString(16);\n    // NOTE: padStart could be used here but it breaks Node 6 compat\n    // https://github.com/ricokahler/color2k/issues/351\n    return h.length === 1 ? `0${h}` : h;\n  };\n  return `#${hex(r)}${hex(g)}${hex(b)}${a < 1 ? hex(Math.round(a * 255)) : ''}`;\n}\n\n/**\n * Takes in any color and returns it as an rgba string.\n */\nfunction toRgba(color) {\n  return rgba(...parseToRgba(color));\n}\n\n/**\n * Takes in any color and returns it as an hsla string.\n */\nfunction toHsla(color) {\n  return hsla(...parseToHsla(color));\n}\n\nexport { ColorError$1 as ColorError, adjustHue, darken, desaturate, getContrast, getLuminance, getScale, guard, hasBadContrast, hsla, lighten, mix, opacify, parseToHsla, parseToRgba, readableColor, readableColorIsBlack, rgba, saturate, toHex, toHsla, toRgba, transparentize };\n//# sourceMappingURL=index.module.es.js.map\n","function n(n,r,t){return{r:255*t(n.r/255,r.r/255),g:255*t(n.g/255,r.g/255),b:255*t(n.b/255,r.b/255)}}function r(n,r){return r}function t(n,r){return n*r}function u(n,r){return n+r-n*r}function i(n,r){return a(r,n)}function o(n,r){return Math.min(n,r)}function e(n,r){return Math.min(Math.max(n,r),1)}function c(n,r){return 0===n?0:1===r?1:Math.min(1,n/(1-r))}function f(n,r){return 1===n?1:0===r?0:1-Math.min(1,(1-n)/r)}function a(n,r){return r<=.5?t(n,2*r):u(n,2*r-1)}function b(n,r){return r<=.5?n-(1-2*r)*n*(1-n):n+(2*r-1)*((n<=.25?((16*n-12)*n+4)*n:Math.sqrt(n))-n)}function g(n,r){return Math.abs(n-r)}function h(n,r){return n+r-2*n*r}function M(n,r,t){return Math.min(Math.max(n||0,r),t)}function m(n){return{r:M(n.r,0,255),g:M(n.g,0,255),b:M(n.b,0,255),a:M(n.a,0,1)}}function d(n){return{r:255*n.r,g:255*n.g,b:255*n.b,a:n.a}}function p(n){return{r:n.r/255,g:n.g/255,b:n.b/255,a:n.a}}function v(n,r){void 0===r&&(r=0);var t=Math.pow(10,r);return{r:Math.round(n.r*t)/t,g:Math.round(n.g*t)/t,b:Math.round(n.b*t)/t,a:n.a}}function x(n,r,t,u,i,o){return(1-r/t)*u+r/t*Math.round((1-n)*i+n*o)}function O(n,r,t,u,i){void 0===i&&(i={unitInput:!1,unitOutput:!1,roundOutput:!0}),i.unitInput&&(n=d(n),r=d(r)),n=m(n);var o=(r=m(r)).a+n.a-r.a*n.a,e=t(n,r,u),c=m({r:x(n.a,r.a,o,n.r,r.r,e.r),g:x(n.a,r.a,o,n.g,r.g,e.g),b:x(n.a,r.a,o,n.b,r.b,e.b),a:o});return c=i.unitOutput?p(c):i.roundOutput?v(c):function(n){return v(n,9)}(c),c}function s(n,r,t){return d(t(p(n),p(r)))}function I(n){return.3*n.r+.59*n.g+.11*n.b}function q(n,r){var t=r-I(n);return function(n){var r=I(n),t=n.r,u=n.g,i=n.b,o=Math.min(t,u,i),e=Math.max(t,u,i);function c(n){return r+(n-r)*r/(r-o)}function f(n){return r+(n-r)*(1-r)/(e-r)}return o<0&&(t=c(t),u=c(u),i=c(i)),e>1&&(t=f(t),u=f(u),i=f(i)),{r:t,g:u,b:i}}({r:n.r+t,g:n.g+t,b:n.b+t})}function w(n){return Math.max(n.r,n.g,n.b)-Math.min(n.r,n.g,n.b)}function j(n,r){var t=[\"r\",\"g\",\"b\"].sort(function(r,t){return n[r]-n[t]}),u=t[0],i=t[1],o=t[2],e={r:n.r,g:n.g,b:n.b};return e[o]>e[u]?(e[i]=(e[i]-e[u])*r/(e[o]-e[u]),e[o]=r):e[i]=e[o]=0,e[u]=0,e}function k(n,r){return q(j(r,w(n)),I(n))}function l(n,r){return q(j(n,w(r)),I(n))}function y(n,r){return q(r,I(n))}function z(n,r){return q(n,I(r))}function A(t,u){return O(t,u,n,r)}function B(r,u){return O(r,u,n,t)}function C(r,t){return O(r,t,n,u)}function D(r,t){return O(r,t,n,i)}function E(r,t){return O(r,t,n,o)}function F(r,t){return O(r,t,n,e)}function G(r,t){return O(r,t,n,c)}function H(r,t){return O(r,t,n,f)}function J(r,t){return O(r,t,n,a)}function K(r,t){return O(r,t,n,b)}function L(r,t){return O(r,t,n,g)}function N(r,t){return O(r,t,n,h)}function P(n,r){return O(n,r,s,k)}function Q(n,r){return O(n,r,s,l)}function R(n,r){return O(n,r,s,y)}function S(n,r){return O(n,r,s,z)}export{R as color,H as colorBurn,G as colorDodge,E as darken,L as difference,N as exclusion,J as hardLight,P as hue,F as lighten,S as luminosity,B as multiply,A as normal,D as overlay,Q as saturation,C as screen,K as softLight};\n//# sourceMappingURL=index.modern.js.map\n","import { parseToRgba, rgba } from 'color2k';\nimport { CustomPalette } from '../../interface';\nimport { overlay } from 'color-blend';\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\nexport const overlayMix = (baseColor: string, overlayColor: string) => {\n  const baseRGBA = parseToRgba(baseColor);\n  const overlayRGBA = parseToRgba(overlayColor);\n\n  const finalRGBA = overlay({ r: baseRGBA[0], g: baseRGBA[1], b: baseRGBA[2], a: 0.1 }, { r: overlayRGBA[0], g: overlayRGBA[1], b: overlayRGBA[2], a: overlayRGBA[3] });\n\n  return rgba(finalRGBA.r, finalRGBA.g, finalRGBA.b, finalRGBA.a);\n};\n","import { mix, readableColorIsBlack } from 'color2k';\nimport { Theme } from '../../interface';\nimport { getCssColors, isColor, overlayMix } from './utils';\nimport { COLOR_MIXES, DEFAULT_THEME, UTILITY_COLORS } from '../../constants';\n\nexport type Palette = {\n  foregroundColors: string[];\n  backgroundColors: string[];\n  isDarkBackground: boolean;\n};\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  COLOR_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-4', palette.backgroundColors[1]);\n  document.documentElement.style.setProperty('--cpsl-color-background-8', palette.backgroundColors[2]);\n  document.documentElement.style.setProperty('--cpsl-color-background-16', palette.backgroundColors[3]);\n  document.documentElement.style.setProperty('--cpsl-color-background-32', palette.backgroundColors[4]);\n  document.documentElement.style.setProperty('--cpsl-color-background-48', palette.backgroundColors[5]);\n  document.documentElement.style.setProperty('--cpsl-color-background-64', palette.backgroundColors[6]);\n  document.documentElement.style.setProperty('--cpsl-color-background-80', palette.backgroundColors[7]);\n  document.documentElement.style.setProperty('--cpsl-color-background-96', palette.backgroundColors[8]);\n\n  // FOREGROUND\n  document.documentElement.style.setProperty('--cpsl-color-foreground-0', palette.foregroundColors[0]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-4', palette.foregroundColors[1]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-8', palette.foregroundColors[2]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-16', palette.foregroundColors[3]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-32', palette.foregroundColors[4]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-48', palette.foregroundColors[5]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-64', palette.foregroundColors[6]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-80', palette.foregroundColors[7]);\n  document.documentElement.style.setProperty('--cpsl-color-foreground-96', palette.foregroundColors[8]);\n\n  const utilityLightMixColor = '#FFFFFF';\n  const utilityLightMixValue = 0.72;\n  // UTILITY\n  const red = overlayMix(foregroundColor, UTILITY_COLORS.red);\n  const yellow = overlayMix(foregroundColor, UTILITY_COLORS.yellow);\n  const green = overlayMix(foregroundColor, UTILITY_COLORS.green);\n  document.documentElement.style.setProperty('--cpsl-color-utility-red', red);\n  document.documentElement.style.setProperty('--cpsl-color-utility-yellow', yellow);\n  document.documentElement.style.setProperty('--cpsl-color-utility-green', green);\n  document.documentElement.style.setProperty('--cpsl-color-utility-red-light', mix(red, utilityLightMixColor, utilityLightMixValue));\n  document.documentElement.style.setProperty('--cpsl-color-utility-yellow-light', mix(yellow, utilityLightMixColor, utilityLightMixValue));\n  document.documentElement.style.setProperty('--cpsl-color-utility-green-light', mix(green, utilityLightMixColor, utilityLightMixValue));\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","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"],"mappings":"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"}

package/dist/capsule/{p-415384b7.entry.js → p-127ac658.entry.js}

@@ -1,2 +1,2 @@
-import{r as d,f as i,h as n,H as a}from"./p-b2997f3c.js";const p={xs:"(min-width: 0px)",sm:"(min-width: 576px)",md:"(min-width: 768px)",lg:"(min-width: 992px)",xl:"(min-width: 1200px)"};const l=d=>{if(d===undefined||d===""){return true}if(window.matchMedia){const i=p[d];return window.matchMedia(i).matches}return false};const r=":host{-webkit-padding-start:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;box-sizing:border-box;position:relative;flex-basis:0;flex-grow:1;width:100%;max-width:100%;min-height:1px}@media (min-width: 576px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 768px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 992px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 1200px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px))}}";const g=r;const c=typeof window!=="undefined"?window:undefined;const s=c&&!!(c.CSS&&c.CSS.supports&&c.CSS.supports("--a: 0"));const t=["","xs","sm","md","lg","xl"];const e=class{constructor(i){d(this,i);this.offset=undefined;this.offsetXs=undefined;this.offsetSm=undefined;this.offsetMd=undefined;this.offsetLg=undefined;this.offsetXl=undefined;this.pull=undefined;this.pullXs=undefined;this.pullSm=undefined;this.pullMd=undefined;this.pullLg=undefined;this.pullXl=undefined;this.push=undefined;this.pushXs=undefined;this.pushSm=undefined;this.pushMd=undefined;this.pushLg=undefined;this.pushXl=undefined;this.size=undefined;this.sizeXs=undefined;this.sizeSm=undefined;this.sizeMd=undefined;this.sizeLg=undefined;this.sizeXl=undefined}onResize(){i(this)}getColumns(d){let i;for(const n of t){const a=l(n);const p=this[d+n.charAt(0).toUpperCase()+n.slice(1)];if(a&&p!==undefined){i=p}}return i}calculateSize(){const d=this.getColumns("size");if(!d||d===""){return}const i=d==="auto"?"auto":s?`calc(calc(${d} / var(--ion-grid-columns, 12)) * 100%)`:d/12*100+"%";return{flex:`0 0 ${i}`,width:`${i}`,"max-width":`${i}`}}calculatePosition(d,i){const n=this.getColumns(d);if(!n){return}const a=s?`calc(calc(${n} / var(--ion-grid-columns, 12)) * 100%)`:n>0&&n<12?n/12*100+"%":"auto";return{[i]:a}}calculateOffset(d){return this.calculatePosition("offset",d?"margin-right":"margin-left")}calculatePull(d){return this.calculatePosition("pull",d?"left":"right")}calculatePush(d){return this.calculatePosition("push",d?"right":"left")}render(){const d=document.dir==="rtl";return n(a,{key:"fdb8a99b8b9225949b4eea931277e461efac29eb",style:Object.assign(Object.assign(Object.assign(Object.assign({},this.calculateOffset(d)),this.calculatePull(d)),this.calculatePush(d)),this.calculateSize())},n("slot",{key:"0976c09d835a37413455f787596a75eafc1db14f"}))}};e.style=g;export{e as cpsl_col};
-//# sourceMappingURL=p-415384b7.entry.js.map
+import{r as d,f as i,h as n,H as a}from"./p-97c33636.js";const p={xs:"(min-width: 0px)",sm:"(min-width: 576px)",md:"(min-width: 768px)",lg:"(min-width: 992px)",xl:"(min-width: 1200px)"};const l=d=>{if(d===undefined||d===""){return true}if(window.matchMedia){const i=p[d];return window.matchMedia(i).matches}return false};const r=":host{-webkit-padding-start:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-xs, var(--cpsl-grid-column-padding, 0px));margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;box-sizing:border-box;position:relative;flex-basis:0;flex-grow:1;width:100%;max-width:100%;min-height:1px}@media (min-width: 576px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-sm, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 768px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-md, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 992px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-lg, var(--cpsl-grid-column-padding, 0px))}}@media (min-width: 1200px){:host{-webkit-padding-start:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-inline-start:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));-webkit-padding-end:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-inline-end:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-top:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px));padding-bottom:var(--cpsl-grid-column-padding-xl, var(--cpsl-grid-column-padding, 0px))}}";const c=r;const g=typeof window!=="undefined"?window:undefined;const s=g&&!!(g.CSS&&g.CSS.supports&&g.CSS.supports("--a: 0"));const t=["","xs","sm","md","lg","xl"];const e=class{constructor(i){d(this,i);this.offset=undefined;this.offsetXs=undefined;this.offsetSm=undefined;this.offsetMd=undefined;this.offsetLg=undefined;this.offsetXl=undefined;this.pull=undefined;this.pullXs=undefined;this.pullSm=undefined;this.pullMd=undefined;this.pullLg=undefined;this.pullXl=undefined;this.push=undefined;this.pushXs=undefined;this.pushSm=undefined;this.pushMd=undefined;this.pushLg=undefined;this.pushXl=undefined;this.size=undefined;this.sizeXs=undefined;this.sizeSm=undefined;this.sizeMd=undefined;this.sizeLg=undefined;this.sizeXl=undefined}onResize(){i(this)}getColumns(d){let i;for(const n of t){const a=l(n);const p=this[d+n.charAt(0).toUpperCase()+n.slice(1)];if(a&&p!==undefined){i=p}}return i}calculateSize(){const d=this.getColumns("size");if(!d||d===""){return}const i=d==="auto"?"auto":s?`calc(calc(${d} / var(--ion-grid-columns, 12)) * 100%)`:d/12*100+"%";return{flex:`0 0 ${i}`,width:`${i}`,"max-width":`${i}`}}calculatePosition(d,i){const n=this.getColumns(d);if(!n){return}const a=s?`calc(calc(${n} / var(--ion-grid-columns, 12)) * 100%)`:n>0&&n<12?n/12*100+"%":"auto";return{[i]:a}}calculateOffset(d){return this.calculatePosition("offset",d?"margin-right":"margin-left")}calculatePull(d){return this.calculatePosition("pull",d?"left":"right")}calculatePush(d){return this.calculatePosition("push",d?"right":"left")}render(){const d=document.dir==="rtl";return n(a,{key:"c8173c44fb66a24831c110618000da8edadbded8",style:Object.assign(Object.assign(Object.assign(Object.assign({},this.calculateOffset(d)),this.calculatePull(d)),this.calculatePush(d)),this.calculateSize())},n("slot",{key:"04fa1eb6e5d9feaa28141c55cc0cd72a5e0e39a7"}))}};e.style=c;export{e as cpsl_col};
+//# sourceMappingURL=p-127ac658.entry.js.map

package/dist/capsule/{p-415384b7.entry.js.map → p-127ac658.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["SIZE_TO_MEDIA","xs","sm","md","lg","xl","matchBreakpoint","breakpoint","undefined","window","matchMedia","mediaQuery","matches","cpslColCss","CpslColStyle0","win","SUPPORTS_VARS","CSS","supports","BREAKPOINTS","CpslCol","onResize","forceUpdate","this","getColumns","property","matched","columns","charAt","toUpperCase","slice","calculateSize","colSize","flex","width","calculatePosition","modifier","amount","calculateOffset","isRTL","calculatePull","calculatePush","render","document","dir","h","Host","key","style","Object","assign"],"sources":["src/utils/media.ts","src/components/cpsl-col/cpsl-col.scss?tag=cpsl-col&encapsulation=shadow","src/components/cpsl-col/cpsl-col.tsx"],"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","@import './cpsl-col.vars';\n\n// Column\n// --------------------------------------------------\n\n:host {\n  /**\n   * @prop --cpsl-grid-columns: The number of total Columns in the Grid\n   * @prop --cpsl-grid-column-padding: Padding for the Column\n   * @prop --cpsl-grid-column-padding-xs: Padding for the Column on xs screens and up\n   * @prop --cpsl-grid-column-padding-sm: Padding for the Column on sm screens and up\n   * @prop --cpsl-grid-column-padding-md: Padding for the Column on md screens and up\n   * @prop --cpsl-grid-column-padding-lg: Padding for the Column on lg screens and up\n   * @prop --cpsl-grid-column-padding-xl: Padding for the Column on xl screens and up\n   */\n  @include make-breakpoint-padding($grid-column-paddings);\n  @include margin(0);\n\n  box-sizing: border-box;\n\n  position: relative;\n\n  flex-basis: 0;\n  flex-grow: 1;\n\n  width: 100%;\n  max-width: 100%;\n  min-height: 1px; // Prevent columns from collapsing when empty\n}\n","import { Component, Host, Listen, Prop, forceUpdate, h } from '@stencil/core';\nimport { matchBreakpoint } from '../../utils/media';\n\nconst win = typeof (window as any) !== 'undefined' ? (window as any) : undefined;\nconst SUPPORTS_VARS = win && !!(win.CSS && win.CSS.supports && win.CSS.supports('--a: 0'));\nconst BREAKPOINTS = ['', 'xs', 'sm', 'md', 'lg', 'xl'];\n\n@Component({\n  tag: 'cpsl-col',\n  styleUrl: 'cpsl-col.scss',\n  shadow: true,\n})\nexport class CpslCol {\n  /**\n   * The amount to offset the column, in terms of how many columns it should shift to the end\n   * of the total available.\n   */\n  @Prop() offset?: string;\n\n  /**\n   * The amount to offset the column for xs screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetXs?: string;\n\n  /**\n   * The amount to offset the column for sm screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetSm?: string;\n\n  /**\n   * The amount to offset the column for md screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetMd?: string;\n\n  /**\n   * The amount to offset the column for lg screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetLg?: string;\n\n  /**\n   * The amount to offset the column for xl screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetXl?: string;\n\n  /**\n   * The amount to pull the column, in terms of how many columns it should shift to the start of\n   * the total available.\n   */\n  @Prop() pull?: string;\n\n  /**\n   * The amount to pull the column for xs screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullXs?: string;\n  /**\n   * The amount to pull the column for sm screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullSm?: string;\n  /**\n   * The amount to pull the column for md screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullMd?: string;\n  /**\n   * The amount to pull the column for lg screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullLg?: string;\n  /**\n   * The amount to pull the column for xl screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullXl?: string;\n\n  /**\n   * The amount to push the column, in terms of how many columns it should shift to the end\n   * of the total available.\n   */\n  @Prop() push?: string;\n\n  /**\n   * The amount to push the column for xs screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushXs?: string;\n\n  /**\n   * The amount to push the column for sm screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushSm?: string;\n\n  /**\n   * The amount to push the column for md screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushMd?: string;\n\n  /**\n   * The amount to push the column for lg screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushLg?: string;\n\n  /**\n   * The amount to push the column for xl screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushXl?: string;\n\n  /**\n   * The size of the column, in terms of how many columns it should take up out of the total\n   * available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() size?: string;\n\n  /**\n   * The size of the column for xs screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeXs?: string;\n\n  /**\n   * The size of the column for sm screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeSm?: string;\n\n  /**\n   * The size of the column for md screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeMd?: string;\n\n  /**\n   * The size of the column for lg screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeLg?: string;\n\n  /**\n   * The size of the column for xl screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeXl?: string;\n\n  @Listen('resize', { target: 'window' })\n  onResize() {\n    forceUpdate(this);\n  }\n\n  // Loop through all of the breakpoints to see if the media query\n  // matches and grab the column value from the relevant prop if so\n  private getColumns(property: string) {\n    let matched;\n\n    for (const breakpoint of BREAKPOINTS) {\n      const matches = matchBreakpoint(breakpoint);\n\n      // Grab the value of the property, if it exists and our\n      // media query matches we return the value\n      const columns = (this as any)[property + breakpoint.charAt(0).toUpperCase() + breakpoint.slice(1)];\n\n      if (matches && columns !== undefined) {\n        matched = columns;\n      }\n    }\n\n    // Return the last matched columns since the breakpoints\n    // increase in size and we want to return the largest match\n    return matched;\n  }\n\n  private calculateSize() {\n    const columns = this.getColumns('size');\n\n    // If size wasn't set for any breakpoint\n    // or if the user set the size without a value\n    // it means we need to stick with the default and return\n    // e.g. <ion-col size-md>\n    if (!columns || columns === '') {\n      return;\n    }\n\n    // If the size is set to auto then don't calculate a size\n    const colSize =\n      columns === 'auto'\n        ? 'auto'\n        : // If CSS supports variables we should use the grid columns var\n        SUPPORTS_VARS\n        ? `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`\n        : // Convert the columns to a percentage by dividing by the total number\n          // of columns (12) and then multiplying by 100\n          (columns / 12) * 100 + '%';\n\n    return {\n      'flex': `0 0 ${colSize}`,\n      'width': `${colSize}`,\n      'max-width': `${colSize}`,\n    };\n  }\n\n  // Called by push, pull, and offset since they use the same calculations\n  private calculatePosition(property: string, modifier: string) {\n    const columns = this.getColumns(property);\n\n    if (!columns) {\n      return;\n    }\n\n    // If the number of columns passed are greater than 0 and less than\n    // 12 we can position the column, else default to auto\n    const amount = SUPPORTS_VARS\n      ? // If CSS supports variables we should use the grid columns var\n        `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`\n      : // Convert the columns to a percentage by dividing by the total number\n      // of columns (12) and then multiplying by 100\n      columns > 0 && columns < 12\n      ? (columns / 12) * 100 + '%'\n      : 'auto';\n\n    return {\n      [modifier]: amount,\n    };\n  }\n\n  private calculateOffset(isRTL: boolean) {\n    return this.calculatePosition('offset', isRTL ? 'margin-right' : 'margin-left');\n  }\n\n  private calculatePull(isRTL: boolean) {\n    return this.calculatePosition('pull', isRTL ? 'left' : 'right');\n  }\n\n  private calculatePush(isRTL: boolean) {\n    return this.calculatePosition('push', isRTL ? 'right' : 'left');\n  }\n\n  render() {\n    const isRTL = document.dir === 'rtl';\n    return (\n      <Host\n        style={{\n          ...this.calculateOffset(isRTL),\n          ...this.calculatePull(isRTL),\n          ...this.calculatePush(isRTL),\n          ...this.calculateSize(),\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAO,MAAMA,EAAqB,CAChCC,GAAI,mBACJC,GAAI,qBACJC,GAAI,qBACJC,GAAI,qBACJC,GAAI,uBAMC,MAAMC,EAAmBC,IAC9B,GAAIA,IAAeC,WAAaD,IAAe,GAAI,CACjD,OAAO,I,CAET,GAAKE,OAAeC,WAAY,CAC9B,MAAMC,EAAaX,EAAcO,GACjC,OAAOE,OAAOC,WAAWC,GAAYC,O,CAEvC,OAAO,KAAK,ECnBd,MAAMC,EAAa,i+FACnB,MAAAC,EAAeD,ECEf,MAAME,SAAcN,SAAmB,YAAeA,OAAiBD,UACvE,MAAMQ,EAAgBD,MAAUA,EAAIE,KAAOF,EAAIE,IAAIC,UAAYH,EAAIE,IAAIC,SAAS,WAChF,MAAMC,EAAc,CAAC,GAAI,KAAM,KAAM,KAAM,KAAM,M,MAOpCC,EAAO,M,6iBA8IlB,QAAAC,GACEC,EAAYC,K,CAKN,UAAAC,CAAWC,GACjB,IAAIC,EAEJ,IAAK,MAAMnB,KAAcY,EAAa,CACpC,MAAMP,EAAUN,EAAgBC,GAIhC,MAAMoB,EAAWJ,KAAaE,EAAWlB,EAAWqB,OAAO,GAAGC,cAAgBtB,EAAWuB,MAAM,IAE/F,GAAIlB,GAAWe,IAAYnB,UAAW,CACpCkB,EAAUC,C,EAMd,OAAOD,C,CAGD,aAAAK,GACN,MAAMJ,EAAUJ,KAAKC,WAAW,QAMhC,IAAKG,GAAWA,IAAY,GAAI,CAC9B,M,CAIF,MAAMK,EACJL,IAAY,OACR,OAEFX,EACE,aAAaW,2CAGZA,EAAU,GAAM,IAAM,IAE7B,MAAO,CACLM,KAAQ,OAAOD,IACfE,MAAS,GAAGF,IACZ,YAAa,GAAGA,I,CAKZ,iBAAAG,CAAkBV,EAAkBW,GAC1C,MAAMT,EAAUJ,KAAKC,WAAWC,GAEhC,IAAKE,EAAS,CACZ,M,CAKF,MAAMU,EAASrB,EAEX,aAAaW,2CAGfA,EAAU,GAAKA,EAAU,GACtBA,EAAU,GAAM,IAAM,IACvB,OAEJ,MAAO,CACLS,CAACA,GAAWC,E,CAIR,eAAAC,CAAgBC,GACtB,OAAOhB,KAAKY,kBAAkB,SAAUI,EAAQ,eAAiB,c,CAG3D,aAAAC,CAAcD,GACpB,OAAOhB,KAAKY,kBAAkB,OAAQI,EAAQ,OAAS,Q,CAGjD,aAAAE,CAAcF,GACpB,OAAOhB,KAAKY,kBAAkB,OAAQI,EAAQ,QAAU,O,CAG1D,MAAAG,GACE,MAAMH,EAAQI,SAASC,MAAQ,MAC/B,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAKC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACA3B,KAAKe,gBAAgBC,IACrBhB,KAAKiB,cAAcD,IACnBhB,KAAKkB,cAAcF,IACnBhB,KAAKQ,kBAGVc,EAAA,QAAAE,IAAA,6C"}
+{"version":3,"names":["SIZE_TO_MEDIA","xs","sm","md","lg","xl","matchBreakpoint","breakpoint","undefined","window","matchMedia","mediaQuery","matches","cpslColCss","CpslColStyle0","win","SUPPORTS_VARS","CSS","supports","BREAKPOINTS","CpslCol","onResize","forceUpdate","this","getColumns","property","matched","columns","charAt","toUpperCase","slice","calculateSize","colSize","flex","width","calculatePosition","modifier","amount","calculateOffset","isRTL","calculatePull","calculatePush","render","document","dir","h","Host","key","style","Object","assign"],"sources":["src/utils/media.ts","src/components/cpsl-col/cpsl-col.scss?tag=cpsl-col&encapsulation=shadow","src/components/cpsl-col/cpsl-col.tsx"],"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","@import './cpsl-col.vars';\n\n// Column\n// --------------------------------------------------\n\n:host {\n  /**\n   * @prop --cpsl-grid-columns: The number of total Columns in the Grid\n   * @prop --cpsl-grid-column-padding: Padding for the Column\n   * @prop --cpsl-grid-column-padding-xs: Padding for the Column on xs screens and up\n   * @prop --cpsl-grid-column-padding-sm: Padding for the Column on sm screens and up\n   * @prop --cpsl-grid-column-padding-md: Padding for the Column on md screens and up\n   * @prop --cpsl-grid-column-padding-lg: Padding for the Column on lg screens and up\n   * @prop --cpsl-grid-column-padding-xl: Padding for the Column on xl screens and up\n   */\n  @include make-breakpoint-padding($grid-column-paddings);\n  @include margin(0);\n\n  box-sizing: border-box;\n\n  position: relative;\n\n  flex-basis: 0;\n  flex-grow: 1;\n\n  width: 100%;\n  max-width: 100%;\n  min-height: 1px; // Prevent columns from collapsing when empty\n}\n","import { Component, Host, Listen, Prop, forceUpdate, h } from '@stencil/core';\nimport { matchBreakpoint } from '../../utils/media';\n\nconst win = typeof (window as any) !== 'undefined' ? (window as any) : undefined;\nconst SUPPORTS_VARS = win && !!(win.CSS && win.CSS.supports && win.CSS.supports('--a: 0'));\nconst BREAKPOINTS = ['', 'xs', 'sm', 'md', 'lg', 'xl'];\n\n@Component({\n  tag: 'cpsl-col',\n  styleUrl: 'cpsl-col.scss',\n  shadow: true,\n})\nexport class CpslCol {\n  /**\n   * The amount to offset the column, in terms of how many columns it should shift to the end\n   * of the total available.\n   */\n  @Prop() offset?: string;\n\n  /**\n   * The amount to offset the column for xs screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetXs?: string;\n\n  /**\n   * The amount to offset the column for sm screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetSm?: string;\n\n  /**\n   * The amount to offset the column for md screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetMd?: string;\n\n  /**\n   * The amount to offset the column for lg screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetLg?: string;\n\n  /**\n   * The amount to offset the column for xl screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() offsetXl?: string;\n\n  /**\n   * The amount to pull the column, in terms of how many columns it should shift to the start of\n   * the total available.\n   */\n  @Prop() pull?: string;\n\n  /**\n   * The amount to pull the column for xs screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullXs?: string;\n  /**\n   * The amount to pull the column for sm screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullSm?: string;\n  /**\n   * The amount to pull the column for md screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullMd?: string;\n  /**\n   * The amount to pull the column for lg screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullLg?: string;\n  /**\n   * The amount to pull the column for xl screens, in terms of how many columns it should shift\n   * to the start of the total available.\n   */\n  @Prop() pullXl?: string;\n\n  /**\n   * The amount to push the column, in terms of how many columns it should shift to the end\n   * of the total available.\n   */\n  @Prop() push?: string;\n\n  /**\n   * The amount to push the column for xs screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushXs?: string;\n\n  /**\n   * The amount to push the column for sm screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushSm?: string;\n\n  /**\n   * The amount to push the column for md screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushMd?: string;\n\n  /**\n   * The amount to push the column for lg screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushLg?: string;\n\n  /**\n   * The amount to push the column for xl screens, in terms of how many columns it should shift\n   * to the end of the total available.\n   */\n  @Prop() pushXl?: string;\n\n  /**\n   * The size of the column, in terms of how many columns it should take up out of the total\n   * available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() size?: string;\n\n  /**\n   * The size of the column for xs screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeXs?: string;\n\n  /**\n   * The size of the column for sm screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeSm?: string;\n\n  /**\n   * The size of the column for md screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeMd?: string;\n\n  /**\n   * The size of the column for lg screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeLg?: string;\n\n  /**\n   * The size of the column for xl screens, in terms of how many columns it should take up out\n   * of the total available. If `\"auto\"` is passed, the column will be the size of its content.\n   */\n  @Prop() sizeXl?: string;\n\n  @Listen('resize', { target: 'window' })\n  onResize() {\n    forceUpdate(this);\n  }\n\n  // Loop through all of the breakpoints to see if the media query\n  // matches and grab the column value from the relevant prop if so\n  private getColumns(property: string) {\n    let matched;\n\n    for (const breakpoint of BREAKPOINTS) {\n      const matches = matchBreakpoint(breakpoint);\n\n      // Grab the value of the property, if it exists and our\n      // media query matches we return the value\n      const columns = (this as any)[property + breakpoint.charAt(0).toUpperCase() + breakpoint.slice(1)];\n\n      if (matches && columns !== undefined) {\n        matched = columns;\n      }\n    }\n\n    // Return the last matched columns since the breakpoints\n    // increase in size and we want to return the largest match\n    return matched;\n  }\n\n  private calculateSize() {\n    const columns = this.getColumns('size');\n\n    // If size wasn't set for any breakpoint\n    // or if the user set the size without a value\n    // it means we need to stick with the default and return\n    // e.g. <ion-col size-md>\n    if (!columns || columns === '') {\n      return;\n    }\n\n    // If the size is set to auto then don't calculate a size\n    const colSize =\n      columns === 'auto'\n        ? 'auto'\n        : // If CSS supports variables we should use the grid columns var\n        SUPPORTS_VARS\n        ? `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`\n        : // Convert the columns to a percentage by dividing by the total number\n          // of columns (12) and then multiplying by 100\n          (columns / 12) * 100 + '%';\n\n    return {\n      'flex': `0 0 ${colSize}`,\n      'width': `${colSize}`,\n      'max-width': `${colSize}`,\n    };\n  }\n\n  // Called by push, pull, and offset since they use the same calculations\n  private calculatePosition(property: string, modifier: string) {\n    const columns = this.getColumns(property);\n\n    if (!columns) {\n      return;\n    }\n\n    // If the number of columns passed are greater than 0 and less than\n    // 12 we can position the column, else default to auto\n    const amount = SUPPORTS_VARS\n      ? // If CSS supports variables we should use the grid columns var\n        `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`\n      : // Convert the columns to a percentage by dividing by the total number\n      // of columns (12) and then multiplying by 100\n      columns > 0 && columns < 12\n      ? (columns / 12) * 100 + '%'\n      : 'auto';\n\n    return {\n      [modifier]: amount,\n    };\n  }\n\n  private calculateOffset(isRTL: boolean) {\n    return this.calculatePosition('offset', isRTL ? 'margin-right' : 'margin-left');\n  }\n\n  private calculatePull(isRTL: boolean) {\n    return this.calculatePosition('pull', isRTL ? 'left' : 'right');\n  }\n\n  private calculatePush(isRTL: boolean) {\n    return this.calculatePosition('push', isRTL ? 'right' : 'left');\n  }\n\n  render() {\n    const isRTL = document.dir === 'rtl';\n    return (\n      <Host\n        style={{\n          ...this.calculateOffset(isRTL),\n          ...this.calculatePull(isRTL),\n          ...this.calculatePush(isRTL),\n          ...this.calculateSize(),\n        }}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAO,MAAMA,EAAqB,CAChCC,GAAI,mBACJC,GAAI,qBACJC,GAAI,qBACJC,GAAI,qBACJC,GAAI,uBAMC,MAAMC,EAAmBC,IAC9B,GAAIA,IAAeC,WAAaD,IAAe,GAAI,CACjD,OAAO,I,CAET,GAAKE,OAAeC,WAAY,CAC9B,MAAMC,EAAaX,EAAcO,GACjC,OAAOE,OAAOC,WAAWC,GAAYC,O,CAEvC,OAAO,KAAK,ECnBd,MAAMC,EAAa,i+FACnB,MAAAC,EAAeD,ECEf,MAAME,SAAcN,SAAmB,YAAeA,OAAiBD,UACvE,MAAMQ,EAAgBD,MAAUA,EAAIE,KAAOF,EAAIE,IAAIC,UAAYH,EAAIE,IAAIC,SAAS,WAChF,MAAMC,EAAc,CAAC,GAAI,KAAM,KAAM,KAAM,KAAM,M,MAOpCC,EAAO,M,6iBA8IlB,QAAAC,GACEC,EAAYC,K,CAKN,UAAAC,CAAWC,GACjB,IAAIC,EAEJ,IAAK,MAAMnB,KAAcY,EAAa,CACpC,MAAMP,EAAUN,EAAgBC,GAIhC,MAAMoB,EAAWJ,KAAaE,EAAWlB,EAAWqB,OAAO,GAAGC,cAAgBtB,EAAWuB,MAAM,IAE/F,GAAIlB,GAAWe,IAAYnB,UAAW,CACpCkB,EAAUC,C,EAMd,OAAOD,C,CAGD,aAAAK,GACN,MAAMJ,EAAUJ,KAAKC,WAAW,QAMhC,IAAKG,GAAWA,IAAY,GAAI,CAC9B,M,CAIF,MAAMK,EACJL,IAAY,OACR,OAEFX,EACE,aAAaW,2CAGZA,EAAU,GAAM,IAAM,IAE7B,MAAO,CACLM,KAAQ,OAAOD,IACfE,MAAS,GAAGF,IACZ,YAAa,GAAGA,I,CAKZ,iBAAAG,CAAkBV,EAAkBW,GAC1C,MAAMT,EAAUJ,KAAKC,WAAWC,GAEhC,IAAKE,EAAS,CACZ,M,CAKF,MAAMU,EAASrB,EAEX,aAAaW,2CAGfA,EAAU,GAAKA,EAAU,GACtBA,EAAU,GAAM,IAAM,IACvB,OAEJ,MAAO,CACLS,CAACA,GAAWC,E,CAIR,eAAAC,CAAgBC,GACtB,OAAOhB,KAAKY,kBAAkB,SAAUI,EAAQ,eAAiB,c,CAG3D,aAAAC,CAAcD,GACpB,OAAOhB,KAAKY,kBAAkB,OAAQI,EAAQ,OAAS,Q,CAGjD,aAAAE,CAAcF,GACpB,OAAOhB,KAAKY,kBAAkB,OAAQI,EAAQ,QAAU,O,CAG1D,MAAAG,GACE,MAAMH,EAAQI,SAASC,MAAQ,MAC/B,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAKC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACA3B,KAAKe,gBAAgBC,IACrBhB,KAAKiB,cAAcD,IACnBhB,KAAKkB,cAAcF,IACnBhB,KAAKQ,kBAGVc,EAAA,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/capsule/p-39584a7b.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,H as s,g as o}from"./p-97c33636.js";const n=":host{display:none;position:absolute;top:0;left:0;width:100vw;height:100vh;justify-content:center;align-items:center;z-index:10005}:host .card{z-index:10005;opacity:0;position:relative;transition:all}:host(.no-overlay){position:relative;top:unset;left:unset;width:100%;height:auto}:host(.open) .card{opacity:1}:host(.elevated) .card{--card-border-width:0px}:host(.elevated) .card::part(card-container){box-shadow:0px 8px 16px 0px rgba(0, 0, 0, 0.12)}";const a=n;const h=class{constructor(i){t(this,i);this.cpslModalEntering=e(this,"cpslModalEntering",7);this.cpslModalEntered=e(this,"cpslModalEntered",7);this.cpslModalExiting=e(this,"cpslModalExiting",7);this.cpslModalExited=e(this,"cpslModalExited",7);this.enterTransitionDuration=.15;this.exitTransitionDuration=.15;this.elevated=undefined;this.noOverlay=undefined;this.open=undefined;this.zIndexOverride=undefined}toggleHeight(){if(!this.open){this.cpslModalExiting.emit();setTimeout((()=>{this.el.style.display="none";this.cpslModalExited.emit()}),this.exitTransitionDuration*1e3)}else{this.cpslModalEntering.emit();this.el.style.display="flex";setTimeout((()=>{this.cpslModalEntered.emit()}),this.enterTransitionDuration*1e3)}}componentDidLoad(){this.toggleHeight()}render(){return i(s,{key:"916ab0ce5ec3ce2a33103e67773b5420dd44241d",class:{open:this.open,elevated:this.elevated,"no-overlay":this.noOverlay}},!this.noOverlay&&i("cpsl-overlay",{key:"de5a3d5d1784fb4b2e07530ba0edcecc4c4c0e04",zIndexOverride:Boolean(this.zIndexOverride)?this.zIndexOverride:undefined,id:"overlay",open:this.open,enterTransitionDuration:this.enterTransitionDuration,exitTransitionDuration:this.exitTransitionDuration}),i("cpsl-card",{key:"8cbdc7a258583092b89c52e1167fb4094a4cc5b3",class:"card",style:{transitionDuration:this.open?`${this.exitTransitionDuration}s`:`${this.enterTransitionDuration}s`}},i("slot",{key:"5382dc704ac6fdb1f159139bac1bddd544749b32"})))}get el(){return o(this)}static get watchers(){return{open:["toggleHeight"]}}};h.style=a;export{h as cpsl_modal_v2};
+//# sourceMappingURL=p-39584a7b.entry.js.map

package/dist/capsule/p-39584a7b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cpslModalV2Css","CpslModalV2Style0","CpslModalV2","toggleHeight","this","open","cpslModalExiting","emit","setTimeout","el","style","display","cpslModalExited","exitTransitionDuration","cpslModalEntering","cpslModalEntered","enterTransitionDuration","componentDidLoad","render","h","Host","key","class","elevated","noOverlay","zIndexOverride","Boolean","undefined","id","transitionDuration"],"sources":["src/components/cpsl-modal-v2/cpsl-modal-v2.scss?tag=cpsl-modal-v2&encapsulation=shadow","src/components/cpsl-modal-v2/cpsl-modal-v2.tsx"],"sourcesContent":["@use 'sass:map';\n@import '../../themes/capsule.globals';\n\n:host {\n  display: none;\n\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  justify-content: center;\n  align-items: center;\n\n  z-index: map.get($z-indices, 'modal');\n\n  & .card {\n    z-index: map.get($z-indices, 'modal');\n    opacity: 0;\n\n    position: relative;\n\n    transition: all;\n  }\n}\n\n:host(.no-overlay) {\n  position: relative;\n  top: unset;\n  left: unset;\n  width: 100%;\n  height: auto;\n}\n\n:host(.open) {\n  & .card {\n    opacity: 1;\n  }\n}\n\n:host(.elevated) {\n  & .card {\n    --card-border-width: 0px;\n\n    &::part(card-container) {\n      box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.12);\n    }\n  }\n}\n","import { Component, Host, Prop, Watch, Element, Event, h, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'cpsl-modal-v2',\n  styleUrl: 'cpsl-modal-v2.scss',\n  shadow: true,\n})\nexport class CpslModalV2 {\n  @Element() el!: HTMLCpslModalV2Element;\n\n  /**\n   * Duration in seconds of the modal entering.\n   * Default is .15.\n   */\n  @Prop() enterTransitionDuration?: number = 0.15;\n\n  /**\n   * Duration in seconds of the modal exiting.\n   * Default is .15.\n   */\n  @Prop() exitTransitionDuration?: number = 0.15;\n\n  /**\n   * Whether or not to show the modal with a box shadow.\n   */\n  @Prop() elevated: boolean;\n\n  /**\n   * Whether or not to show the overlay.\n   */\n  @Prop() noOverlay: boolean;\n\n  /**\n   * Whether or not to show the modal.\n   */\n  @Prop() open: boolean;\n\n  /**\n   * Override z-index.\n   */\n  @Prop() zIndexOverride?: number;\n\n  /**\n   * Emitted when enter animation starts.\n   */\n  @Event() cpslModalEntering!: EventEmitter<null>;\n\n  /**\n   * Emitted when enter animation finishes.\n   */\n  @Event() cpslModalEntered!: EventEmitter<null>;\n\n  /**\n   * Emitted when exit animation starts.\n   */\n  @Event() cpslModalExiting!: EventEmitter<null>;\n\n  /**\n   * Emitted when exit animation finishes.\n   */\n  @Event() cpslModalExited!: EventEmitter<null>;\n\n  @Watch('open')\n  toggleHeight() {\n    if (!this.open) {\n      this.cpslModalExiting.emit();\n      // Animate out before setting display to none\n      setTimeout(() => {\n        this.el.style.display = 'none';\n        this.cpslModalExited.emit();\n      }, this.exitTransitionDuration * 1000);\n    } else {\n      this.cpslModalEntering.emit();\n      this.el.style.display = 'flex';\n      setTimeout(() => {\n        this.cpslModalEntered.emit();\n      }, this.enterTransitionDuration * 1000);\n    }\n  }\n\n  componentDidLoad() {\n    this.toggleHeight();\n  }\n\n  render() {\n    return (\n      <Host class={{ 'open': this.open, 'elevated': this.elevated, 'no-overlay': this.noOverlay }}>\n        {!this.noOverlay && (\n          <cpsl-overlay\n            zIndexOverride={Boolean(this.zIndexOverride) ? this.zIndexOverride : undefined}\n            id=\"overlay\"\n            open={this.open}\n            enterTransitionDuration={this.enterTransitionDuration}\n            exitTransitionDuration={this.exitTransitionDuration}\n          />\n        )}\n        <cpsl-card class=\"card\" style={{ transitionDuration: this.open ? `${this.exitTransitionDuration}s` : `${this.enterTransitionDuration}s` }}>\n          <slot></slot>\n        </cpsl-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAiB,qcACvB,MAAAC,EAAeD,E,MCMFE,EAAW,M,kQAOqB,I,4BAMD,I,mGA2C1C,YAAAC,GACE,IAAKC,KAAKC,KAAM,CACdD,KAAKE,iBAAiBC,OAEtBC,YAAW,KACTJ,KAAKK,GAAGC,MAAMC,QAAU,OACxBP,KAAKQ,gBAAgBL,MAAM,GAC1BH,KAAKS,uBAAyB,I,KAC5B,CACLT,KAAKU,kBAAkBP,OACvBH,KAAKK,GAAGC,MAAMC,QAAU,OACxBH,YAAW,KACTJ,KAAKW,iBAAiBR,MAAM,GAC3BH,KAAKY,wBAA0B,I,EAItC,gBAAAC,GACEb,KAAKD,c,CAGP,MAAAe,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,CAAEjB,KAAQD,KAAKC,KAAMkB,SAAYnB,KAAKmB,SAAU,aAAcnB,KAAKoB,aAC5EpB,KAAKoB,WACLL,EAAA,gBAAAE,IAAA,2CACEI,eAAgBC,QAAQtB,KAAKqB,gBAAkBrB,KAAKqB,eAAiBE,UACrEC,GAAG,UACHvB,KAAMD,KAAKC,KACXW,wBAAyBZ,KAAKY,wBAC9BH,uBAAwBT,KAAKS,yBAGjCM,EAAA,aAAAE,IAAA,2CAAWC,MAAM,OAAOZ,MAAO,CAAEmB,mBAAoBzB,KAAKC,KAAO,GAAGD,KAAKS,0BAA4B,GAAGT,KAAKY,6BAC3GG,EAAA,QAAAE,IAAA,8C","ignoreList":[]}