@cambly/syntax-core 10.0.0 → 10.2.0-beta.1

package/dist/__chunks/JZMZ537X.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Box/Box.tsx","css-module:./Box.module.css#css-module","css-module:./margin.module.css#css-module","css-module:./padding.module.css#css-module"],"sourcesContent":["import classNames from \"classnames\";\nimport { type AriaRole, type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./Box.module.css\";\nimport marginStyles from \"./margin.module.css\";\nimport paddingStyles from \"./padding.module.css\";\nimport type allColors from \"../colors/allColors\";\nimport colorStyles from \"../colors/colors.module.css\";\nimport roundingStyles from \"../rounding.module.css\";\nimport { forwardRef } from \"react\";\n\ntype AlignItems = \"baseline\" | \"center\" | \"end\" | \"start\" | \"stretch\";\ntype As =\n  | \"article\"\n  | \"aside\"\n  | \"caption\"\n  | \"div\"\n  | \"figcaption\"\n  | \"figure\"\n  | \"footer\"\n  | \"header\"\n  | \"main\"\n  | \"nav\"\n  | \"section\"\n  | \"summary\";\ntype Dimension = number | string;\ntype Direction = \"row\" | \"column\";\ntype Display = \"none\" | \"flex\" | \"block\" | \"inlineBlock\" | \"visuallyHidden\";\ntype Gap = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\ntype JustifyContent =\n  | \"start\"\n  | \"end\"\n  | \"center\"\n  | \"between\"\n  | \"around\"\n  | \"evenly\";\ntype Margin =\n  | -12\n  | -11\n  | -10\n  | -9\n  | -8\n  | -7\n  | -6\n  | -5\n  | -4\n  | -3\n  | -2\n  | -1\n  | 0\n  | 1\n  | 2\n  | 3\n  | 4\n  | 5\n  | 6\n  | 7\n  | 8\n  | 9\n  | 10\n  | 11\n  | 12\n  | \"auto\";\ntype Padding = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\ntype Overflow =\n  | \"visible\"\n  | \"hidden\"\n  | \"scroll\"\n  | \"auto\"\n  | \"inherit\"\n  | \"initial\";\n\ntype BoxProps = {\n  /**\n   * The alignment of the box on the cross axis.\n   *\n   * Responsive props:\n   * * `smAlignItems`\n   * * `lgAlignItems`\n   */\n  alignItems?: AlignItems;\n  /**\n   * Allows the default alignment (or the one specified by align-items) to be overridden for individual flex items.\n   */\n  alignSelf?: \"auto\" | \"start\" | \"end\" | \"center\" | \"baseline\" | \"stretch\";\n  /**\n   * The underlying DOM element usually set for accessibility or SEO reasons.\n   *\n   * @defaultValue \"div\"\n   */\n  as?: As;\n  /**\n   * The background color of the box.\n   */\n  backgroundColor?: (typeof allColors)[number];\n  /**\n   * The children to be rendered inside the box.\n   */\n  children?: ReactNode;\n  /**\n   * An \"escape hatch\" used to apply styles not otherwise available on Box.\n   *\n   * Please use this sparingly and only when you have a good reason to.\n   */\n  dangerouslySetInlineStyle?: {\n    __style: Record<string, string | number | null>;\n  };\n  /**\n   * The flex direction of the box.\n   *\n   * Responsive props:\n   * * `smDirection`\n   * * `lgDirection`\n   *\n   * @defaultValue `row`\n   */\n  direction?: Direction;\n  /**\n   * The display property specifies the display behavior (the type of rendering box) of an element.\n   *\n   * Responsive props:\n   * * `smDisplay`\n   * * `lgDisplay`\n   *\n   * @defaultValue `block`\n   */\n  display?: Display;\n  /**\n   * Sets the flex behavior of a flex item.\n   *\n   * * `none`: The item will not grow or shrink\n   * * `shrink`: The item will shrink if necessary (default browser behavior)\n   * * `grow`: The item will grow if necessary\n   *\n   * @defaultValue `shrink`\n   */\n  flex?: \"none\" | \"shrink\" | \"grow\";\n  /**\n   * By default, flex items will all try to fit onto one line. But if you specify `flexWrap=\"wrap\"`, the flex items will wrap onto multiple lines.\n   *\n   * @defaultValue `nowrap`\n   */\n  flexWrap?: \"wrap\" | \"nowrap\";\n  /**\n   * The gap between the children of the box.\n   */\n  gap?: Gap;\n  /**\n   * The id of the element.\n   */\n  id?: string;\n  /**\n   * The alignment of the box on the cross axis on lg (960px) or larger viewports.\n   */\n  lgAlignItems?: AlignItems;\n  /**\n   * The flex direction on lg (960px) or larger viewports.\n   */\n  lgDirection?: Direction;\n  /**\n   * The display style on lg (960px) or larger viewports.\n   */\n  lgDisplay?: Display;\n  /**\n   * The alignment of the box on the cross axis on lg (960px) or larger viewports.\n   */\n  lgJustifyContent?: JustifyContent;\n  /**\n   * Margin on lg (960px) or larger viewports.\n   */\n  lgMargin?: Margin;\n  /**\n   * Bottom margin on lg (960px) or larger viewports.\n   */\n  lgMarginBottom?: Margin;\n  /**\n   * Margin to the right in left-to-right languages, and to the left in right-to-left languages on lg (960px) or larger viewports.\n   */\n  lgMarginEnd?: Margin;\n  /**\n   * Margin to the left in left-to-right languages, and to the right in right-to-left languages on lg (960px) or larger viewports.\n   */\n  lgMarginStart?: Margin;\n  /**\n   * Top margin on lg (960px) or larger viewports.\n   */\n  lgMarginTop?: Margin;\n  /**\n   * The padding of the box on lg (960px) or larger viewports.\n   */\n  lgPadding?: Padding;\n  /**\n   * The padding of the box on the x-axis on lg (960px) or larger viewports.\n   */\n  lgPaddingX?: Padding;\n  /**\n   * The padding of the box on the y-axis on lg (960px) or larger viewports.\n   */\n  lgPaddingY?: Padding;\n  /**\n   * The margin of the box.\n   *\n   * Responsive props:\n   * * `smMargin`\n   * * `lgMargin`\n   *\n   * @defaultValue 0\n   */\n  margin?: Margin;\n  /**\n   * Bottom margin of the box.\n   *\n   * Responsive props:\n   * * `smMarginBottom`\n   * * `lgMarginBottom`\n   *\n   */\n  marginBottom?: Margin;\n  /**\n   * Margin to the right in left-to-right languages, and to the left in right-to-left languages.\n   *\n   * Responsive props:\n   * * `smMarginEnd`\n   * * `lgMarginEnd`\n   *\n   */\n  marginEnd?: Margin;\n  /**\n   * Margin to the left in left-to-right languages, and to the right in right-to-left languages.\n   *\n   * Responsive props:\n   * * `smMarginStart`\n   * * `lgMarginStart`\n   *\n   */\n  marginStart?: Margin;\n  /**\n   * Top margin of the box.\n   *\n   * Responsive props:\n   * * `smMarginTop`\n   * * `lgMarginTop`\n   *\n   */\n  marginTop?: Margin;\n  /**\n   * The maximum height of the box.\n   */\n  maxHeight?: Dimension;\n  /**\n   * The maximum width of the box.\n   */\n  maxWidth?: Dimension;\n  /**\n   * The minimum height of the box.\n   */\n  minHeight?: Dimension;\n  /**\n   * The minimum width of the box.\n   */\n  minWidth?: Dimension;\n  /**\n   * The height of the box.\n   */\n  height?: Dimension;\n  /**\n   * The alignment of the box on the main axis.\n   *\n   * Responsive props:\n   * * `smJustifyContent`\n   * * `lgJustifyContent`\n   *\n   * @defaultValue \"start\"\n   */\n  justifyContent?: JustifyContent;\n  /**\n   * How box behaves when content does not fit in the box on both axes.\n   *\n   * * `visible`\n   * * `hidden`\n   * * `scroll`\n   * * `auto`\n   * * `inherit`\n   * * `initial`\n   *\n   * @defaultValue \"visible\"\n   */\n  overflow?: Overflow;\n  /**\n   * How box behaves when content does not fit in the box on the X axis.\n   *\n   * * `visible`\n   * * `hidden`\n   * * `scroll`\n   * * `auto`\n   * * `inherit`\n   * * `initial`\n   *\n   * @defaultValue \"visible\"\n   */\n  overflowX?: Overflow;\n  /**\n   * How box behaves when content does not fit in the box on the Y axis.\n   *\n   * * `visible`\n   * * `hidden`\n   * * `scroll`\n   * * `auto`\n   * * `inherit`\n   * * `initial`\n   *\n   * @defaultValue \"visible\"\n   */\n  overflowY?: Overflow;\n  /**\n   * The padding of the box.\n   *\n   * Responsive props:\n   * * `smPadding`\n   * * `lgPadding`\n   *\n   * @defaultValue 0\n   */\n  padding?: Padding;\n  /**\n   * The padding of the box on the x-axis.\n   *\n   * Responsive props:\n   * * `smPaddingX`\n   * * `lgPaddingX`\n   *\n   */\n  paddingX?: Padding;\n  /**\n   * The padding of the box on the y-axis.\n   *\n   * Responsive props:\n   * * `smPaddingY`\n   * * `lgPaddingY`\n   */\n  paddingY?: Padding;\n  /**\n   * The position of the box.\n   *\n   * @defaultValue \"static\"\n   */\n  position?: \"absolute\" | \"fixed\" | \"relative\" | \"static\" | \"sticky\";\n  /**\n   * The role attribute of the box.\n   *\n   * See [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) for the list of valid roles.\n   */\n  role?: AriaRole;\n  /**\n   * Border radius of the box.\n   *\n   * * `none`: 0px\n   * * `sm`: 8px\n   * * `md`: 12px\n   * * `lg`: 16px\n   * * `xl`: 24px\n   * * `full`: 999px\n   *\n   * @defaultValue \"none\"\n   */\n  rounding?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"full\" | \"none\";\n  /**\n   * The alignment of the box on the cross axis on sm (480px) or larger viewports.\n   */\n  smAlignItems?: AlignItems;\n  /**\n   * The flex direction on sm (480px) or larger viewports.\n   */\n  smDirection?: Direction;\n  /**\n   * The display style on sm (480px) or larger viewports.\n   */\n  smDisplay?: Display;\n  /**\n   * The alignment of the box on the main axis on sm (480px) or larger viewports.\n   */\n  smJustifyContent?: JustifyContent;\n  /**\n   * Margin on sm (480px) or larger viewports.\n   */\n  smMargin?: Margin;\n  /**\n   * Bottom margin on sm (480px) or larger viewports.\n   */\n  smMarginBottom?: Margin;\n  /**\n   * Margin to the right in left-to-right languages, and to the left in right-to-left languages on sm (480px) or larger viewports.\n   */\n  smMarginEnd?: Margin;\n  /**\n   * Margin to the left in left-to-right languages, and to the right in right-to-left languages on sm (480px) or larger viewports.\n   */\n  smMarginStart?: Margin;\n  /**\n   * Top margin on sm (480px) or larger viewports.\n   */\n  smMarginTop?: Margin;\n  /**\n   * The padding of the box on sm (480px) or larger viewports.\n   */\n  smPadding?: Padding;\n  /**\n   * The padding of the box on the x-axis on sm (480px) or larger viewports.\n   */\n  smPaddingX?: Padding;\n  /**\n   * The padding of the box on the y-axis on sm (480px) or larger viewports.\n   */\n  smPaddingY?: Padding;\n  /**\n   * The width of the box.\n   */\n  width?: Dimension;\n};\n\n/**\n * [Box](https://cambly-syntax.vercel.app/?path=/docs/components-box--docs) is primitive design component and is used by lots of other components. It keeps details like spacing, borders and colors consistent across all of Syntax.\n *\n * Passthrough props:\n *  * `aria-*`\n *  * `data-testid`\n */\nconst Box = forwardRef<HTMLDivElement, BoxProps>(function Box(\n  props: BoxProps,\n  ref,\n): ReactElement {\n  const { as: BoxElement = \"div\", children, ...boxProps } = props;\n\n  const {\n    // Classname\n    alignItems,\n    smAlignItems,\n    lgAlignItems,\n    alignSelf,\n    backgroundColor,\n    direction,\n    smDirection,\n    lgDirection,\n    display,\n    smDisplay,\n    lgDisplay,\n    flex,\n    flexWrap,\n    gap,\n    justifyContent,\n    smJustifyContent,\n    lgJustifyContent,\n    // Margin\n    margin,\n    marginBottom,\n    marginEnd,\n    marginStart,\n    marginTop,\n    smMargin,\n    smMarginBottom,\n    smMarginEnd,\n    smMarginStart,\n    smMarginTop,\n    lgMargin,\n    lgMarginBottom,\n    lgMarginEnd,\n    lgMarginStart,\n    lgMarginTop,\n    // Overflow\n    overflow,\n    overflowX,\n    overflowY,\n    // Padding\n    padding,\n    paddingX,\n    paddingY,\n    smPadding,\n    smPaddingX,\n    smPaddingY,\n    lgPadding,\n    lgPaddingX,\n    lgPaddingY,\n    position,\n    rounding,\n    // Style\n    dangerouslySetInlineStyle,\n    height,\n    maxHeight,\n    maxWidth,\n    minHeight,\n    minWidth,\n    width,\n    ...maybePassThroughProps\n  } = boxProps;\n\n  const parsedProps = {\n    className: classNames(\n      styles.box,\n      alignItems && styles[`alignItems${alignItems}`],\n      smAlignItems && styles[`alignItems${smAlignItems}Small`],\n      lgAlignItems && styles[`alignItems${lgAlignItems}Large`],\n      alignSelf && styles[`alignSelf${alignSelf}`],\n      backgroundColor && colorStyles[`${backgroundColor}BackgroundColor`],\n      direction && styles[direction],\n      smDirection && styles[`${smDirection}Small`],\n      lgDirection && styles[`${lgDirection}Large`],\n      display && styles[display],\n      smDisplay && styles[`${smDisplay}Small`],\n      lgDisplay && styles[`${lgDisplay}Large`],\n      flex && (flex === \"none\" || flex === \"grow\") && styles[`flex${flex}`],\n      flexWrap && styles.flexWrap,\n      gap != null && styles[`gap${gap}`],\n      margin != null && !marginBottom && marginStyles[`marginBottom${margin}`],\n      margin != null && !marginEnd && marginStyles[`marginEnd${margin}`],\n      margin != null && !marginStart && marginStyles[`marginStart${margin}`],\n      margin != null && !marginTop && marginStyles[`marginTop${margin}`],\n      marginBottom != null && marginStyles[`marginBottom${marginBottom}`],\n      marginEnd != null && marginStyles[`marginEnd${marginEnd}`],\n      marginStart != null && marginStyles[`marginStart${marginStart}`],\n      marginTop != null && marginStyles[`marginTop${marginTop}`],\n      smMargin != null &&\n        !smMarginBottom &&\n        marginStyles[`marginBottom${smMargin}Small`],\n      smMargin != null &&\n        !smMarginEnd &&\n        marginStyles[`marginEnd${smMargin}Small`],\n      smMargin != null &&\n        !smMarginStart &&\n        marginStyles[`marginStart${smMargin}Small`],\n      smMargin != null &&\n        !smMarginTop &&\n        marginStyles[`marginTop${smMargin}Small`],\n      smMarginBottom != null &&\n        marginStyles[`marginBottom${smMarginBottom}Small`],\n      smMarginEnd != null && marginStyles[`marginEnd${smMarginEnd}Small`],\n      smMarginStart != null && marginStyles[`marginStart${smMarginStart}Small`],\n      smMarginTop != null && marginStyles[`marginTop${smMarginTop}Small`],\n      lgMargin != null &&\n        !lgMarginBottom &&\n        marginStyles[`marginBottom${lgMargin}Large`],\n      lgMargin != null &&\n        !lgMarginEnd &&\n        marginStyles[`marginEnd${lgMargin}Large`],\n      lgMargin != null &&\n        !lgMarginStart &&\n        marginStyles[`marginStart${lgMargin}Large`],\n      lgMargin != null &&\n        !lgMarginTop &&\n        marginStyles[`marginTop${lgMargin}Large`],\n      lgMarginBottom != null &&\n        marginStyles[`marginBottom${lgMarginBottom}Large`],\n      lgMarginEnd != null && marginStyles[`marginEnd${lgMarginEnd}Large`],\n      lgMarginStart != null && marginStyles[`marginStart${lgMarginStart}Large`],\n      lgMarginTop != null && marginStyles[`marginTop${lgMarginTop}Large`],\n      padding != null && !paddingX && paddingStyles[`paddingX${padding}`],\n      padding != null && !paddingY && paddingStyles[`paddingY${padding}`],\n      paddingX != null && paddingStyles[`paddingX${paddingX}`],\n      paddingY != null && paddingStyles[`paddingY${paddingY}`],\n      smPadding != null &&\n        !smPaddingX &&\n        paddingStyles[`paddingX${smPadding}Small`],\n      smPadding != null &&\n        !smPaddingY &&\n        paddingStyles[`paddingY${smPadding}Small`],\n      smPaddingX != null && paddingStyles[`paddingX${smPaddingX}Small`],\n      smPaddingY != null && paddingStyles[`paddingY${smPaddingY}Small`],\n      lgPadding != null &&\n        !lgPaddingX &&\n        paddingStyles[`paddingX${lgPadding}Large`],\n      lgPadding != null &&\n        !lgPaddingX &&\n        paddingStyles[`paddingY${lgPadding}Large`],\n      lgPaddingX != null && paddingStyles[`paddingX${lgPaddingX}Large`],\n      lgPaddingY != null && paddingStyles[`paddingY${lgPaddingY}Large`],\n      justifyContent && styles[`justifyContent${justifyContent}`],\n      smJustifyContent && styles[`justifyContent${smJustifyContent}Small`],\n      lgJustifyContent && styles[`justifyContent${lgJustifyContent}Large`],\n      position && position !== \"static\" && styles[position],\n      rounding && rounding !== \"none\" && roundingStyles[`rounding${rounding}`],\n      overflow && styles[`overflow${overflow}`],\n      overflowX && styles[`overflowX${overflowX}`],\n      overflowY && styles[`overflowY${overflowY}`],\n    ),\n    style: {\n      height,\n      maxHeight,\n      maxWidth,\n      minHeight,\n      minWidth,\n      width,\n      ...(dangerouslySetInlineStyle?.__style ?? {}),\n    },\n  };\n\n  const passthroughProps = Object.entries(maybePassThroughProps).reduce<\n    Record<string, number | string | undefined>\n  >((acc, [key]) => {\n    if (\n      key === \"id\" ||\n      key === \"role\" ||\n      key.startsWith(\"aria-\") ||\n      key.startsWith(\"data-testid\")\n    ) {\n      // @ts-expect-error unsafe assignment\n      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n      acc[key] = maybePassThroughProps[key];\n    }\n    return acc;\n  }, {});\n\n  return (\n    <BoxElement {...parsedProps} {...passthroughProps} ref={ref}>\n      {children}\n    </BoxElement>\n  );\n});\n\nexport default Box;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Box/Box.module.css\"; export default {\"box\":\"_box_bg9pe_1\",\"flexnone\":\"_flexnone_bg9pe_5\",\"flexgrow\":\"_flexgrow_bg9pe_9\",\"flexWrap\":\"_flexWrap_bg9pe_13\",\"alignItemscenter\":\"_alignItemscenter_bg9pe_18\",\"alignItemsstart\":\"_alignItemsstart_bg9pe_22\",\"alignItemsend\":\"_alignItemsend_bg9pe_26\",\"alignItemsstretch\":\"_alignItemsstretch_bg9pe_30\",\"alignItemsbaseline\":\"_alignItemsbaseline_bg9pe_34\",\"alignItemscenterSmall\":\"_alignItemscenterSmall_bg9pe_40\",\"alignItemsstartSmall\":\"_alignItemsstartSmall_bg9pe_44\",\"alignItemsendSmall\":\"_alignItemsendSmall_bg9pe_48\",\"alignItemsstretchSmall\":\"_alignItemsstretchSmall_bg9pe_52\",\"alignItemsbaselineSmall\":\"_alignItemsbaselineSmall_bg9pe_56\",\"alignItemscenterLarge\":\"_alignItemscenterLarge_bg9pe_63\",\"alignItemsstartLarge\":\"_alignItemsstartLarge_bg9pe_67\",\"alignItemsendLarge\":\"_alignItemsendLarge_bg9pe_71\",\"alignItemsstretchLarge\":\"_alignItemsstretchLarge_bg9pe_75\",\"alignItemsbaselineLarge\":\"_alignItemsbaselineLarge_bg9pe_79\",\"alignSelfcenter\":\"_alignSelfcenter_bg9pe_85\",\"alignSelfstart\":\"_alignSelfstart_bg9pe_89\",\"alignSelfend\":\"_alignSelfend_bg9pe_93\",\"alignSelfstretch\":\"_alignSelfstretch_bg9pe_97\",\"alignSelfbaseline\":\"_alignSelfbaseline_bg9pe_101\",\"alignSelfauto\":\"_alignSelfauto_bg9pe_105\",\"block\":\"_block_bg9pe_110\",\"flex\":\"_flex_bg9pe_5\",\"inlineBlock\":\"_inlineBlock_bg9pe_118\",\"none\":\"_none_bg9pe_122\",\"visuallyHidden\":\"_visuallyHidden_bg9pe_126\",\"blockSmall\":\"_blockSmall_bg9pe_140\",\"flexSmall\":\"_flexSmall_bg9pe_144\",\"inlineBlockSmall\":\"_inlineBlockSmall_bg9pe_148\",\"noneSmall\":\"_noneSmall_bg9pe_152\",\"visuallyHiddenSmall\":\"_visuallyHiddenSmall_bg9pe_156\",\"blockLarge\":\"_blockLarge_bg9pe_171\",\"flexLarge\":\"_flexLarge_bg9pe_175\",\"inlineBlockLarge\":\"_inlineBlockLarge_bg9pe_179\",\"noneLarge\":\"_noneLarge_bg9pe_183\",\"visuallyHiddenLarge\":\"_visuallyHiddenLarge_bg9pe_187\",\"column\":\"_column_bg9pe_201\",\"row\":\"_row_bg9pe_205\",\"columnSmall\":\"_columnSmall_bg9pe_211\",\"rowSmall\":\"_rowSmall_bg9pe_215\",\"columnLarge\":\"_columnLarge_bg9pe_222\",\"rowLarge\":\"_rowLarge_bg9pe_226\",\"gap0\":\"_gap0_bg9pe_232\",\"gap1\":\"_gap1_bg9pe_236\",\"gap2\":\"_gap2_bg9pe_240\",\"gap3\":\"_gap3_bg9pe_244\",\"gap4\":\"_gap4_bg9pe_248\",\"gap5\":\"_gap5_bg9pe_252\",\"gap6\":\"_gap6_bg9pe_256\",\"gap7\":\"_gap7_bg9pe_260\",\"gap8\":\"_gap8_bg9pe_264\",\"gap9\":\"_gap9_bg9pe_268\",\"gap10\":\"_gap10_bg9pe_272\",\"gap11\":\"_gap11_bg9pe_276\",\"gap12\":\"_gap12_bg9pe_280\",\"justifyContentcenter\":\"_justifyContentcenter_bg9pe_285\",\"justifyContentstart\":\"_justifyContentstart_bg9pe_289\",\"justifyContentend\":\"_justifyContentend_bg9pe_293\",\"justifyContentbetween\":\"_justifyContentbetween_bg9pe_297\",\"justifyContentaround\":\"_justifyContentaround_bg9pe_301\",\"justifyContentevenly\":\"_justifyContentevenly_bg9pe_305\",\"justifyContentcenterSmall\":\"_justifyContentcenterSmall_bg9pe_311\",\"justifyContentstartSmall\":\"_justifyContentstartSmall_bg9pe_315\",\"justifyContentendSmall\":\"_justifyContentendSmall_bg9pe_319\",\"justifyContentbetweenSmall\":\"_justifyContentbetweenSmall_bg9pe_323\",\"justifyContentaroundSmall\":\"_justifyContentaroundSmall_bg9pe_327\",\"justifyContentevenlySmall\":\"_justifyContentevenlySmall_bg9pe_331\",\"justifyContentcenterLarge\":\"_justifyContentcenterLarge_bg9pe_338\",\"justifyContentstartLarge\":\"_justifyContentstartLarge_bg9pe_342\",\"justifyContentendLarge\":\"_justifyContentendLarge_bg9pe_346\",\"justifyContentbetweenLarge\":\"_justifyContentbetweenLarge_bg9pe_350\",\"justifyContentaroundLarge\":\"_justifyContentaroundLarge_bg9pe_354\",\"justifyContentevenlyLarge\":\"_justifyContentevenlyLarge_bg9pe_358\",\"overflowvisible\":\"_overflowvisible_bg9pe_364\",\"overflowhidden\":\"_overflowhidden_bg9pe_368\",\"overflowscroll\":\"_overflowscroll_bg9pe_372\",\"overflowauto\":\"_overflowauto_bg9pe_376\",\"overflowinherit\":\"_overflowinherit_bg9pe_380\",\"overflowinitial\":\"_overflowinitial_bg9pe_384\",\"overflowXvisible\":\"_overflowXvisible_bg9pe_388\",\"overflowXhidden\":\"_overflowXhidden_bg9pe_392\",\"overflowXscroll\":\"_overflowXscroll_bg9pe_396\",\"overflowXauto\":\"_overflowXauto_bg9pe_400\",\"overflowXinherit\":\"_overflowXinherit_bg9pe_404\",\"overflowXinitial\":\"_overflowXinitial_bg9pe_408\",\"overflowYvisible\":\"_overflowYvisible_bg9pe_412\",\"overflowYhidden\":\"_overflowYhidden_bg9pe_416\",\"overflowYscroll\":\"_overflowYscroll_bg9pe_420\",\"overflowYauto\":\"_overflowYauto_bg9pe_424\",\"overflowYinherit\":\"_overflowYinherit_bg9pe_428\",\"overflowYinitial\":\"_overflowYinitial_bg9pe_432\",\"absolute\":\"_absolute_bg9pe_437\",\"fixed\":\"_fixed_bg9pe_441\",\"relative\":\"_relative_bg9pe_445\",\"sticky\":\"_sticky_bg9pe_449\"}","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Box/margin.module.css\"; export default {\"marginBottom-12\":\"_marginBottom-12_1whn1_2\",\"marginBottom-11\":\"_marginBottom-11_1whn1_6\",\"marginBottom-10\":\"_marginBottom-10_1whn1_10\",\"marginBottom-9\":\"_marginBottom-9_1whn1_14\",\"marginBottom-8\":\"_marginBottom-8_1whn1_18\",\"marginBottom-7\":\"_marginBottom-7_1whn1_22\",\"marginBottom-6\":\"_marginBottom-6_1whn1_26\",\"marginBottom-5\":\"_marginBottom-5_1whn1_30\",\"marginBottom-4\":\"_marginBottom-4_1whn1_34\",\"marginBottom-3\":\"_marginBottom-3_1whn1_38\",\"marginBottom-2\":\"_marginBottom-2_1whn1_42\",\"marginBottom-1\":\"_marginBottom-1_1whn1_2\",\"marginBottom0\":\"_marginBottom0_1whn1_50\",\"marginBottom1\":\"_marginBottom1_1whn1_54\",\"marginBottom2\":\"_marginBottom2_1whn1_58\",\"marginBottom3\":\"_marginBottom3_1whn1_62\",\"marginBottom4\":\"_marginBottom4_1whn1_66\",\"marginBottom5\":\"_marginBottom5_1whn1_70\",\"marginBottom6\":\"_marginBottom6_1whn1_74\",\"marginBottom7\":\"_marginBottom7_1whn1_78\",\"marginBottom8\":\"_marginBottom8_1whn1_82\",\"marginBottom9\":\"_marginBottom9_1whn1_86\",\"marginBottom10\":\"_marginBottom10_1whn1_90\",\"marginBottom11\":\"_marginBottom11_1whn1_94\",\"marginBottom12\":\"_marginBottom12_1whn1_98\",\"marginBottomauto\":\"_marginBottomauto_1whn1_102\",\"marginEnd-12\":\"_marginEnd-12_1whn1_107\",\"marginEnd-11\":\"_marginEnd-11_1whn1_111\",\"marginEnd-10\":\"_marginEnd-10_1whn1_115\",\"marginEnd-9\":\"_marginEnd-9_1whn1_119\",\"marginEnd-8\":\"_marginEnd-8_1whn1_123\",\"marginEnd-7\":\"_marginEnd-7_1whn1_127\",\"marginEnd-6\":\"_marginEnd-6_1whn1_131\",\"marginEnd-5\":\"_marginEnd-5_1whn1_135\",\"marginEnd-4\":\"_marginEnd-4_1whn1_139\",\"marginEnd-3\":\"_marginEnd-3_1whn1_143\",\"marginEnd-2\":\"_marginEnd-2_1whn1_147\",\"marginEnd-1\":\"_marginEnd-1_1whn1_107\",\"marginEnd0\":\"_marginEnd0_1whn1_155\",\"marginEnd1\":\"_marginEnd1_1whn1_159\",\"marginEnd2\":\"_marginEnd2_1whn1_163\",\"marginEnd3\":\"_marginEnd3_1whn1_167\",\"marginEnd4\":\"_marginEnd4_1whn1_171\",\"marginEnd5\":\"_marginEnd5_1whn1_175\",\"marginEnd6\":\"_marginEnd6_1whn1_179\",\"marginEnd7\":\"_marginEnd7_1whn1_183\",\"marginEnd8\":\"_marginEnd8_1whn1_187\",\"marginEnd9\":\"_marginEnd9_1whn1_191\",\"marginEnd10\":\"_marginEnd10_1whn1_195\",\"marginEnd11\":\"_marginEnd11_1whn1_199\",\"marginEnd12\":\"_marginEnd12_1whn1_203\",\"marginEndauto\":\"_marginEndauto_1whn1_207\",\"marginStart-12\":\"_marginStart-12_1whn1_212\",\"marginStart-11\":\"_marginStart-11_1whn1_216\",\"marginStart-10\":\"_marginStart-10_1whn1_220\",\"marginStart-9\":\"_marginStart-9_1whn1_224\",\"marginStart-8\":\"_marginStart-8_1whn1_228\",\"marginStart-7\":\"_marginStart-7_1whn1_232\",\"marginStart-6\":\"_marginStart-6_1whn1_236\",\"marginStart-5\":\"_marginStart-5_1whn1_240\",\"marginStart-4\":\"_marginStart-4_1whn1_244\",\"marginStart-3\":\"_marginStart-3_1whn1_248\",\"marginStart-2\":\"_marginStart-2_1whn1_252\",\"marginStart-1\":\"_marginStart-1_1whn1_212\",\"marginStart0\":\"_marginStart0_1whn1_260\",\"marginStart1\":\"_marginStart1_1whn1_264\",\"marginStart2\":\"_marginStart2_1whn1_268\",\"marginStart3\":\"_marginStart3_1whn1_272\",\"marginStart4\":\"_marginStart4_1whn1_276\",\"marginStart5\":\"_marginStart5_1whn1_280\",\"marginStart6\":\"_marginStart6_1whn1_284\",\"marginStart7\":\"_marginStart7_1whn1_288\",\"marginStart8\":\"_marginStart8_1whn1_292\",\"marginStart9\":\"_marginStart9_1whn1_296\",\"marginStart10\":\"_marginStart10_1whn1_300\",\"marginStart11\":\"_marginStart11_1whn1_304\",\"marginStart12\":\"_marginStart12_1whn1_308\",\"marginStartauto\":\"_marginStartauto_1whn1_312\",\"marginTop-12\":\"_marginTop-12_1whn1_317\",\"marginTop-11\":\"_marginTop-11_1whn1_321\",\"marginTop-10\":\"_marginTop-10_1whn1_325\",\"marginTop-9\":\"_marginTop-9_1whn1_329\",\"marginTop-8\":\"_marginTop-8_1whn1_333\",\"marginTop-7\":\"_marginTop-7_1whn1_337\",\"marginTop-6\":\"_marginTop-6_1whn1_341\",\"marginTop-5\":\"_marginTop-5_1whn1_345\",\"marginTop-4\":\"_marginTop-4_1whn1_349\",\"marginTop-3\":\"_marginTop-3_1whn1_353\",\"marginTop-2\":\"_marginTop-2_1whn1_357\",\"marginTop-1\":\"_marginTop-1_1whn1_317\",\"marginTop0\":\"_marginTop0_1whn1_365\",\"marginTop1\":\"_marginTop1_1whn1_369\",\"marginTop2\":\"_marginTop2_1whn1_373\",\"marginTop3\":\"_marginTop3_1whn1_377\",\"marginTop4\":\"_marginTop4_1whn1_381\",\"marginTop5\":\"_marginTop5_1whn1_385\",\"marginTop6\":\"_marginTop6_1whn1_389\",\"marginTop7\":\"_marginTop7_1whn1_393\",\"marginTop8\":\"_marginTop8_1whn1_397\",\"marginTop9\":\"_marginTop9_1whn1_401\",\"marginTop10\":\"_marginTop10_1whn1_405\",\"marginTop11\":\"_marginTop11_1whn1_409\",\"marginTop12\":\"_marginTop12_1whn1_413\",\"marginTopauto\":\"_marginTopauto_1whn1_417\",\"marginBottom-12Small\":\"_marginBottom-12Small_1whn1_423\",\"marginBottom-11Small\":\"_marginBottom-11Small_1whn1_427\",\"marginBottom-10Small\":\"_marginBottom-10Small_1whn1_431\",\"marginBottom-9Small\":\"_marginBottom-9Small_1whn1_435\",\"marginBottom-8Small\":\"_marginBottom-8Small_1whn1_439\",\"marginBottom-7Small\":\"_marginBottom-7Small_1whn1_443\",\"marginBottom-6Small\":\"_marginBottom-6Small_1whn1_447\",\"marginBottom-5Small\":\"_marginBottom-5Small_1whn1_451\",\"marginBottom-4Small\":\"_marginBottom-4Small_1whn1_455\",\"marginBottom-3Small\":\"_marginBottom-3Small_1whn1_459\",\"marginBottom-2Small\":\"_marginBottom-2Small_1whn1_463\",\"marginBottom-1Small\":\"_marginBottom-1Small_1whn1_467\",\"marginBottom0Small\":\"_marginBottom0Small_1whn1_471\",\"marginBottom1Small\":\"_marginBottom1Small_1whn1_475\",\"marginBottom2Small\":\"_marginBottom2Small_1whn1_479\",\"marginBottom3Small\":\"_marginBottom3Small_1whn1_483\",\"marginBottom4Small\":\"_marginBottom4Small_1whn1_487\",\"marginBottom5Small\":\"_marginBottom5Small_1whn1_491\",\"marginBottom6Small\":\"_marginBottom6Small_1whn1_495\",\"marginBottom7Small\":\"_marginBottom7Small_1whn1_499\",\"marginBottom8Small\":\"_marginBottom8Small_1whn1_503\",\"marginBottom9Small\":\"_marginBottom9Small_1whn1_507\",\"marginBottom10Small\":\"_marginBottom10Small_1whn1_511\",\"marginBottom11Small\":\"_marginBottom11Small_1whn1_515\",\"marginBottom12Small\":\"_marginBottom12Small_1whn1_519\",\"marginBottomautoSmall\":\"_marginBottomautoSmall_1whn1_523\",\"marginEnd-12Small\":\"_marginEnd-12Small_1whn1_527\",\"marginEnd-11Small\":\"_marginEnd-11Small_1whn1_531\",\"marginEnd-10Small\":\"_marginEnd-10Small_1whn1_535\",\"marginEnd-9Small\":\"_marginEnd-9Small_1whn1_539\",\"marginEnd-8Small\":\"_marginEnd-8Small_1whn1_543\",\"marginEnd-7Small\":\"_marginEnd-7Small_1whn1_547\",\"marginEnd-6Small\":\"_marginEnd-6Small_1whn1_551\",\"marginEnd-5Small\":\"_marginEnd-5Small_1whn1_555\",\"marginEnd-4Small\":\"_marginEnd-4Small_1whn1_559\",\"marginEnd-3Small\":\"_marginEnd-3Small_1whn1_563\",\"marginEnd-2Small\":\"_marginEnd-2Small_1whn1_567\",\"marginEnd-1Small\":\"_marginEnd-1Small_1whn1_571\",\"marginEnd0Small\":\"_marginEnd0Small_1whn1_575\",\"marginEnd1Small\":\"_marginEnd1Small_1whn1_579\",\"marginEnd2Small\":\"_marginEnd2Small_1whn1_583\",\"marginEnd3Small\":\"_marginEnd3Small_1whn1_587\",\"marginEnd4Small\":\"_marginEnd4Small_1whn1_591\",\"marginEnd5Small\":\"_marginEnd5Small_1whn1_595\",\"marginEnd6Small\":\"_marginEnd6Small_1whn1_599\",\"marginEnd7Small\":\"_marginEnd7Small_1whn1_603\",\"marginEnd8Small\":\"_marginEnd8Small_1whn1_607\",\"marginEnd9Small\":\"_marginEnd9Small_1whn1_611\",\"marginEnd10Small\":\"_marginEnd10Small_1whn1_615\",\"marginEnd11Small\":\"_marginEnd11Small_1whn1_619\",\"marginEnd12Small\":\"_marginEnd12Small_1whn1_623\",\"marginEndautoSmall\":\"_marginEndautoSmall_1whn1_627\",\"marginStart-12Small\":\"_marginStart-12Small_1whn1_631\",\"marginStart-11Small\":\"_marginStart-11Small_1whn1_635\",\"marginStart-10Small\":\"_marginStart-10Small_1whn1_639\",\"marginStart-9Small\":\"_marginStart-9Small_1whn1_643\",\"marginStart-8Small\":\"_marginStart-8Small_1whn1_647\",\"marginStart-7Small\":\"_marginStart-7Small_1whn1_651\",\"marginStart-6Small\":\"_marginStart-6Small_1whn1_655\",\"marginStart-5Small\":\"_marginStart-5Small_1whn1_659\",\"marginStart-4Small\":\"_marginStart-4Small_1whn1_663\",\"marginStart-3Small\":\"_marginStart-3Small_1whn1_667\",\"marginStart-2Small\":\"_marginStart-2Small_1whn1_671\",\"marginStart-1Small\":\"_marginStart-1Small_1whn1_675\",\"marginStart0Small\":\"_marginStart0Small_1whn1_679\",\"marginStart1Small\":\"_marginStart1Small_1whn1_683\",\"marginStart2Small\":\"_marginStart2Small_1whn1_687\",\"marginStart3Small\":\"_marginStart3Small_1whn1_691\",\"marginStart4Small\":\"_marginStart4Small_1whn1_695\",\"marginStart5Small\":\"_marginStart5Small_1whn1_699\",\"marginStart6Small\":\"_marginStart6Small_1whn1_703\",\"marginStart7Small\":\"_marginStart7Small_1whn1_707\",\"marginStart8Small\":\"_marginStart8Small_1whn1_711\",\"marginStart9Small\":\"_marginStart9Small_1whn1_715\",\"marginStart10Small\":\"_marginStart10Small_1whn1_719\",\"marginStart11Small\":\"_marginStart11Small_1whn1_723\",\"marginStart12Small\":\"_marginStart12Small_1whn1_727\",\"marginStartautoSmall\":\"_marginStartautoSmall_1whn1_731\",\"marginTop-12Small\":\"_marginTop-12Small_1whn1_735\",\"marginTop-11Small\":\"_marginTop-11Small_1whn1_739\",\"marginTop-10Small\":\"_marginTop-10Small_1whn1_743\",\"marginTop-9Small\":\"_marginTop-9Small_1whn1_747\",\"marginTop-8Small\":\"_marginTop-8Small_1whn1_751\",\"marginTop-7Small\":\"_marginTop-7Small_1whn1_755\",\"marginTop-6Small\":\"_marginTop-6Small_1whn1_759\",\"marginTop-5Small\":\"_marginTop-5Small_1whn1_763\",\"marginTop-4Small\":\"_marginTop-4Small_1whn1_767\",\"marginTop-3Small\":\"_marginTop-3Small_1whn1_771\",\"marginTop-2Small\":\"_marginTop-2Small_1whn1_775\",\"marginTop-1Small\":\"_marginTop-1Small_1whn1_779\",\"marginTop0Small\":\"_marginTop0Small_1whn1_783\",\"marginTop1Small\":\"_marginTop1Small_1whn1_787\",\"marginTop2Small\":\"_marginTop2Small_1whn1_791\",\"marginTop3Small\":\"_marginTop3Small_1whn1_795\",\"marginTop4Small\":\"_marginTop4Small_1whn1_799\",\"marginTop5Small\":\"_marginTop5Small_1whn1_803\",\"marginTop6Small\":\"_marginTop6Small_1whn1_807\",\"marginTop7Small\":\"_marginTop7Small_1whn1_811\",\"marginTop8Small\":\"_marginTop8Small_1whn1_815\",\"marginTop9Small\":\"_marginTop9Small_1whn1_819\",\"marginTop10Small\":\"_marginTop10Small_1whn1_823\",\"marginTop11Small\":\"_marginTop11Small_1whn1_827\",\"marginTop12Small\":\"_marginTop12Small_1whn1_831\",\"marginTopautoSmall\":\"_marginTopautoSmall_1whn1_835\",\"marginBottom-12Large\":\"_marginBottom-12Large_1whn1_842\",\"marginBottom-11Large\":\"_marginBottom-11Large_1whn1_846\",\"marginBottom-10Large\":\"_marginBottom-10Large_1whn1_850\",\"marginBottom-9Large\":\"_marginBottom-9Large_1whn1_854\",\"marginBottom-8Large\":\"_marginBottom-8Large_1whn1_858\",\"marginBottom-7Large\":\"_marginBottom-7Large_1whn1_862\",\"marginBottom-6Large\":\"_marginBottom-6Large_1whn1_866\",\"marginBottom-5Large\":\"_marginBottom-5Large_1whn1_870\",\"marginBottom-4Large\":\"_marginBottom-4Large_1whn1_874\",\"marginBottom-3Large\":\"_marginBottom-3Large_1whn1_878\",\"marginBottom-2Large\":\"_marginBottom-2Large_1whn1_882\",\"marginBottom-1Large\":\"_marginBottom-1Large_1whn1_886\",\"marginBottom0Large\":\"_marginBottom0Large_1whn1_890\",\"marginBottom1Large\":\"_marginBottom1Large_1whn1_894\",\"marginBottom2Large\":\"_marginBottom2Large_1whn1_898\",\"marginBottom3Large\":\"_marginBottom3Large_1whn1_902\",\"marginBottom4Large\":\"_marginBottom4Large_1whn1_906\",\"marginBottom5Large\":\"_marginBottom5Large_1whn1_910\",\"marginBottom6Large\":\"_marginBottom6Large_1whn1_914\",\"marginBottom7Large\":\"_marginBottom7Large_1whn1_918\",\"marginBottom8Large\":\"_marginBottom8Large_1whn1_922\",\"marginBottom9Large\":\"_marginBottom9Large_1whn1_926\",\"marginBottom10Large\":\"_marginBottom10Large_1whn1_930\",\"marginBottom11Large\":\"_marginBottom11Large_1whn1_934\",\"marginBottom12Large\":\"_marginBottom12Large_1whn1_938\",\"marginBottomautoLarge\":\"_marginBottomautoLarge_1whn1_942\",\"marginEnd-12Large\":\"_marginEnd-12Large_1whn1_946\",\"marginEnd-11Large\":\"_marginEnd-11Large_1whn1_950\",\"marginEnd-10Large\":\"_marginEnd-10Large_1whn1_954\",\"marginEnd-9Large\":\"_marginEnd-9Large_1whn1_958\",\"marginEnd-8Large\":\"_marginEnd-8Large_1whn1_962\",\"marginEnd-7Large\":\"_marginEnd-7Large_1whn1_966\",\"marginEnd-6Large\":\"_marginEnd-6Large_1whn1_970\",\"marginEnd-5Large\":\"_marginEnd-5Large_1whn1_974\",\"marginEnd-4Large\":\"_marginEnd-4Large_1whn1_978\",\"marginEnd-3Large\":\"_marginEnd-3Large_1whn1_982\",\"marginEnd-2Large\":\"_marginEnd-2Large_1whn1_986\",\"marginEnd-1Large\":\"_marginEnd-1Large_1whn1_990\",\"marginEnd0Large\":\"_marginEnd0Large_1whn1_994\",\"marginEnd1Large\":\"_marginEnd1Large_1whn1_998\",\"marginEnd2Large\":\"_marginEnd2Large_1whn1_1002\",\"marginEnd3Large\":\"_marginEnd3Large_1whn1_1006\",\"marginEnd4Large\":\"_marginEnd4Large_1whn1_1010\",\"marginEnd5Large\":\"_marginEnd5Large_1whn1_1014\",\"marginEnd6Large\":\"_marginEnd6Large_1whn1_1018\",\"marginEnd7Large\":\"_marginEnd7Large_1whn1_1022\",\"marginEnd8Large\":\"_marginEnd8Large_1whn1_1026\",\"marginEnd9Large\":\"_marginEnd9Large_1whn1_1030\",\"marginEnd10Large\":\"_marginEnd10Large_1whn1_1034\",\"marginEnd11Large\":\"_marginEnd11Large_1whn1_1038\",\"marginEnd12Large\":\"_marginEnd12Large_1whn1_1042\",\"marginEndautoLarge\":\"_marginEndautoLarge_1whn1_1046\",\"marginStart-12Large\":\"_marginStart-12Large_1whn1_1050\",\"marginStart-11Large\":\"_marginStart-11Large_1whn1_1054\",\"marginStart-10Large\":\"_marginStart-10Large_1whn1_1058\",\"marginStart-9Large\":\"_marginStart-9Large_1whn1_1062\",\"marginStart-8Large\":\"_marginStart-8Large_1whn1_1066\",\"marginStart-7Large\":\"_marginStart-7Large_1whn1_1070\",\"marginStart-6Large\":\"_marginStart-6Large_1whn1_1074\",\"marginStart-5Large\":\"_marginStart-5Large_1whn1_1078\",\"marginStart-4Large\":\"_marginStart-4Large_1whn1_1082\",\"marginStart-3Large\":\"_marginStart-3Large_1whn1_1086\",\"marginStart-2Large\":\"_marginStart-2Large_1whn1_1090\",\"marginStart-1Large\":\"_marginStart-1Large_1whn1_1094\",\"marginStart0Large\":\"_marginStart0Large_1whn1_1098\",\"marginStart1Large\":\"_marginStart1Large_1whn1_1102\",\"marginStart2Large\":\"_marginStart2Large_1whn1_1106\",\"marginStart3Large\":\"_marginStart3Large_1whn1_1110\",\"marginStart4Large\":\"_marginStart4Large_1whn1_1114\",\"marginStart5Large\":\"_marginStart5Large_1whn1_1118\",\"marginStart6Large\":\"_marginStart6Large_1whn1_1122\",\"marginStart7Large\":\"_marginStart7Large_1whn1_1126\",\"marginStart8Large\":\"_marginStart8Large_1whn1_1130\",\"marginStart9Large\":\"_marginStart9Large_1whn1_1134\",\"marginStart10Large\":\"_marginStart10Large_1whn1_1138\",\"marginStart11Large\":\"_marginStart11Large_1whn1_1142\",\"marginStart12Large\":\"_marginStart12Large_1whn1_1146\",\"marginStartautoLarge\":\"_marginStartautoLarge_1whn1_1150\",\"marginTop-12Large\":\"_marginTop-12Large_1whn1_1154\",\"marginTop-11Large\":\"_marginTop-11Large_1whn1_1158\",\"marginTop-10Large\":\"_marginTop-10Large_1whn1_1162\",\"marginTop-9Large\":\"_marginTop-9Large_1whn1_1166\",\"marginTop-8Large\":\"_marginTop-8Large_1whn1_1170\",\"marginTop-7Large\":\"_marginTop-7Large_1whn1_1174\",\"marginTop-6Large\":\"_marginTop-6Large_1whn1_1178\",\"marginTop-5Large\":\"_marginTop-5Large_1whn1_1182\",\"marginTop-4Large\":\"_marginTop-4Large_1whn1_1186\",\"marginTop-3Large\":\"_marginTop-3Large_1whn1_1190\",\"marginTop-2Large\":\"_marginTop-2Large_1whn1_1194\",\"marginTop-1Large\":\"_marginTop-1Large_1whn1_1198\",\"marginTop0Large\":\"_marginTop0Large_1whn1_1202\",\"marginTop1Large\":\"_marginTop1Large_1whn1_1206\",\"marginTop2Large\":\"_marginTop2Large_1whn1_1210\",\"marginTop3Large\":\"_marginTop3Large_1whn1_1214\",\"marginTop4Large\":\"_marginTop4Large_1whn1_1218\",\"marginTop5Large\":\"_marginTop5Large_1whn1_1222\",\"marginTop6Large\":\"_marginTop6Large_1whn1_1226\",\"marginTop7Large\":\"_marginTop7Large_1whn1_1230\",\"marginTop8Large\":\"_marginTop8Large_1whn1_1234\",\"marginTop9Large\":\"_marginTop9Large_1whn1_1238\",\"marginTop10Large\":\"_marginTop10Large_1whn1_1242\",\"marginTop11Large\":\"_marginTop11Large_1whn1_1246\",\"marginTop12Large\":\"_marginTop12Large_1whn1_1250\",\"marginTopautoLarge\":\"_marginTopautoLarge_1whn1_1254\"}","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Box/padding.module.css\"; export default {\"paddingX0\":\"_paddingX0_1aqye_2\",\"paddingX1\":\"_paddingX1_1aqye_7\",\"paddingX2\":\"_paddingX2_1aqye_12\",\"paddingX3\":\"_paddingX3_1aqye_17\",\"paddingX4\":\"_paddingX4_1aqye_22\",\"paddingX5\":\"_paddingX5_1aqye_27\",\"paddingX6\":\"_paddingX6_1aqye_32\",\"paddingX7\":\"_paddingX7_1aqye_37\",\"paddingX8\":\"_paddingX8_1aqye_42\",\"paddingX9\":\"_paddingX9_1aqye_47\",\"paddingX10\":\"_paddingX10_1aqye_52\",\"paddingX11\":\"_paddingX11_1aqye_57\",\"paddingX12\":\"_paddingX12_1aqye_62\",\"paddingY0\":\"_paddingY0_1aqye_67\",\"paddingY1\":\"_paddingY1_1aqye_72\",\"paddingY2\":\"_paddingY2_1aqye_77\",\"paddingY3\":\"_paddingY3_1aqye_82\",\"paddingY4\":\"_paddingY4_1aqye_87\",\"paddingY5\":\"_paddingY5_1aqye_92\",\"paddingY6\":\"_paddingY6_1aqye_97\",\"paddingY7\":\"_paddingY7_1aqye_102\",\"paddingY8\":\"_paddingY8_1aqye_107\",\"paddingY9\":\"_paddingY9_1aqye_112\",\"paddingY10\":\"_paddingY10_1aqye_117\",\"paddingY11\":\"_paddingY11_1aqye_122\",\"paddingY12\":\"_paddingY12_1aqye_127\",\"paddingX0Small\":\"_paddingX0Small_1aqye_134\",\"paddingX1Small\":\"_paddingX1Small_1aqye_139\",\"paddingX2Small\":\"_paddingX2Small_1aqye_144\",\"paddingX3Small\":\"_paddingX3Small_1aqye_149\",\"paddingX4Small\":\"_paddingX4Small_1aqye_154\",\"paddingX5Small\":\"_paddingX5Small_1aqye_159\",\"paddingX6Small\":\"_paddingX6Small_1aqye_164\",\"paddingX7Small\":\"_paddingX7Small_1aqye_169\",\"paddingX8Small\":\"_paddingX8Small_1aqye_174\",\"paddingX9Small\":\"_paddingX9Small_1aqye_179\",\"paddingX10Small\":\"_paddingX10Small_1aqye_184\",\"paddingX11Small\":\"_paddingX11Small_1aqye_189\",\"paddingX12Small\":\"_paddingX12Small_1aqye_194\",\"paddingY0Small\":\"_paddingY0Small_1aqye_199\",\"paddingY1Small\":\"_paddingY1Small_1aqye_204\",\"paddingY2Small\":\"_paddingY2Small_1aqye_209\",\"paddingY3Small\":\"_paddingY3Small_1aqye_214\",\"paddingY4Small\":\"_paddingY4Small_1aqye_219\",\"paddingY5Small\":\"_paddingY5Small_1aqye_224\",\"paddingY6Small\":\"_paddingY6Small_1aqye_229\",\"paddingY7Small\":\"_paddingY7Small_1aqye_234\",\"paddingY8Small\":\"_paddingY8Small_1aqye_239\",\"paddingY9Small\":\"_paddingY9Small_1aqye_244\",\"paddingY10Small\":\"_paddingY10Small_1aqye_249\",\"paddingY11Small\":\"_paddingY11Small_1aqye_254\",\"paddingY12Small\":\"_paddingY12Small_1aqye_259\",\"paddingX0Large\":\"_paddingX0Large_1aqye_267\",\"paddingX1Large\":\"_paddingX1Large_1aqye_272\",\"paddingX2Large\":\"_paddingX2Large_1aqye_277\",\"paddingX3Large\":\"_paddingX3Large_1aqye_282\",\"paddingX4Large\":\"_paddingX4Large_1aqye_287\",\"paddingX5Large\":\"_paddingX5Large_1aqye_292\",\"paddingX6Large\":\"_paddingX6Large_1aqye_297\",\"paddingX7Large\":\"_paddingX7Large_1aqye_302\",\"paddingX8Large\":\"_paddingX8Large_1aqye_307\",\"paddingX9Large\":\"_paddingX9Large_1aqye_312\",\"paddingX10Large\":\"_paddingX10Large_1aqye_317\",\"paddingX11Large\":\"_paddingX11Large_1aqye_322\",\"paddingX12Large\":\"_paddingX12Large_1aqye_327\",\"paddingY0Large\":\"_paddingY0Large_1aqye_332\",\"paddingY1Large\":\"_paddingY1Large_1aqye_337\",\"paddingY2Large\":\"_paddingY2Large_1aqye_342\",\"paddingY3Large\":\"_paddingY3Large_1aqye_347\",\"paddingY4Large\":\"_paddingY4Large_1aqye_352\",\"paddingY5Large\":\"_paddingY5Large_1aqye_357\",\"paddingY6Large\":\"_paddingY6Large_1aqye_362\",\"paddingY7Large\":\"_paddingY7Large_1aqye_367\",\"paddingY8Large\":\"_paddingY8Large_1aqye_372\",\"paddingY9Large\":\"_paddingY9Large_1aqye_377\",\"paddingY10Large\":\"_paddingY10Large_1aqye_382\",\"paddingY11Large\":\"_paddingY11Large_1aqye_387\",\"paddingY12Large\":\"_paddingY12Large_1aqye_392\"}"],"mappings":"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","names":["Box"]}

package/dist/__chunks/{DVVFHZBW.mjs → K3JR7BCX.mjs}

@@ -6,25 +6,22 @@ import {
 } from "./AMBZXKUQ.mjs";
 import {
   iconSize_default
-} from "./A7UVLRKG.mjs";
+} from "./RCT3DP22.mjs";
 import {
   Box_default
-} from "./LKQ7PJ4S.mjs";
-import {
-  Typography_default
-} from "./BCWLWS7W.mjs";
-import {
-  useIsHydrated
-} from "./XFKGXL73.mjs";
+} from "./4VIJNV7V.mjs";
 import {
   foregroundTypographyColor
-} from "./XN5AALLC.mjs";
+} from "./LTYTYJEN.mjs";
 import {
   foregroundColor
-} from "./Q2TIB7ZC.mjs";
+} from "./F4HTASEF.mjs";
 import {
   backgroundColor
-} from "./R6CDK4GP.mjs";
+} from "./ZHZ6U63Z.mjs";
+import {
+  Typography_default
+} from "./WIDP7NHD.mjs";
 
 // src/Button/Button.tsx
 import { forwardRef } from "react";
@@ -52,7 +49,6 @@ var Button = forwardRef(
     tooltip,
     type = "button"
   }, ref) => {
-    const isHydrated = useIsHydrated();
     return /* @__PURE__ */ jsxs(
       "button",
       {
@@ -61,7 +57,7 @@ var Button = forwardRef(
         "aria-label": accessibilityLabel,
         type,
         title: tooltip,
-        disabled: !isHydrated || disabled || loading,
+        disabled: disabled || loading,
         onClick,
         className: classNames(
           Button_module_default.button,
@@ -117,4 +113,4 @@ var Button_default = Button;
 export {
   Button_default
 };
-//# sourceMappingURL=DVVFHZBW.mjs.map
+//# sourceMappingURL=K3JR7BCX.mjs.map

package/dist/__chunks/K3JR7BCX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Button/Button.tsx","css-module:./Button.module.css#css-module"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classNames from \"classnames\";\n\nimport backgroundColor from \"../colors//backgroundColor\";\nimport foregroundColor from \"../colors/foregroundColor\";\nimport foregroundTypographyColor from \"../colors/foregroundTypographyColor\";\nimport { type Size } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\n\nimport iconSize from \"./constants/iconSize\";\nimport textVariant from \"./constants/textVariant\";\nimport loadingIconSize from \"./constants/loadingIconSize\";\nimport styles from \"./Button.module.css\";\n\ntype ButtonProps = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The text to be displayed inside the button\n   */\n  text: string;\n  /**\n   * The text to be displayed inside the button when it is in a loading state\n   */\n  loadingText?: string;\n  /**\n   * The color of the button\n   *\n   * @defaultValue \"primary\"\n   */\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"tertiary\"\n    | \"destructive-primary\"\n    | \"destructive-secondary\"\n    | \"destructive-tertiary\"\n    | \"branded\"\n    | \"success\";\n  /**\n   * The size of the button\n   *\n   * * `sm`: 32px\n   * * `md`: 40px\n   * * `lg`: 48px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: (typeof Size)[number];\n  /**\n   * The label to be used for accessibility\n   */\n  accessibilityLabel?: string;\n  /**\n   * If `true`, the button will be disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the button will be in a loading state\n   *\n   * @defaultValue false\n   */\n  loading?: boolean;\n  /**\n   * If `true`, the button will take up the full width of its container\n   *\n   * @defaultValue false\n   */\n  fullWidth?: boolean;\n  /**\n   * The icon to be displayed at the start of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  startIcon?: React.ComponentType<{ className?: string }>;\n  /**\n   * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  endIcon?: React.ComponentType<{ className?: string }>;\n  /**\n   * The callback to be called when the button is clicked\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * The tooltip to be displayed when the user hovers over the button\n   */\n  tooltip?: string;\n  /**\n   * The type you want to set for the primitive <button/>\n   */\n  type?: \"button\" | \"submit\" | \"reset\";\n};\n\n/**\n * [Button](https://cambly-syntax.vercel.app/?path=/docs/components-button--docs) is used to trigger an action or event, such as submitting a form, opening a dialog, canceling an action, or performing a delete operation.\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      \"data-testid\": dataTestId,\n      text,\n      loadingText,\n      color = \"primary\",\n      size = \"md\",\n      accessibilityLabel,\n      disabled = false,\n      loading = false,\n      fullWidth = false,\n      startIcon: StartIcon,\n      endIcon: EndIcon,\n      onClick,\n      tooltip,\n      type = \"button\",\n    }: ButtonProps,\n    ref,\n  ) => {\n    return (\n      <button\n        data-testid={dataTestId}\n        ref={ref}\n        aria-label={accessibilityLabel}\n        type={type}\n        title={tooltip}\n        disabled={disabled || loading}\n        onClick={onClick}\n        className={classNames(\n          styles.button,\n          foregroundColor(color),\n          backgroundColor(color),\n          styles[size],\n          {\n            [styles.fullWidth]: fullWidth,\n            [styles.buttonGap]: size === \"lg\" || size === \"md\",\n            [styles.secondaryBorder]: color === \"secondary\",\n            [styles.secondaryDestructiveBorder]:\n              color === \"destructive-secondary\",\n          },\n        )}\n      >\n        {!loading && StartIcon && (\n          <StartIcon className={classNames(styles.icon, iconSize[size])} />\n        )}\n        {((loading && loadingText) || (!loading && text)) && (\n          <Box paddingX={1}>\n            <Typography\n              size={textVariant[size]}\n              color={foregroundTypographyColor(color)}\n            >\n              <span style={{ fontWeight: 500 }}>\n                {loading ? loadingText : text}\n              </span>\n            </Typography>\n          </Box>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon className={classNames(styles.icon, iconSize[size])} />\n        )}\n        {loading && (\n          <svg\n            className={classNames(styles.loading, foregroundColor(color))}\n            viewBox=\"22 22 44 44\"\n            width={loadingIconSize[size]}\n            height={loadingIconSize[size]}\n          >\n            <circle\n              className={styles.loadingCircle}\n              cx=\"44\"\n              cy=\"44\"\n              r=\"20.2\"\n              fill=\"none\"\n              strokeWidth=\"3.6\"\n            />\n          </svg>\n        )}\n      </button>\n    );\n  },\n);\n\nButton.displayName = \"Button\";\n\nexport default Button;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_1iunh_1\",\"buttonGap\":\"_buttonGap_1iunh_9\",\"fullWidth\":\"_fullWidth_1iunh_50\",\"sm\":\"_sm_1iunh_54\",\"md\":\"_md_1iunh_61\",\"lg\":\"_lg_1iunh_68\",\"icon\":\"_icon_1iunh_75\",\"smIcon\":\"_smIcon_1iunh_79\",\"mdIcon\":\"_mdIcon_1iunh_86\",\"lgIcon\":\"_lgIcon_1iunh_93\",\"secondaryBorder\":\"_secondaryBorder_1iunh_100\",\"secondaryDestructiveBorder\":\"_secondaryDestructiveBorder_1iunh_104\",\"loading\":\"_loading_1iunh_118\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_1iunh_1\",\"loadingCircle\":\"_loadingCircle_1iunh_122\"}"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAClC,OAAO,gBAAgB;;;ACDoE,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,oBAAmB,mBAAkB,8BAA6B,8BAA6B,yCAAwC,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B;;;ADwHzmB,SAuBI,KAvBJ;AArBN,IAAM,SAAS;AAAA,EACb,CACE;AAAA,IACE,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,OAAO;AAAA,IACP;AAAA,IACA,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,OAAO;AAAA,EACT,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa;AAAA,QACb;AAAA,QACA,cAAY;AAAA,QACZ;AAAA,QACA,OAAO;AAAA,QACP,UAAU,YAAY;AAAA,QACtB;AAAA,QACA,WAAW;AAAA,UACT,sBAAO;AAAA,UACP,gBAAgB,KAAK;AAAA,UACrB,gBAAgB,KAAK;AAAA,UACrB,sBAAO,IAAI;AAAA,UACX;AAAA,YACE,CAAC,sBAAO,SAAS,GAAG;AAAA,YACpB,CAAC,sBAAO,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YAC9C,CAAC,sBAAO,eAAe,GAAG,UAAU;AAAA,YACpC,CAAC,sBAAO,0BAA0B,GAChC,UAAU;AAAA,UACd;AAAA,QACF;AAAA,QAEC;AAAA,WAAC,WAAW,aACX,oBAAC,aAAU,WAAW,WAAW,sBAAO,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA,WAE9D,WAAW,eAAiB,CAAC,WAAW,SACzC,oBAAC,eAAI,UAAU,GACb;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,oBAAY,IAAI;AAAA,cACtB,OAAO,0BAA0B,KAAK;AAAA,cAEtC,8BAAC,UAAK,OAAO,EAAE,YAAY,IAAI,GAC5B,oBAAU,cAAc,MAC3B;AAAA;AAAA,UACF,GACF;AAAA,UAED,CAAC,WAAW,WACX,oBAAC,WAAQ,WAAW,WAAW,sBAAO,MAAM,iBAAS,IAAI,CAAC,GAAG;AAAA,UAE9D,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAO,SAAS,gBAAgB,KAAK,CAAC;AAAA,cAC5D,SAAQ;AAAA,cACR,OAAO,wBAAgB,IAAI;AAAA,cAC3B,QAAQ,wBAAgB,IAAI;AAAA,cAE5B;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW,sBAAO;AAAA,kBAClB,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAE;AAAA,kBACF,MAAK;AAAA,kBACL,aAAY;AAAA;AAAA,cACd;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;AAErB,IAAO,iBAAQ;","names":[]}

package/dist/__chunks/K6XUX6LJ.mjs

@@ -0,0 +1,34 @@
+import {
+  AvatarGroupAvatar
+} from "./FZO6U2EP.mjs";
+import {
+  Box_default
+} from "./HJYCSDLB.mjs";
+
+// src/AvatarGroup/AvatarGroup.tsx
+import { jsx } from "react/jsx-runtime";
+function AvatarGroup({
+  children,
+  orientation = "standard"
+}) {
+  return /* @__PURE__ */ jsx(
+    Box_default,
+    {
+      display: "flex",
+      alignItems: "center",
+      dangerouslySetInlineStyle: {
+        __style: {
+          flexDirection: orientation === "reverse" ? "row-reverse" : "row"
+        }
+      },
+      children
+    }
+  );
+}
+AvatarGroup.displayName = "AvatarGroup";
+AvatarGroup.Avatar = AvatarGroupAvatar;
+
+export {
+  AvatarGroup
+};
+//# sourceMappingURL=K6XUX6LJ.mjs.map

package/dist/__chunks/K6XUX6LJ.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import Box from \"../Box/Box\";\nimport { type ReactNode } from \"react\";\nimport AvatarGroupAvatar from \"./AvatarGroupAvatar\";\n\n/**\n * [AvatarGroup](https://cambly-syntax.vercel.app/?path=/docs/components-avatargroup--docs) is a stack of avatars to represent a group of people\n */\n\nexport default function AvatarGroup({\n  children,\n  orientation = \"standard\",\n}: {\n  /**\n   * One or more.Avatar components.\n   */\n  children: ReactNode;\n  /**\n   * Direction of the avatar stack\n   * standard - avatars stack from right to left\n   * reverse - avatars stack from left to right\n   */\n  orientation?: \"standard\" | \"reverse\";\n}): JSX.Element {\n  return (\n    <Box\n      display=\"flex\"\n      alignItems=\"center\"\n      dangerouslySetInlineStyle={{\n        __style: {\n          flexDirection: orientation === \"reverse\" ? \"row-reverse\" : \"row\",\n        },\n      }}\n    >\n      {children}\n    </Box>\n  );\n}\n\nAvatarGroup.displayName = \"AvatarGroup\";\nAvatarGroup.Avatar = AvatarGroupAvatar;\n"],"mappings":";;;;;;;;AAwBI;AAhBW,SAAR,YAA6B;AAAA,EAClC;AAAA,EACA,cAAc;AAChB,GAWgB;AACd,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,YAAW;AAAA,MACX,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,eAAe,gBAAgB,YAAY,gBAAgB;AAAA,QAC7D;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;","names":[]}

package/dist/__chunks/{BSWWGQAS.js → KCIQ73YD.js}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _2O6FDRTFjs = require('./2O6FDRTF.js');
+var _VPGRPGP7js = require('./VPGRPGP7.js');
 
 
-var _F3ZST4RLjs = require('./F3ZST4RL.js');
+var _PTAZUBW6js = require('./PTAZUBW6.js');
 
 
 var _YJ7YDIGBjs = require('./YJ7YDIGB.js');
@@ -45,12 +45,12 @@ var Checkbox = ({
   const uncheckedStyling = _classnames2.default.call(void 0, checkboxStyling, Checkbox_module_default.uncheckedBox, {
     [Checkbox_module_default.uncheckedBorder]: !error,
     [Checkbox_module_default.uncheckedErrorBorder]: error,
-    [_2O6FDRTFjs.Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible
+    [_VPGRPGP7js.Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible
   });
   const checkedStyling = _classnames2.default.call(void 0, checkboxStyling, Checkbox_module_default.checkedBox, {
     [Checkbox_module_default.checkedNonError]: !error,
     [Checkbox_module_default.checkedError]: error,
-    [_2O6FDRTFjs.Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible
+    [_VPGRPGP7js.Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible
   });
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "label",
@@ -92,7 +92,7 @@ var Checkbox = ({
           }
         ),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _F3ZST4RLjs.Typography_default,
+          _PTAZUBW6js.Typography_default,
           {
             size: typographySize[size],
             color: error ? "destructive-primary" : "gray800",
@@ -108,4 +108,4 @@ var Checkbox_default = Checkbox;
 
 
 exports.Checkbox_default = Checkbox_default;
-//# sourceMappingURL=BSWWGQAS.js.map
+//# sourceMappingURL=KCIQ73YD.js.map

package/dist/__chunks/{BSWWGQAS.js.map → KCIQ73YD.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Checkbox/Checkbox.tsx","css-module:./Checkbox.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA,SAAmC,gBAAgB;AACnD,OAAO,gBAAgB;;;ACDyE,IAAO,0BAAQ,EAAC,iBAAgB,0BAAyB,gBAAe,yBAAwB,YAAW,sBAAqB,YAAW,sBAAqB,kBAAiB,4BAA2B,iBAAgB,2BAA0B,gBAAe,0BAAyB,mBAAkB,6BAA4B,wBAAuB,kCAAiC,cAAa,wBAAuB,mBAAkB,6BAA4B,gBAAe,0BAAyB,MAAK,gBAAe,MAAK,eAAc;;;ADwFjoB,SAYQ,KAZR;AAhFJ,IAAM,iBAAiB;AAAA,EACrB,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,YAAY;AAAA,EAChB,IAAI;AAAA,EACJ,IAAI;AACN;AAKA,IAAM,WAAW,CAAC;AAAA,EAChB,UAAU;AAAA,EACV,eAAe;AAAA,EACf,UAAU,eAAe;AAAA,EACzB,OAAO;AAAA,EACP;AAAA,EACA,QAAQ;AAAA,EACR;AACF,MAwCoB;AAClB,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,EAAE,eAAe,IAAI,gBAAgB;AAE3C,QAAM,kBAAkB,WAAW,wBAAO,UAAU,wBAAO,IAAI,CAAC;AAChE,QAAM,mBAAmB,WAAW,iBAAiB,wBAAO,cAAc;AAAA,IACxE,CAAC,wBAAO,eAAe,GAAG,CAAC;AAAA,IAC3B,CAAC,wBAAO,oBAAoB,GAAG;AAAA,IAC/B,CAAC,qBAAY,yBAAyB,GAAG,aAAa;AAAA,EACxD,CAAC;AACD,QAAM,iBAAiB,WAAW,iBAAiB,wBAAO,YAAY;AAAA,IACpE,CAAC,wBAAO,eAAe,GAAG,CAAC;AAAA,IAC3B,CAAC,wBAAO,YAAY,GAAG;AAAA,IACvB,CAAC,qBAAY,yBAAyB,GAAG,aAAa;AAAA,EACxD,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,wBAAO;AAAA,QACP,wBAAO,SAAS,WAAW,aAAa,WAAW;AAAA,QACnD;AAAA,UACE,CAAC,wBAAO,QAAQ,GAAG;AAAA,QACrB;AAAA,MACF;AAAA,MAEA;AAAA,4BAAC,SAAI,WAAW,UAAU,iBAAiB,kBACxC,qBACC,oBAAC,SAAI,eAAY,QAAO,SAAQ,aAAY,OAAO,UAAU,IAAI,GAC/D;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA;AAAA,QACH,GACH,GAEJ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,eAAa;AAAA,YACb,MAAK;AAAA,YACL,WAAW;AAAA,cACT,wBAAO;AAAA,cACP,wBAAO,IAAI;AAAA,cACX,wBAAO,SAAS,WAAW,aAAa,WAAW;AAAA,YACrD;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAS,MAAM;AACb,2BAAa,IAAI;AAAA,YACnB;AAAA,YACA,QAAQ,MAAM;AACZ,2BAAa,KAAK;AAAA,YACpB;AAAA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,eAAe,IAAI;AAAA,YACzB,OAAO,QAAQ,wBAAwB;AAAA,YAEtC;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ","sourcesContent":["import React, { type ReactElement, useState } from \"react\";\nimport classNames from \"classnames\";\nimport useFocusVisible from \"../useFocusVisible\";\nimport styles from \"./Checkbox.module.css\";\nimport focusStyles from \"../Focus.module.css\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\n\nconst typographySize = {\n  sm: 100,\n  md: 200,\n} as const;\n\nconst iconWidth = {\n  sm: 12,\n  md: 20,\n};\n\n/**\n * [Checkbox](https://cambly-syntax.vercel.app/?path=/docs/components-checkbox--docs) is a clickable element that will show if an option has been selected or not.\n */\nconst Checkbox = ({\n  checked = false,\n  \"data-testid\": dataTestId,\n  disabled: disabledProp = false,\n  size = \"md\",\n  label,\n  error = false,\n  onChange,\n}: {\n  /**\n   * Whether or not the box has been clicked\n   *\n   * @defaultValue false\n   */\n  checked: boolean;\n  /**\n   * Test id for the checkbox\n   */\n  \"data-testid\"?: string;\n  /**\n   * The callback to be called when the checkbox value changes\n   */\n  onChange: React.ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Whether or not the box is disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * The size of the checkbox and icon\n   *\n   * * `sm`: 16px\n   * * `md`: 24px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: \"sm\" | \"md\";\n  /**\n   * The text accompanying the checkbox\n   */\n  label: string;\n  /**\n   * Whether or not there is an error with the input\n   *\n   * @defaultValue false\n   */\n  error?: boolean;\n}): ReactElement => {\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const [isFocused, setIsFocused] = useState(false);\n  const { isFocusVisible } = useFocusVisible();\n\n  const checkboxStyling = classNames(styles.checkbox, styles[size]);\n  const uncheckedStyling = classNames(checkboxStyling, styles.uncheckedBox, {\n    [styles.uncheckedBorder]: !error,\n    [styles.uncheckedErrorBorder]: error,\n    [focusStyles.accessibilityOutlineFocus]: isFocused && isFocusVisible,\n  });\n  const checkedStyling = classNames(checkboxStyling, styles.checkedBox, {\n    [styles.checkedNonError]: !error,\n    [styles.checkedError]: error,\n    [focusStyles.accessibilityOutlineFocus]: isFocused && isFocusVisible,\n  });\n\n  return (\n    <label\n      className={classNames(\n        styles.mainContainer,\n        styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n        {\n          [styles.disabled]: disabled,\n        },\n      )}\n    >\n      <div className={checked ? checkedStyling : uncheckedStyling}>\n        {checked && (\n          <svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" width={iconWidth[size]}>\n            <path\n              fill=\"#fff\"\n              d=\"m9 16.2-3.5-3.5a.9839.9839 0 0 0-1.4 0c-.39.39-.39 1.01 0 1.4l4.19 4.19c.39.39 1.02.39 1.41 0L20.3 7.7c.39-.39.39-1.01 0-1.4a.9839.9839 0 0 0-1.4 0L9 16.2z\"\n            ></path>\n          </svg>\n        )}\n      </div>\n      <input\n        data-testid={dataTestId}\n        type=\"checkbox\"\n        className={classNames(\n          styles.inputOverlay,\n          styles[size],\n          styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n        )}\n        checked={checked}\n        onChange={onChange}\n        disabled={disabled}\n        onFocus={() => {\n          setIsFocused(true);\n        }}\n        onBlur={() => {\n          setIsFocused(false);\n        }}\n      />\n      <Typography\n        size={typographySize[size]}\n        color={error ? \"destructive-primary\" : \"gray800\"}\n      >\n        {label}\n      </Typography>\n    </label>\n  );\n};\n\nexport default Checkbox;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Checkbox/Checkbox.module.css\"; export default {\"mainContainer\":\"_mainContainer_an7al_1\",\"inputOverlay\":\"_inputOverlay_an7al_9\",\"checkbox\":\"_checkbox_an7al_17\",\"disabled\":\"_disabled_an7al_25\",\"cursorDisabled\":\"_cursorDisabled_an7al_29\",\"cursorEnabled\":\"_cursorEnabled_an7al_33\",\"uncheckedBox\":\"_uncheckedBox_an7al_37\",\"uncheckedBorder\":\"_uncheckedBorder_an7al_41\",\"uncheckedErrorBorder\":\"_uncheckedErrorBorder_an7al_45\",\"checkedBox\":\"_checkedBox_an7al_49\",\"checkedNonError\":\"_checkedNonError_an7al_53\",\"checkedError\":\"_checkedError_an7al_57\",\"sm\":\"_sm_an7al_61\",\"md\":\"_md_an7al_67\"}"]}
+{"version":3,"sources":["../../src/Checkbox/Checkbox.tsx","css-module:./Checkbox.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA,SAAmC,gBAAgB;AACnD,OAAO,gBAAgB;;;ACDwE,IAAO,0BAAQ,EAAC,iBAAgB,0BAAyB,gBAAe,yBAAwB,YAAW,sBAAqB,YAAW,sBAAqB,kBAAiB,4BAA2B,iBAAgB,2BAA0B,gBAAe,0BAAyB,mBAAkB,6BAA4B,wBAAuB,kCAAiC,cAAa,wBAAuB,mBAAkB,6BAA4B,gBAAe,0BAAyB,MAAK,gBAAe,MAAK,eAAc;;;ADwFhoB,SAYQ,KAZR;AAhFJ,IAAM,iBAAiB;AAAA,EACrB,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,YAAY;AAAA,EAChB,IAAI;AAAA,EACJ,IAAI;AACN;AAKA,IAAM,WAAW,CAAC;AAAA,EAChB,UAAU;AAAA,EACV,eAAe;AAAA,EACf,UAAU,eAAe;AAAA,EACzB,OAAO;AAAA,EACP;AAAA,EACA,QAAQ;AAAA,EACR;AACF,MAwCoB;AAClB,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,EAAE,eAAe,IAAI,gBAAgB;AAE3C,QAAM,kBAAkB,WAAW,wBAAO,UAAU,wBAAO,IAAI,CAAC;AAChE,QAAM,mBAAmB,WAAW,iBAAiB,wBAAO,cAAc;AAAA,IACxE,CAAC,wBAAO,eAAe,GAAG,CAAC;AAAA,IAC3B,CAAC,wBAAO,oBAAoB,GAAG;AAAA,IAC/B,CAAC,qBAAY,yBAAyB,GAAG,aAAa;AAAA,EACxD,CAAC;AACD,QAAM,iBAAiB,WAAW,iBAAiB,wBAAO,YAAY;AAAA,IACpE,CAAC,wBAAO,eAAe,GAAG,CAAC;AAAA,IAC3B,CAAC,wBAAO,YAAY,GAAG;AAAA,IACvB,CAAC,qBAAY,yBAAyB,GAAG,aAAa;AAAA,EACxD,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT,wBAAO;AAAA,QACP,wBAAO,SAAS,WAAW,aAAa,WAAW;AAAA,QACnD;AAAA,UACE,CAAC,wBAAO,QAAQ,GAAG;AAAA,QACrB;AAAA,MACF;AAAA,MAEA;AAAA,4BAAC,SAAI,WAAW,UAAU,iBAAiB,kBACxC,qBACC,oBAAC,SAAI,eAAY,QAAO,SAAQ,aAAY,OAAO,UAAU,IAAI,GAC/D;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA;AAAA,QACH,GACH,GAEJ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,eAAa;AAAA,YACb,MAAK;AAAA,YACL,WAAW;AAAA,cACT,wBAAO;AAAA,cACP,wBAAO,IAAI;AAAA,cACX,wBAAO,SAAS,WAAW,aAAa,WAAW;AAAA,YACrD;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAS,MAAM;AACb,2BAAa,IAAI;AAAA,YACnB;AAAA,YACA,QAAQ,MAAM;AACZ,2BAAa,KAAK;AAAA,YACpB;AAAA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,eAAe,IAAI;AAAA,YACzB,OAAO,QAAQ,wBAAwB;AAAA,YAEtC;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ","sourcesContent":["import React, { type ReactElement, useState } from \"react\";\nimport classNames from \"classnames\";\nimport useFocusVisible from \"../useFocusVisible\";\nimport styles from \"./Checkbox.module.css\";\nimport focusStyles from \"../Focus.module.css\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\n\nconst typographySize = {\n  sm: 100,\n  md: 200,\n} as const;\n\nconst iconWidth = {\n  sm: 12,\n  md: 20,\n};\n\n/**\n * [Checkbox](https://cambly-syntax.vercel.app/?path=/docs/components-checkbox--docs) is a clickable element that will show if an option has been selected or not.\n */\nconst Checkbox = ({\n  checked = false,\n  \"data-testid\": dataTestId,\n  disabled: disabledProp = false,\n  size = \"md\",\n  label,\n  error = false,\n  onChange,\n}: {\n  /**\n   * Whether or not the box has been clicked\n   *\n   * @defaultValue false\n   */\n  checked: boolean;\n  /**\n   * Test id for the checkbox\n   */\n  \"data-testid\"?: string;\n  /**\n   * The callback to be called when the checkbox value changes\n   */\n  onChange: React.ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Whether or not the box is disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * The size of the checkbox and icon\n   *\n   * * `sm`: 16px\n   * * `md`: 24px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: \"sm\" | \"md\";\n  /**\n   * The text accompanying the checkbox\n   */\n  label: string;\n  /**\n   * Whether or not there is an error with the input\n   *\n   * @defaultValue false\n   */\n  error?: boolean;\n}): ReactElement => {\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const [isFocused, setIsFocused] = useState(false);\n  const { isFocusVisible } = useFocusVisible();\n\n  const checkboxStyling = classNames(styles.checkbox, styles[size]);\n  const uncheckedStyling = classNames(checkboxStyling, styles.uncheckedBox, {\n    [styles.uncheckedBorder]: !error,\n    [styles.uncheckedErrorBorder]: error,\n    [focusStyles.accessibilityOutlineFocus]: isFocused && isFocusVisible,\n  });\n  const checkedStyling = classNames(checkboxStyling, styles.checkedBox, {\n    [styles.checkedNonError]: !error,\n    [styles.checkedError]: error,\n    [focusStyles.accessibilityOutlineFocus]: isFocused && isFocusVisible,\n  });\n\n  return (\n    <label\n      className={classNames(\n        styles.mainContainer,\n        styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n        {\n          [styles.disabled]: disabled,\n        },\n      )}\n    >\n      <div className={checked ? checkedStyling : uncheckedStyling}>\n        {checked && (\n          <svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" width={iconWidth[size]}>\n            <path\n              fill=\"#fff\"\n              d=\"m9 16.2-3.5-3.5a.9839.9839 0 0 0-1.4 0c-.39.39-.39 1.01 0 1.4l4.19 4.19c.39.39 1.02.39 1.41 0L20.3 7.7c.39-.39.39-1.01 0-1.4a.9839.9839 0 0 0-1.4 0L9 16.2z\"\n            ></path>\n          </svg>\n        )}\n      </div>\n      <input\n        data-testid={dataTestId}\n        type=\"checkbox\"\n        className={classNames(\n          styles.inputOverlay,\n          styles[size],\n          styles[`cursor${disabled ? \"Disabled\" : \"Enabled\"}`],\n        )}\n        checked={checked}\n        onChange={onChange}\n        disabled={disabled}\n        onFocus={() => {\n          setIsFocused(true);\n        }}\n        onBlur={() => {\n          setIsFocused(false);\n        }}\n      />\n      <Typography\n        size={typographySize[size]}\n        color={error ? \"destructive-primary\" : \"gray800\"}\n      >\n        {label}\n      </Typography>\n    </label>\n  );\n};\n\nexport default Checkbox;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Checkbox/Checkbox.module.css\"; export default {\"mainContainer\":\"_mainContainer_an7al_1\",\"inputOverlay\":\"_inputOverlay_an7al_9\",\"checkbox\":\"_checkbox_an7al_17\",\"disabled\":\"_disabled_an7al_25\",\"cursorDisabled\":\"_cursorDisabled_an7al_29\",\"cursorEnabled\":\"_cursorEnabled_an7al_33\",\"uncheckedBox\":\"_uncheckedBox_an7al_37\",\"uncheckedBorder\":\"_uncheckedBorder_an7al_41\",\"uncheckedErrorBorder\":\"_uncheckedErrorBorder_an7al_45\",\"checkedBox\":\"_checkedBox_an7al_49\",\"checkedNonError\":\"_checkedNonError_an7al_53\",\"checkedError\":\"_checkedError_an7al_57\",\"sm\":\"_sm_an7al_61\",\"md\":\"_md_an7al_67\"}"]}

package/dist/__chunks/KDEHEUYG.mjs

@@ -0,0 +1,73 @@
+import {
+  Box_default
+} from "./HJYCSDLB.mjs";
+import {
+  Typography_default
+} from "./3HUELEGR.mjs";
+import {
+  useIsHydrated
+} from "./XFKGXL73.mjs";
+
+// src/Chip/Chip.tsx
+import { forwardRef } from "react";
+import classnames from "classnames";
+
+// css-module:./Chip.module.css#css-module
+var Chip_module_default = { "chip": "_chip_nvvgx_1", "disabled": "_disabled_nvvgx_12", "selectedChip": "_selectedChip_nvvgx_17", "icon": "_icon_nvvgx_22", "selectedIcon": "_selectedIcon_nvvgx_30", "sm": "_sm_nvvgx_34", "lg": "_lg_nvvgx_40" };
+
+// src/Chip/Chip.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var Chip = forwardRef(
+  ({
+    selected = false,
+    "data-testid": dataTestId,
+    size = "sm",
+    text,
+    onChange,
+    icon: Icon
+  }, ref) => {
+    const isHydrated = useIsHydrated();
+    const disabled = !isHydrated;
+    const chipStyles = classnames(Chip_module_default.chip, Chip_module_default[size], {
+      [Chip_module_default.selectedChip]: selected,
+      [Chip_module_default.disabled]: disabled
+    });
+    const iconStyles = classnames(Chip_module_default.icon, {
+      [Chip_module_default.selectedIcon]: selected
+    });
+    const typographySize = {
+      ["sm"]: 200,
+      ["lg"]: 300
+    };
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: chipStyles,
+        disabled,
+        "data-testid": dataTestId,
+        ref,
+        type: "button",
+        "aria-pressed": selected,
+        onClick: onChange,
+        children: [
+          Icon && /* @__PURE__ */ jsx(Icon, { className: iconStyles }),
+          /* @__PURE__ */ jsx(Box_default, { paddingX: Icon ? 1 : 0, children: /* @__PURE__ */ jsx(
+            Typography_default,
+            {
+              size: typographySize[size],
+              color: selected ? "white" : "gray900",
+              children: text
+            }
+          ) })
+        ]
+      }
+    );
+  }
+);
+Chip.displayName = "Chip";
+var Chip_default = Chip;
+
+export {
+  Chip_default
+};
+//# sourceMappingURL=KDEHEUYG.mjs.map

package/dist/__chunks/KDEHEUYG.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Chip/Chip.tsx","css-module:./Chip.module.css#css-module"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classnames from \"classnames\";\nimport Typography from \"../Typography/Typography\";\nimport Box from \"../Box/Box\";\nimport styles from \"./Chip.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\n\ntype ChipProps = {\n  /**\n   * Sets the initial status of this chip component.\n   * * `true` will display a grey chip.\n   * * `false` will display a premium800 color chip.\n   *\n   * @defaultValue \"false\"\n   */\n  selected?: boolean;\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * Size of the chip.\n   *\n   * * `sm`: 32px\n   * * `lg`: 48px\n   *\n   * @defaultValue sm\n   */\n  size?: \"sm\" | \"lg\";\n  /**\n   * The text to be displayed on the chip\n   */\n  text: string;\n  /**\n   * The callback to be called when the chip is clicked\n   */\n  onChange: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * The icon to be displayed.\n   */\n  icon?: React.ComponentType<{ className?: string }>;\n};\n/**\n * [Chip](https://cambly-syntax.vercel.app/?path=/docs/components-chip--docs) is used to show status (selected/not selected) like a toggle button.\n */\nconst Chip = forwardRef<HTMLButtonElement, ChipProps>(\n  (\n    {\n      selected = false,\n      \"data-testid\": dataTestId,\n      size = \"sm\",\n      text,\n      onChange,\n      icon: Icon,\n    }: ChipProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n    const disabled = !isHydrated;\n\n    const chipStyles = classnames(styles.chip, styles[size], {\n      [styles.selectedChip]: selected,\n      [styles.disabled]: disabled,\n    });\n    const iconStyles = classnames(styles.icon, {\n      [styles.selectedIcon]: selected,\n    });\n    const typographySize = {\n      [\"sm\"]: 200,\n      [\"lg\"]: 300,\n    } as const;\n    return (\n      <button\n        className={chipStyles}\n        disabled={disabled}\n        data-testid={dataTestId}\n        ref={ref}\n        type=\"button\"\n        aria-pressed={selected}\n        onClick={onChange}\n      >\n        {Icon && <Icon className={iconStyles} />}\n        <Box paddingX={Icon ? 1 : 0}>\n          <Typography\n            size={typographySize[size]}\n            color={selected ? \"white\" : \"gray900\"}\n          >\n            {text}\n          </Typography>\n        </Box>\n      </button>\n    );\n  },\n);\n\nChip.displayName = \"Chip\";\n\nexport default Chip;\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/Chip/Chip.module.css\"; export default {\"chip\":\"_chip_nvvgx_1\",\"disabled\":\"_disabled_nvvgx_12\",\"selectedChip\":\"_selectedChip_nvvgx_17\",\"icon\":\"_icon_nvvgx_22\",\"selectedIcon\":\"_selectedIcon_nvvgx_30\",\"sm\":\"_sm_nvvgx_34\",\"lg\":\"_lg_nvvgx_40\"}"],"mappings":";;;;;;;;;;;AAAA,SAAgB,kBAAkB;AAClC,OAAO,gBAAgB;;;ACDgE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,YAAW,sBAAqB,gBAAe,0BAAyB,QAAO,kBAAiB,gBAAe,0BAAyB,MAAK,gBAAe,MAAK,eAAc;;;ADwEvS,SASW,KATX;AA3BN,IAAM,OAAO;AAAA,EACX,CACE;AAAA,IACE,WAAW;AAAA,IACX,eAAe;AAAA,IACf,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,MAAM;AAAA,EACR,GACA,QACG;AACH,UAAM,aAAa,cAAc;AACjC,UAAM,WAAW,CAAC;AAElB,UAAM,aAAa,WAAW,oBAAO,MAAM,oBAAO,IAAI,GAAG;AAAA,MACvD,CAAC,oBAAO,YAAY,GAAG;AAAA,MACvB,CAAC,oBAAO,QAAQ,GAAG;AAAA,IACrB,CAAC;AACD,UAAM,aAAa,WAAW,oBAAO,MAAM;AAAA,MACzC,CAAC,oBAAO,YAAY,GAAG;AAAA,IACzB,CAAC;AACD,UAAM,iBAAiB;AAAA,MACrB,CAAC,IAAI,GAAG;AAAA,MACR,CAAC,IAAI,GAAG;AAAA,IACV;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,QACX;AAAA,QACA,eAAa;AAAA,QACb;AAAA,QACA,MAAK;AAAA,QACL,gBAAc;AAAA,QACd,SAAS;AAAA,QAER;AAAA,kBAAQ,oBAAC,QAAK,WAAW,YAAY;AAAA,UACtC,oBAAC,eAAI,UAAU,OAAO,IAAI,GACxB;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,eAAe,IAAI;AAAA,cACzB,OAAO,WAAW,UAAU;AAAA,cAE3B;AAAA;AAAA,UACH,GACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ;","names":[]}

package/dist/__chunks/KEVWT27Z.mjs

@@ -0,0 +1,81 @@
+import {
+  Box_default
+} from "./4VIJNV7V.mjs";
+import {
+  Typography_default
+} from "./WIDP7NHD.mjs";
+
+// src/TextField/TextField.tsx
+import {
+  useId
+} from "react";
+import classNames from "classnames";
+
+// css-module:./TextField.module.css#css-module
+var TextField_module_default = { "textfield": "_textfield_cltsv_1", "label": "_label_cltsv_21", "sm": "_sm_cltsv_25", "md": "_md_cltsv_30", "lg": "_lg_cltsv_35", "inputError": "_inputError_cltsv_40" };
+
+// src/TextField/TextField.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function TextField({
+  autoComplete,
+  "data-testid": dataTestId,
+  disabled = false,
+  errorText = "",
+  helperText = "",
+  id,
+  label,
+  onChange,
+  placeholder = "",
+  size = "md",
+  type = "text",
+  value = ""
+}) {
+  const reactId = useId();
+  const inputId = id != null ? id : reactId;
+  return /* @__PURE__ */ jsxs(
+    Box_default,
+    {
+      display: "flex",
+      direction: "column",
+      gap: 2,
+      width: "100%",
+      dangerouslySetInlineStyle: {
+        __style: {
+          opacity: disabled ? 0.5 : 1
+        }
+      },
+      children: [
+        label && /* @__PURE__ */ jsx("label", { className: TextField_module_default.label, htmlFor: inputId, children: /* @__PURE__ */ jsx(Box_default, { paddingX: 1, children: /* @__PURE__ */ jsx(Typography_default, { size: 100, color: "gray700", children: label }) }) }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            autoComplete,
+            className: classNames(TextField_module_default.textfield, TextField_module_default[size], {
+              [TextField_module_default.inputError]: errorText
+            }),
+            "data-testid": dataTestId,
+            disabled,
+            id: inputId,
+            type,
+            onChange,
+            placeholder,
+            value
+          }
+        ),
+        (helperText || errorText) && /* @__PURE__ */ jsx(Box_default, { paddingX: 1, children: /* @__PURE__ */ jsx(
+          Typography_default,
+          {
+            size: 100,
+            color: errorText ? "destructive-primary" : "gray700",
+            children: errorText || helperText
+          }
+        ) })
+      ]
+    }
+  );
+}
+
+export {
+  TextField
+};
+//# sourceMappingURL=KEVWT27Z.mjs.map

package/dist/__chunks/KEVWT27Z.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/TextField/TextField.tsx","css-module:./TextField.module.css#css-module"],"sourcesContent":["import React, {\n  type ReactElement,\n  type HTMLInputTypeAttribute,\n  useId,\n} from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./TextField.module.css\";\nimport Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\n\n/**\n * [TextField](https://cambly-syntax.vercel.app/?path=/docs/components-textfield--docs) is a component that allows users to enter text.\n */\nexport default function TextField({\n  autoComplete,\n  \"data-testid\": dataTestId,\n  disabled = false,\n  errorText = \"\",\n  helperText = \"\",\n  id,\n  label,\n  onChange,\n  placeholder = \"\",\n  size = \"md\",\n  type = \"text\",\n  value = \"\",\n}: {\n  /**\n   * The autocomplete attribute specifies whether or not an input field should have autocomplete enabled.\n   *\n   * Feel free to add new values from the [MDN docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) as needed\n   */\n  autoComplete?: \"current-password\" | \"new-password\" | \"off\" | \"on\" | \"email\";\n  /**\n   * A data-testid to make querying for the TextField easier.\n   */\n  \"data-testid\"?: string;\n  /**\n   * If true, the TextField will be disabled.\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * Text shown below TextField if there is an input error.\n   */\n  errorText?: string;\n  /**\n   * Informative helper text shown below TextField\n   */\n  helperText?: string;\n  /**\n   * TextField id, if not provided, a unique id will be generated\n   */\n  id?: string;\n  /**\n   * TextField visible label\n   */\n  label: string;\n  /**\n   * The callback to be called the input changes\n   */\n  onChange: React.ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Optional TextField placeholder text\n   */\n  placeholder?: string;\n  /**\n   * Size of the TextField\n   * * `sm`: 32px\n   * * `md`: 40px\n   * * `lg`: 48px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\n  /**\n   * Input type of the TextField\n   *\n   * See [full list of input types](https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types)\n   */\n  type?: HTMLInputTypeAttribute;\n  /**\n   * Value of the TextField\n   */\n  value: string;\n}): ReactElement {\n  const reactId = useId();\n  const inputId = id ?? reactId;\n\n  return (\n    <Box\n      display=\"flex\"\n      direction=\"column\"\n      gap={2}\n      width=\"100%\"\n      dangerouslySetInlineStyle={{\n        __style: {\n          opacity: disabled ? 0.5 : 1,\n        },\n      }}\n    >\n      {label && (\n        <label className={styles.label} htmlFor={inputId}>\n          <Box paddingX={1}>\n            <Typography size={100} color=\"gray700\">\n              {label}\n            </Typography>\n          </Box>\n        </label>\n      )}\n      <input\n        autoComplete={autoComplete}\n        className={classNames(styles.textfield, styles[size], {\n          [styles.inputError]: errorText,\n        })}\n        data-testid={dataTestId}\n        disabled={disabled}\n        id={inputId}\n        type={type}\n        onChange={onChange}\n        placeholder={placeholder}\n        value={value}\n      />\n      {(helperText || errorText) && (\n        <Box paddingX={1}>\n          <Typography\n            size={100}\n            color={errorText ? \"destructive-primary\" : \"gray700\"}\n          >\n            {errorText || helperText}\n          </Typography>\n        </Box>\n      )}\n    </Box>\n  );\n}\n","import \"/Users/christian/cambly/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_cltsv_1\",\"label\":\"_label_cltsv_21\",\"sm\":\"_sm_cltsv_25\",\"md\":\"_md_cltsv_30\",\"lg\":\"_lg_cltsv_35\",\"inputError\":\"_inputError_cltsv_40\"}"],"mappings":";;;;;;;;AAAA;AAAA,EAGE;AAAA,OACK;AACP,OAAO,gBAAgB;;;ACL0E,IAAO,2BAAQ,EAAC,aAAY,sBAAqB,SAAQ,mBAAkB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,cAAa,uBAAsB;;;AD2FvQ,SAcQ,KAdR;AA9EW,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA,eAAe;AAAA,EACf,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AACV,GA4DiB;AACf,QAAM,UAAU,MAAM;AACtB,QAAM,UAAU,kBAAM;AAEtB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,WAAU;AAAA,MACV,KAAK;AAAA,MACL,OAAM;AAAA,MACN,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,SAAS,WAAW,MAAM;AAAA,QAC5B;AAAA,MACF;AAAA,MAEC;AAAA,iBACC,oBAAC,WAAM,WAAW,yBAAO,OAAO,SAAS,SACvC,8BAAC,eAAI,UAAU,GACb,8BAAC,sBAAW,MAAM,KAAK,OAAM,WAC1B,iBACH,GACF,GACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW,WAAW,yBAAO,WAAW,yBAAO,IAAI,GAAG;AAAA,cACpD,CAAC,yBAAO,UAAU,GAAG;AAAA,YACvB,CAAC;AAAA,YACD,eAAa;AAAA,YACb;AAAA,YACA,IAAI;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,SACE,cAAc,cACd,oBAAC,eAAI,UAAU,GACb;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,OAAO,YAAY,wBAAwB;AAAA,YAE1C,uBAAa;AAAA;AAAA,QAChB,GACF;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/__chunks/KNBS7I65.mjs

@@ -0,0 +1,34 @@
+import {
+  Typography_default
+} from "./WIDP7NHD.mjs";
+
+// src/Heading/Heading.tsx
+import { jsx } from "react/jsx-runtime";
+var Heading = ({
+  align = "start",
+  as = "h1",
+  children,
+  color = "gray900",
+  "data-testid": dataTestId,
+  size = 500
+}) => {
+  const weight = [700, 800].includes(size) ? "heavy" : "bold";
+  return /* @__PURE__ */ jsx(
+    Typography_default,
+    {
+      align,
+      as,
+      color,
+      "data-testid": dataTestId,
+      size,
+      weight,
+      children
+    }
+  );
+};
+var Heading_default = Heading;
+
+export {
+  Heading_default
+};
+//# sourceMappingURL=KNBS7I65.mjs.map

package/dist/__chunks/KNBS7I65.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Heading/Heading.tsx"],"sourcesContent":["import { type ReactElement, type ReactNode } from \"react\";\nimport { type Color } from \"../constants\";\nimport Typography from \"../Typography/Typography\";\n\n/**\n * [Heading](https://cambly-syntax.vercel.app/?path=/docs/components-heading--docs) enforces a consistent style & accessibility best practices for headings.\n */\nconst Heading = ({\n  align = \"start\",\n  as = \"h1\",\n  children,\n  color = \"gray900\",\n  \"data-testid\": dataTestId,\n  size = 500,\n}: {\n  /**\n   * Aligns the text to the left, right, or center of the container.\n   * * `start` and `end` will align the text to the left or right of the container depending on the locale.\n   * * `forceLeft` and `forceRight` will align the text to the left or right of the container regardless of the locale (should be used sparingly).\n   *\n   * @defaultValue \"start\"\n   */\n  align?: \"start\" | \"end\" | \"forceLeft\" | \"center\" | \"forceRight\";\n  /**\n   * DOM element to render as.\n   *\n   * @defaultValue \"h1\"\n   */\n  as?: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n  /**\n   * The text to be rendered\n   */\n  children?: ReactNode;\n  /**\n   * The color of the text.\n   *\n   * @defaultValue \"gray900\"\n   */\n  color?: (typeof Color)[number];\n  /**\n   * Test id for the text.\n   */\n  \"data-testid\"?: string;\n  /**\n   * Size of the text.\n   *\n   * * `500`: 20px\n   * * `600`: 28px\n   * * `700`: 40px\n   * * `800`: 64px\n   *\n   * @defaultValue 500\n   */\n  size?: 500 | 600 | 700 | 800;\n}): ReactElement => {\n  const weight = [700, 800].includes(size) ? \"heavy\" : \"bold\";\n  return (\n    <Typography\n      align={align}\n      as={as}\n      color={color}\n      data-testid={dataTestId}\n      size={size}\n      weight={weight}\n    >\n      {children}\n    </Typography>\n  );\n};\n\nexport default Heading;\n"],"mappings":";;;;;AAyDI;AAlDJ,IAAM,UAAU,CAAC;AAAA,EACf,QAAQ;AAAA,EACR,KAAK;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,OAAO;AACT,MAwCoB;AAClB,QAAM,SAAS,CAAC,KAAK,GAAG,EAAE,SAAS,IAAI,IAAI,UAAU;AACrD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAa;AAAA,MACb;AAAA,MACA;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,kBAAQ;","names":[]}

package/dist/__chunks/KNDHXB3A.js

@@ -0,0 +1,66 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _4EEVXYO7js = require('./4EEVXYO7.js');
+
+
+var _R3JL4P3Qjs = require('./R3JL4P3Q.js');
+
+// src/Chip/Chip.tsx
+var _react = require('react');
+var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
+
+// css-module:./Chip.module.css#css-module
+var Chip_module_default = { "chip": "_chip_1rwvt_1", "selectedChip": "_selectedChip_1rwvt_12", "icon": "_icon_1rwvt_17", "selectedIcon": "_selectedIcon_1rwvt_25", "sm": "_sm_1rwvt_29", "lg": "_lg_1rwvt_35" };
+
+// src/Chip/Chip.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var Chip = _react.forwardRef.call(void 0, 
+  ({
+    selected = false,
+    "data-testid": dataTestId,
+    size = "sm",
+    text,
+    onChange,
+    icon: Icon
+  }, ref) => {
+    const chipStyles = _classnames2.default.call(void 0, Chip_module_default.chip, Chip_module_default[size], {
+      [Chip_module_default.selectedChip]: selected
+    });
+    const iconStyles = _classnames2.default.call(void 0, Chip_module_default.icon, {
+      [Chip_module_default.selectedIcon]: selected
+    });
+    const typographySize = {
+      ["sm"]: 200,
+      ["lg"]: 300
+    };
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "button",
+      {
+        className: chipStyles,
+        "data-testid": dataTestId,
+        ref,
+        type: "button",
+        "aria-pressed": selected,
+        onClick: onChange,
+        children: [
+          Icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: iconStyles }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _4EEVXYO7js.Box_default, { paddingX: Icon ? 1 : 0, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _R3JL4P3Qjs.Typography_default,
+            {
+              size: typographySize[size],
+              color: selected ? "white" : "gray900",
+              children: text
+            }
+          ) })
+        ]
+      }
+    );
+  }
+);
+Chip.displayName = "Chip";
+var Chip_default = Chip;
+
+
+
+exports.Chip_default = Chip_default;
+//# sourceMappingURL=KNDHXB3A.js.map