@mrshmllw/smores-react 5.0.0 → 6.0.1

package/dist/index.js

@@ -47,3 +47,4 @@ export { useScript } from './hooks/useScript/index.js';
 export { useTimeout } from './hooks/useTimeout/index.js';
 export { theme } from './theme.js';
 export { margin, padding, resolveSpacing } from './utils/space.js';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

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

package/dist/theme.js

@@ -90,3 +90,4 @@ const theme = {
 };
 
 export { theme };
+//# sourceMappingURL=theme.js.map

package/dist/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sources":["../src/theme.ts"],"sourcesContent":["const colors = {\n  // Core Primary\n  lollipop: '#FF69B5', // 120\n  marshmallowPink: '#FF88C8', // 100\n  bubblegum: '#FFB3DA', // 60\n  fairyFloss: '#FFCCE7', // 40\n\n  // Core Secondary\n  boba: '#0E0E0C', // 120\n  liquorice: '#292924', // 100\n  sesame: '#636768', // 60\n  chia: '#D2D2D2', // 40\n\n  // Core Tertiary\n  custard: '#F1E9DC', // 120\n  mascarpone: '#F8F2EA', // 100\n  coconut: '#FBF8F5', // 60\n  cream: '#FFFFFF', // 0\n\n  // Brand Secondary\n  spearmint: '#294636', // 1 100\n  feijoa: '#3B5848', // 1 60\n  blueberry: '#89A2B6', // 2 100\n  macaroon: '#BBCFDF', // 2 60\n  pistachio: '#838E49', // 3 100\n  matcha: '#DBE1B0', // 3 60\n  caramel: '#C26B2A', // 4 100\n  peanut: '#F8C699', // 4 60\n  marzipan: '#A1957C', // 5 100\n  oatmeal: '#DAD2C4', // 5 60\n\n  // Traffic light\n  strawberry: '#DF2929', // Error 100\n  watermelon: '#F5CFCC', // Error 20\n  apple: '#008933', // Success 100\n  mint: '#C9E2CE', // Success 20\n  lemon: '#FFD23A', // Warning 100\n  sherbert: '#FCF0D0', // Warning 20\n  tangerine: '#FF9F2C', // Agent Warning 100\n\n  // Third-party brand colours\n  compareTheMarket: '#004A8E',\n  confused: '#000A8C',\n  onfido: '#3640F5',\n  twitter: '#55ACEE',\n  premfina: '#F08422',\n  checkout: '#56AC88',\n  facebook: '#3B5998',\n  stripe: '#6772E5',\n  intercom: '#286EFA',\n  ravelin: '#2A4AFC',\n  rac: '#EA7D24',\n  hometree: '#17171C',\n}\n\nexport type Color = keyof typeof colors\n\nconst font = {\n  weight: {\n    normal: 400,\n    medium: 500,\n    bold: 700,\n  },\n  system:\n    '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"',\n}\n\nexport const theme = {\n  colors,\n  font,\n}\n"],"names":[],"mappings":"AAAA,MAAM,MAAS,GAAA;AAAA;AAAA,EAEb,QAAU,EAAA,SAAA;AAAA;AAAA,EACV,eAAiB,EAAA,SAAA;AAAA;AAAA,EACjB,SAAW,EAAA,SAAA;AAAA;AAAA,EACX,UAAY,EAAA,SAAA;AAAA;AAAA;AAAA,EAGZ,IAAM,EAAA,SAAA;AAAA;AAAA,EACN,SAAW,EAAA,SAAA;AAAA;AAAA,EACX,MAAQ,EAAA,SAAA;AAAA;AAAA,EACR,IAAM,EAAA,SAAA;AAAA;AAAA;AAAA,EAGN,OAAS,EAAA,SAAA;AAAA;AAAA,EACT,UAAY,EAAA,SAAA;AAAA;AAAA,EACZ,OAAS,EAAA,SAAA;AAAA;AAAA,EACT,KAAO,EAAA,SAAA;AAAA;AAAA;AAAA,EAGP,SAAW,EAAA,SAAA;AAAA;AAAA,EACX,MAAQ,EAAA,SAAA;AAAA;AAAA,EACR,SAAW,EAAA,SAAA;AAAA;AAAA,EACX,QAAU,EAAA,SAAA;AAAA;AAAA,EACV,SAAW,EAAA,SAAA;AAAA;AAAA,EACX,MAAQ,EAAA,SAAA;AAAA;AAAA,EACR,OAAS,EAAA,SAAA;AAAA;AAAA,EACT,MAAQ,EAAA,SAAA;AAAA;AAAA,EACR,QAAU,EAAA,SAAA;AAAA;AAAA,EACV,OAAS,EAAA,SAAA;AAAA;AAAA;AAAA,EAGT,UAAY,EAAA,SAAA;AAAA;AAAA,EACZ,UAAY,EAAA,SAAA;AAAA;AAAA,EACZ,KAAO,EAAA,SAAA;AAAA;AAAA,EACP,IAAM,EAAA,SAAA;AAAA;AAAA,EACN,KAAO,EAAA,SAAA;AAAA;AAAA,EACP,QAAU,EAAA,SAAA;AAAA;AAAA,EACV,SAAW,EAAA,SAAA;AAAA;AAAA;AAAA,EAGX,gBAAkB,EAAA,SAAA;AAAA,EAClB,QAAU,EAAA,SAAA;AAAA,EACV,MAAQ,EAAA,SAAA;AAAA,EACR,OAAS,EAAA,SAAA;AAAA,EACT,QAAU,EAAA,SAAA;AAAA,EACV,QAAU,EAAA,SAAA;AAAA,EACV,QAAU,EAAA,SAAA;AAAA,EACV,MAAQ,EAAA,SAAA;AAAA,EACR,QAAU,EAAA,SAAA;AAAA,EACV,OAAS,EAAA,SAAA;AAAA,EACT,GAAK,EAAA,SAAA;AAAA,EACL,QAAU,EAAA,SAAA;AACZ,CAAA,CAAA;AAIA,MAAM,IAAO,GAAA;AAAA,EACX,MAAQ,EAAA;AAAA,IACN,MAAQ,EAAA,GAAA;AAAA,IACR,MAAQ,EAAA,GAAA;AAAA,IACR,IAAM,EAAA,GAAA;AAAA,GACR;AAAA,EACA,MACE,EAAA,+IAAA;AACJ,CAAA,CAAA;AAEO,MAAM,KAAQ,GAAA;AAAA,EACnB,MAAA;AAAA,EACA,IAAA;AACF;;;;"}

package/dist/utils/date.js

@@ -8,3 +8,4 @@ const convertToUkDate = (date) => {
 };
 
 export { convertToUkDate };
+//# sourceMappingURL=date.js.map

package/dist/utils/date.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date.js","sources":["../../src/utils/date.ts"],"sourcesContent":["const ukTimeFormat = new Intl.DateTimeFormat('en-GB', {\n  timeZone: 'Europe/London',\n})\n\nexport const convertToUkDate = (date: Date): Date => {\n  const dateString = ukTimeFormat.format(date)\n  const [day, month, year] = dateString.split('/')\n\n  return new Date(Number(year), Number(month) - 1, Number(day))\n}\n"],"names":[],"mappings":"AAAA,MAAM,YAAe,GAAA,IAAI,IAAK,CAAA,cAAA,CAAe,OAAS,EAAA;AAAA,EACpD,QAAU,EAAA,eAAA;AACZ,CAAC,CAAA,CAAA;AAEY,MAAA,eAAA,GAAkB,CAAC,IAAqB,KAAA;AACnD,EAAM,MAAA,UAAA,GAAa,YAAa,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AAC3C,EAAA,MAAM,CAAC,GAAK,EAAA,KAAA,EAAO,IAAI,CAAI,GAAA,UAAA,CAAW,MAAM,GAAG,CAAA,CAAA;AAE/C,EAAO,OAAA,IAAI,IAAK,CAAA,MAAA,CAAO,IAAI,CAAA,EAAG,MAAO,CAAA,KAAK,CAAI,GAAA,CAAA,EAAG,MAAO,CAAA,GAAG,CAAC,CAAA,CAAA;AAC9D;;;;"}

package/dist/utils/debounce.js

@@ -12,3 +12,4 @@ const debounce = (fn, delay) => {
 };
 
 export { debounce };
+//# sourceMappingURL=debounce.js.map

package/dist/utils/debounce.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"debounce.js","sources":["../../src/utils/debounce.ts"],"sourcesContent":["/**\n * Debounces a method.\n * @param fn - The function to be debounced.\n * @param delay - The debouncing delay.\n * @returns A debounced version of the function.\n */\nexport const debounce = <Args extends unknown[], R>(\n  fn: (...args: Args) => R,\n  delay: number,\n): ((...args: Args) => void) => {\n  let timeout: NodeJS.Timeout | undefined\n\n  return (...args: Args): void => {\n    if (timeout) {\n      clearTimeout(timeout)\n    }\n\n    timeout = setTimeout(() => {\n      fn(...args)\n      timeout = undefined\n    }, delay)\n  }\n}\n"],"names":[],"mappings":"AAMa,MAAA,QAAA,GAAW,CACtB,EAAA,EACA,KAC8B,KAAA;AAC9B,EAAI,IAAA,OAAA,CAAA;AAEJ,EAAA,OAAO,IAAI,IAAqB,KAAA;AAC9B,IAAA,IAAI,OAAS,EAAA;AACX,MAAA,YAAA,CAAa,OAAO,CAAA,CAAA;AAAA,KACtB;AAEA,IAAA,OAAA,GAAU,WAAW,MAAM;AACzB,MAAA,EAAA,CAAG,GAAG,IAAI,CAAA,CAAA;AACV,MAAU,OAAA,GAAA,KAAA,CAAA,CAAA;AAAA,OACT,KAAK,CAAA,CAAA;AAAA,GACV,CAAA;AACF;;;;"}

package/dist/utils/flex.js

@@ -47,3 +47,4 @@ const flex = (props) => {
 };
 
 export { flex };
+//# sourceMappingURL=flex.js.map

package/dist/utils/flex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flex.js","sources":["../../src/utils/flex.tsx"],"sourcesContent":["import { resolveResponsiveProp, ResponsiveProp } from './responsiveProp'\nimport { resolveSpacing, SpacingProp } from './space'\n\ntype FlexFN = (arg: FlexProps) => string\n\nexport interface FlexProps {\n  direction?: ResponsiveProp<\n    'column' | 'column-reverse' | 'row' | 'row-reverse'\n  >\n  wrap?: 'nowrap' | 'wrap' | 'wrap-reverse'\n  flex?: boolean\n  flow?: string\n  justifyContent?: ResponsiveProp<\n    | 'center'\n    | 'flex-end'\n    | 'flex-start'\n    | 'space-around'\n    | 'space-between'\n    | 'space-evenly'\n  >\n\n  alignItems?: ResponsiveProp<\n    'baseline' | 'center' | 'flex-end' | 'flex-start' | 'stretch'\n  >\n  alignContent?: ResponsiveProp<\n    | 'center'\n    | 'flex-end'\n    | 'flex-start'\n    | 'space-around'\n    | 'space-between'\n    | 'stretch'\n  >\n  gap?: ResponsiveProp<SpacingProp>\n  rowGap?: ResponsiveProp<SpacingProp>\n  columnGap?: ResponsiveProp<SpacingProp>\n}\n\nexport const flex: FlexFN = (props: FlexProps) => {\n  const {\n    flex,\n    direction,\n    wrap,\n    flow,\n    justifyContent,\n    alignItems,\n    alignContent,\n    gap,\n    columnGap,\n    rowGap,\n  } = props\n\n  return `\n    ${flex ? `display: flex;` : ''}\n    ${\n      direction\n        ? resolveResponsiveProp(\n            direction,\n            (value) => `flex-direction: ${value};`,\n          )\n        : ''\n    }\n    ${wrap ? `flex-wrap: ${wrap};` : ''}\n    ${flow ? `flex-flow: ${flow};` : ''}\n    ${\n      justifyContent\n        ? resolveResponsiveProp(\n            justifyContent,\n            (value) => `justify-content: ${value};`,\n          )\n        : ''\n    }\n    ${\n      alignItems\n        ? resolveResponsiveProp(alignItems, (value) => `align-items: ${value};`)\n        : ''\n    }\n    ${\n      alignContent\n        ? resolveResponsiveProp(\n            alignContent,\n            (value) => `align-content: ${value};`,\n          )\n        : ''\n    }\n    ${\n      gap\n        ? resolveResponsiveProp(\n            gap,\n            (value) => `gap: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      columnGap\n        ? resolveResponsiveProp(\n            columnGap,\n            (value) => `column-gap: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      rowGap\n        ? resolveResponsiveProp(\n            rowGap,\n            (value) => `row-gap: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n  `\n}\n"],"names":["flex"],"mappings":";;;AAqCa,MAAA,IAAA,GAAe,CAAC,KAAqB,KAAA;AAChD,EAAM,MAAA;AAAA,IACJ,IAAAA,EAAAA,KAAAA;AAAA,IACA,SAAA;AAAA,IACA,IAAA;AAAA,IACA,IAAA;AAAA,IACA,cAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,GAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAO,OAAA,CAAA;AAAA,IACHA,EAAAA,KAAAA,GAAO,mBAAmB,EAAE,CAAA;AAAA,IAAA,EAE5B,SACI,GAAA,qBAAA;AAAA,IACE,SAAA;AAAA,IACA,CAAC,KAAU,KAAA,CAAA,gBAAA,EAAmB,KAAK,CAAA,CAAA,CAAA;AAAA,MAErC,EACN,CAAA;AAAA,IAAA,EACE,IAAO,GAAA,CAAA,WAAA,EAAc,IAAI,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,IAAA,EACjC,IAAO,GAAA,CAAA,WAAA,EAAc,IAAI,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,IAAA,EAEjC,cACI,GAAA,qBAAA;AAAA,IACE,cAAA;AAAA,IACA,CAAC,KAAU,KAAA,CAAA,iBAAA,EAAoB,KAAK,CAAA,CAAA,CAAA;AAAA,MAEtC,EACN,CAAA;AAAA,IAEE,EAAA,UAAA,GACI,sBAAsB,UAAY,EAAA,CAAC,UAAU,CAAgB,aAAA,EAAA,KAAK,CAAG,CAAA,CAAA,CAAA,GACrE,EACN,CAAA;AAAA,IAAA,EAEE,YACI,GAAA,qBAAA;AAAA,IACE,YAAA;AAAA,IACA,CAAC,KAAU,KAAA,CAAA,eAAA,EAAkB,KAAK,CAAA,CAAA,CAAA;AAAA,MAEpC,EACN,CAAA;AAAA,IAAA,EAEE,GACI,GAAA,qBAAA;AAAA,IACE,GAAA;AAAA,IACA,CAAC,KAAA,KAAU,CAAQ,KAAA,EAAA,cAAA,CAAe,KAAK,CAAC,CAAA,CAAA,CAAA;AAAA,MAE1C,EACN,CAAA;AAAA,IAAA,EAEE,SACI,GAAA,qBAAA;AAAA,IACE,SAAA;AAAA,IACA,CAAC,KAAA,KAAU,CAAe,YAAA,EAAA,cAAA,CAAe,KAAK,CAAC,CAAA,CAAA,CAAA;AAAA,MAEjD,EACN,CAAA;AAAA,IAAA,EAEE,MACI,GAAA,qBAAA;AAAA,IACE,MAAA;AAAA,IACA,CAAC,KAAA,KAAU,CAAY,SAAA,EAAA,cAAA,CAAe,KAAK,CAAC,CAAA,CAAA,CAAA;AAAA,MAE9C,EACN,CAAA;AAAA,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/dist/utils/focusOutline.js

@@ -19,3 +19,4 @@ const focusOutlineStyle = css`
 `;
 
 export { focusOutline, focusOutlineStyle };
+//# sourceMappingURL=focusOutline.js.map

package/dist/utils/focusOutline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"focusOutline.js","sources":["../../src/utils/focusOutline.ts"],"sourcesContent":["import { css } from 'styled-components'\nimport { theme } from '../theme'\n\nexport const focusOutline = ({\n  selector = '&:focus-visible',\n}: { selector?: string } = {}) => css`\n  outline: 0;\n\n  ${selector} {\n    outline: 2px solid ${theme.colors.liquorice};\n    outline-offset: 2px;\n  }\n`\n\nexport const focusOutlineStyle = css`\n  &:focus-visible {\n    outline: 2px solid ${theme.colors.liquorice};\n    outline-offset: 2px;\n  }\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,eAAe,CAAC;AAAA,EAC3B,QAAW,GAAA,iBAAA;AACb,CAAA,GAA2B,EAAO,KAAA,GAAA,CAAA;AAAA;AAAA;AAAA,EAAA,EAG9B,QAAQ,CAAA;AAAA,uBACa,EAAA,KAAA,CAAM,OAAO,SAAS,CAAA;AAAA;AAAA;AAAA,EAAA;AAKxC,MAAM,iBAAoB,GAAA,GAAA,CAAA;AAAA;AAAA,uBAER,EAAA,KAAA,CAAM,OAAO,SAAS,CAAA;AAAA;AAAA;AAAA;;;;"}

package/dist/utils/id.js

@@ -13,3 +13,4 @@ const useUniqueId = (id) => {
 };
 
 export { smoresIdPrefix, useUniqueId };
+//# sourceMappingURL=id.js.map

package/dist/utils/id.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"id.js","sources":["../../src/utils/id.ts"],"sourcesContent":["import { useMemo } from 'react'\n\nlet idCount = 0\n\nexport const smoresIdPrefix = 'MM_SMORES'\n\nconst createId = (): string => {\n  const id = `${smoresIdPrefix}_${idCount}`\n  idCount += 1\n\n  return id\n}\n\nexport const useUniqueId = (id?: string) => {\n  const returnedId = useMemo(() => id || createId(), [id])\n\n  return returnedId\n}\n"],"names":[],"mappings":";;AAEA,IAAI,OAAU,GAAA,CAAA,CAAA;AAEP,MAAM,cAAiB,GAAA,YAAA;AAE9B,MAAM,WAAW,MAAc;AAC7B,EAAA,MAAM,EAAK,GAAA,CAAA,EAAG,cAAc,CAAA,CAAA,EAAI,OAAO,CAAA,CAAA,CAAA;AACvC,EAAW,OAAA,IAAA,CAAA,CAAA;AAEX,EAAO,OAAA,EAAA,CAAA;AACT,CAAA,CAAA;AAEa,MAAA,WAAA,GAAc,CAAC,EAAgB,KAAA;AAC1C,EAAM,MAAA,UAAA,GAAa,QAAQ,MAAM,EAAA,IAAM,UAAY,EAAA,CAAC,EAAE,CAAC,CAAA,CAAA;AAEvD,EAAO,OAAA,UAAA,CAAA;AACT;;;;"}

package/dist/utils/isReactElement.js

@@ -5,3 +5,4 @@ const isReactElement = (obj) => {
 };
 
 export { isReactElement };
+//# sourceMappingURL=isReactElement.js.map

package/dist/utils/isReactElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isReactElement.js","sources":["../../src/utils/isReactElement.ts"],"sourcesContent":["import { ReactElement, isValidElement } from 'react'\n\nexport const isReactElement = (obj: unknown): obj is ReactElement => {\n  return isValidElement(obj)\n}\n"],"names":[],"mappings":";;AAEa,MAAA,cAAA,GAAiB,CAAC,GAAsC,KAAA;AACnE,EAAA,OAAO,eAAe,GAAG,CAAA,CAAA;AAC3B;;;;"}

package/dist/utils/measure.js

@@ -11,3 +11,4 @@ const measure = (props) => {
 };
 
 export { measure };
+//# sourceMappingURL=measure.js.map

package/dist/utils/measure.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"measure.js","sources":["../../src/utils/measure.tsx"],"sourcesContent":["type MeasureFN = (arg: MeasureProps) => string\n\nexport interface MeasureProps {\n  width?: string\n  maxWidth?: string\n  minWidth?: string\n  height?: string\n  maxHeight?: string\n  minHeight?: string\n}\n\nexport const measure: MeasureFN = (props: MeasureProps) => {\n  const { width, height, maxWidth, minWidth, minHeight, maxHeight } = props\n\n  return `\n    ${width ? `width: ${width};` : ''}\n    ${maxWidth ? `max-width: ${maxWidth};` : ''}\n    ${minWidth ? `min-width: ${minWidth};` : ''}\n    ${height ? `height: ${height};` : ''}\n    ${minHeight ? `min-height: ${minHeight};` : ''}\n    ${maxHeight ? `max-height: ${maxHeight};` : ''}\n  `\n}\n"],"names":[],"mappings":"AAWa,MAAA,OAAA,GAAqB,CAAC,KAAwB,KAAA;AACzD,EAAA,MAAM,EAAE,KAAO,EAAA,MAAA,EAAQ,UAAU,QAAU,EAAA,SAAA,EAAW,WAAc,GAAA,KAAA,CAAA;AAEpE,EAAO,OAAA,CAAA;AAAA,IAAA,EACH,KAAQ,GAAA,CAAA,OAAA,EAAU,KAAK,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,IAAA,EAC/B,QAAW,GAAA,CAAA,WAAA,EAAc,QAAQ,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,IAAA,EACzC,QAAW,GAAA,CAAA,WAAA,EAAc,QAAQ,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,IAAA,EACzC,MAAS,GAAA,CAAA,QAAA,EAAW,MAAM,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,IAAA,EAClC,SAAY,GAAA,CAAA,YAAA,EAAe,SAAS,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,IAAA,EAC5C,SAAY,GAAA,CAAA,YAAA,EAAe,SAAS,CAAA,CAAA,CAAA,GAAM,EAAE,CAAA;AAAA,EAAA,CAAA,CAAA;AAElD;;;;"}

package/dist/utils/responsiveProp.js

@@ -28,3 +28,4 @@ const resolveResponsiveProp = (value, styleTemplate) => {
 };
 
 export { resolveResponsiveProp };
+//# sourceMappingURL=responsiveProp.js.map

package/dist/utils/responsiveProp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsiveProp.js","sources":["../../src/utils/responsiveProp.ts"],"sourcesContent":["const breakpointToMinPxMapping = {\n  small: 0,\n  medium: 768,\n  large: 1024,\n} satisfies Record<string, number>\n\ntype Breakpoint = keyof typeof breakpointToMinPxMapping\nconst breakpointList = Object.keys(breakpointToMinPxMapping) as Breakpoint[]\n\ntype PropByBreakpoint<PropValue> = { [key in Breakpoint]?: PropValue }\nexport type ResponsiveProp<PropValue> = PropValue | PropByBreakpoint<PropValue>\n\nconst isPropByBreakpoint = <PropValue>(\n  value: ResponsiveProp<PropValue>,\n): value is PropByBreakpoint<PropValue> => {\n  return (\n    typeof value === 'object' &&\n    value !== null &&\n    breakpointList.includes(Object.keys(value)[0] as any)\n  )\n}\n\nexport const resolveResponsiveProp = <PropValue>(\n  value: ResponsiveProp<PropValue>,\n  styleTemplate: (value: PropValue) => string,\n) => {\n  if (!isPropByBreakpoint(value)) {\n    return `\n      @media (min-width: ${breakpointToMinPxMapping.small}px) {\n        ${styleTemplate(value)}\n      }\n    `\n  }\n\n  const breakpointUsed = Object.keys(value) as Breakpoint[]\n\n  let style = ''\n  breakpointUsed.forEach((breakpoint) => {\n    style += `\n        @media (min-width: ${breakpointToMinPxMapping[breakpoint]}px) {\n          ${styleTemplate(value[breakpoint]!)}\n        }\n      `\n  })\n\n  return style\n}\n"],"names":[],"mappings":"AAAA,MAAM,wBAA2B,GAAA;AAAA,EAC/B,KAAO,EAAA,CAAA;AAAA,EACP,MAAQ,EAAA,GAAA;AAAA,EACR,KAAO,EAAA,IAAA;AACT,CAAA,CAAA;AAGA,MAAM,cAAA,GAAiB,MAAO,CAAA,IAAA,CAAK,wBAAwB,CAAA,CAAA;AAK3D,MAAM,kBAAA,GAAqB,CACzB,KACyC,KAAA;AACzC,EAAA,OACE,OAAO,KAAA,KAAU,QACjB,IAAA,KAAA,KAAU,IACV,IAAA,cAAA,CAAe,QAAS,CAAA,MAAA,CAAO,IAAK,CAAA,KAAK,CAAE,CAAA,CAAC,CAAQ,CAAA,CAAA;AAExD,CAAA,CAAA;AAEa,MAAA,qBAAA,GAAwB,CACnC,KAAA,EACA,aACG,KAAA;AACH,EAAI,IAAA,CAAC,kBAAmB,CAAA,KAAK,CAAG,EAAA;AAC9B,IAAO,OAAA,CAAA;AAAA,yBAAA,EACgB,yBAAyB,KAAK,CAAA;AAAA,QAC/C,EAAA,aAAA,CAAc,KAAK,CAAC,CAAA;AAAA;AAAA,IAAA,CAAA,CAAA;AAAA,GAG5B;AAEA,EAAM,MAAA,cAAA,GAAiB,MAAO,CAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AAExC,EAAA,IAAI,KAAQ,GAAA,EAAA,CAAA;AACZ,EAAe,cAAA,CAAA,OAAA,CAAQ,CAAC,UAAe,KAAA;AACrC,IAAS,KAAA,IAAA,CAAA;AAAA,2BACgB,EAAA,wBAAA,CAAyB,UAAU,CAAC,CAAA;AAAA,UAAA,EACrD,aAAc,CAAA,KAAA,CAAM,UAAU,CAAE,CAAC,CAAA;AAAA;AAAA,MAAA,CAAA,CAAA;AAAA,GAG1C,CAAA,CAAA;AAED,EAAO,OAAA,KAAA,CAAA;AACT;;;;"}

package/dist/utils/space.js

@@ -89,3 +89,4 @@ const padding = (props) => {
 };
 
 export { margin, padding, resolveSpacing };
+//# sourceMappingURL=space.js.map

package/dist/utils/space.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"space.js","sources":["../../src/utils/space.tsx"],"sourcesContent":["import { resolveResponsiveProp, ResponsiveProp } from './responsiveProp'\n\ntype Spacing = '8px' | '12px' | '16px' | '24px' | '32px' | '48px' | '64px'\n\nexport type SpacingProp = '0' | Spacing | { custom: number | string }\n\nexport const resolveSpacing = (value: SpacingProp | 'auto') => {\n  if (typeof value === 'string') {\n    return value\n  }\n\n  if (typeof value.custom === 'string') {\n    return value.custom\n  }\n\n  return `${value.custom}px`\n}\n\nexport interface MarginProps {\n  m?: ResponsiveProp<SpacingProp>\n  mx?: ResponsiveProp<SpacingProp | 'auto'>\n  my?: ResponsiveProp<SpacingProp>\n  ml?: ResponsiveProp<SpacingProp>\n  mr?: ResponsiveProp<SpacingProp>\n  mt?: ResponsiveProp<SpacingProp>\n  mb?: ResponsiveProp<SpacingProp>\n}\n\nexport interface PaddingProps {\n  p?: ResponsiveProp<SpacingProp>\n  px?: ResponsiveProp<SpacingProp>\n  py?: ResponsiveProp<SpacingProp>\n  pl?: ResponsiveProp<SpacingProp>\n  pr?: ResponsiveProp<SpacingProp>\n  pt?: ResponsiveProp<SpacingProp>\n  pb?: ResponsiveProp<SpacingProp>\n}\n\nexport const margin = (props: MarginProps): string => {\n  const { m, mx, my, ml, mr, mt, mb } = props\n\n  return `\n    ${\n      m\n        ? resolveResponsiveProp(\n            m,\n            (value) => `margin: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      mx\n        ? resolveResponsiveProp(\n            mx,\n            (value) => `\n        margin-left: ${resolveSpacing(value)};\n        margin-right: ${resolveSpacing(value)};\n      `,\n          )\n        : ''\n    }\n    ${\n      my\n        ? resolveResponsiveProp(\n            my,\n            (value) => `\n        margin-top: ${resolveSpacing(value)};\n        margin-bottom: ${resolveSpacing(value)};\n      `,\n          )\n        : ''\n    }\n    ${\n      ml\n        ? resolveResponsiveProp(\n            ml,\n            (value) => `margin-left: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      mr\n        ? resolveResponsiveProp(\n            mr,\n            (value) => `margin-right: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      mt\n        ? resolveResponsiveProp(\n            mt,\n            (value) => `margin-top: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      mb\n        ? resolveResponsiveProp(\n            mb,\n            (value) => `margin-bottom: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n  `\n}\n\nexport const padding = (props: PaddingProps): string => {\n  const { p, px, py, pl, pr, pt, pb } = props\n\n  return `\n    ${\n      p\n        ? resolveResponsiveProp(\n            p,\n            (value) => `padding: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      px\n        ? resolveResponsiveProp(\n            px,\n            (value) => `\n        padding-left: ${resolveSpacing(value)};\n        padding-right: ${resolveSpacing(value)};\n      `,\n          )\n        : ''\n    }\n    ${\n      py\n        ? resolveResponsiveProp(\n            py,\n            (value) => `\n        padding-top: ${resolveSpacing(value)};\n        padding-bottom: ${resolveSpacing(value)};\n      `,\n          )\n        : ''\n    }\n    ${\n      pl\n        ? resolveResponsiveProp(\n            pl,\n            (value) => `padding-left: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      pr\n        ? resolveResponsiveProp(\n            pr,\n            (value) => `padding-right: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      pt\n        ? resolveResponsiveProp(\n            pt,\n            (value) => `padding-top: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n    ${\n      pb\n        ? resolveResponsiveProp(\n            pb,\n            (value) => `padding-bottom: ${resolveSpacing(value)};`,\n          )\n        : ''\n    }\n  `\n}\n"],"names":[],"mappings":"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"}

package/dist/utils/useControlledState.js

@@ -19,3 +19,4 @@ const useControllableState = ({
 };
 
 export { useControllableState };
+//# sourceMappingURL=useControlledState.js.map

package/dist/utils/useControlledState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useControlledState.js","sources":["../../src/utils/useControlledState.ts"],"sourcesContent":["import type { SetStateAction } from 'react'\nimport { useCallback, useState } from 'react'\n\nexport const useControllableState = <StateType>({\n  initialState,\n  stateProp,\n}: {\n  initialState: StateType\n  stateProp: StateType | undefined\n}) => {\n  const [state, setState] = useState(initialState)\n\n  const returnedState = stateProp !== undefined ? stateProp : state\n  const returnedSetState = useCallback<\n    (state: SetStateAction<StateType>) => void\n  >(\n    (nextState) => {\n      if (stateProp !== undefined) {\n        return\n      }\n\n      setState(nextState)\n    },\n    [state, stateProp],\n  )\n\n  return [returnedState, returnedSetState] as const\n}\n"],"names":[],"mappings":";;AAGO,MAAM,uBAAuB,CAAY;AAAA,EAC9C,YAAA;AAAA,EACA,SAAA;AACF,CAGM,KAAA;AACJ,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,YAAY,CAAA,CAAA;AAE/C,EAAM,MAAA,aAAA,GAAgB,SAAc,KAAA,KAAA,CAAA,GAAY,SAAY,GAAA,KAAA,CAAA;AAC5D,EAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,IAGvB,CAAC,SAAc,KAAA;AACb,MAAA,IAAI,cAAc,KAAW,CAAA,EAAA;AAC3B,QAAA,OAAA;AAAA,OACF;AAEA,MAAA,QAAA,CAAS,SAAS,CAAA,CAAA;AAAA,KACpB;AAAA,IACA,CAAC,OAAO,SAAS,CAAA;AAAA,GACnB,CAAA;AAEA,EAAO,OAAA,CAAC,eAAe,gBAAgB,CAAA,CAAA;AACzC;;;;"}

package/dist/utils/visuallyHidden.js

@@ -9,3 +9,4 @@ const visuallyHidden = `
 `;
 
 export { visuallyHidden };
+//# sourceMappingURL=visuallyHidden.js.map

package/dist/utils/visuallyHidden.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"visuallyHidden.js","sources":["../../src/utils/visuallyHidden.ts"],"sourcesContent":["/**\n * Hide element visually but still have it accessible for assitive device\n * @link https://www.a11yproject.com/posts/how-to-hide-content/\n */\nexport const visuallyHidden = `\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n`\n"],"names":[],"mappings":"AAIO,MAAM,cAAiB,GAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrshmllw/smores-react",
-  "version": "5.0.0",
+  "version": "6.0.1",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -84,7 +84,9 @@
   "dependencies": {
     "body-scroll-lock": "^4.0.0-beta.0",
     "date-fns": "^2.16.1",
-    "polished": "^4.1.3"
+    "polished": "^4.1.3",
+    "vite": "^4.5.1",
+    "vite-plugin-svgr": "^4.2.0"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17 || ^18",