@cambly/syntax-core 10.26.0 → 10.28.0

package/dist/__chunks/{CX2IJ7UB.js → NKYN63G7.js}

@@ -1,25 +1,25 @@
 "use client"
 import {
   Heading_default
-} from "./KZD6BFDA.js";
+} from "./4IJQ4BTF.js";
 import {
   StopScroll
 } from "./QQT35OLE.js";
 import {
   Layer
-} from "./MOU24MJO.js";
+} from "./GJBW4BG7.js";
 import {
   FocusTrap
 } from "./J7FCX3U6.js";
 import {
   IconButton_default
-} from "./ZEMGWSJQ.js";
+} from "./VR4ZFZ4Z.js";
 import {
   Box_default
-} from "./XQM7YZ26.js";
+} from "./HCHFPFNX.js";
 import {
   useTheme
-} from "./ZSHAHV4F.js";
+} from "./4GTNQPPD.js";
 
 // src/Modal/Modal.tsx
 import classnames from "classnames";
@@ -120,6 +120,7 @@ function Modal({
                     accessibilityLabel: accessibilityCloseLabel,
                     color: image ? "primary" : "tertiary",
                     on: image ? "darkBackground" : "lightBackground",
+                    onClick: onDismiss,
                     size: "sm",
                     icon: XIconCambio
                   }
@@ -173,4 +174,4 @@ Modal.displayName = "Modal";
 export {
   Modal
 };
-//# sourceMappingURL=CX2IJ7UB.js.map
+//# sourceMappingURL=NKYN63G7.js.map

package/dist/__chunks/{CX2IJ7UB.js.map → NKYN63G7.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Modal/Modal.tsx","css-module:./Modal.module.css#css-module"],"sourcesContent":["import { type ReactElement } from \"react\";\nimport classnames from \"classnames\";\n\nimport Heading from \"../Heading/Heading\";\nimport Box from \"../Box/Box\";\n\nimport FocusTrap from \"./FocusTrap\";\nimport StopScroll from \"./StopScroll\";\nimport Layer from \"./Layer\";\nimport styles from \"./Modal.module.css\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\nimport IconButton from \"../IconButton/IconButton\";\n\nfunction XIcon({ color = \"#000\" }: { color?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" fill={color}>\n      <path\n        fill=\"inherit\"\n        d=\"M11.25.758a.83.83 0 0 0-1.175 0L6 4.825 1.925.75A.83.83 0 1 0 .75 1.925L4.825 6 .75 10.075a.83.83 0 1 0 1.175 1.175L6 7.175l4.075 4.075a.83.83 0 1 0 1.175-1.175L7.175 6l4.075-4.075a.835.835 0 0 0 0-1.167Z\"\n      />\n    </svg>\n  );\n}\n\nfunction XIconCambio({ className }: { className?: string }) {\n  return (\n    <svg\n      className={className}\n      fill=\"currentColor\"\n      focusable=\"false\"\n      aria-hidden=\"true\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"></path>\n    </svg>\n  );\n}\n\n// Note: Only sm + lg size currently. design thinks there should only be two sizes.\n// If there IS a md size at some point, we should use the \"size\" const.\nconst sizeWidth = {\n  sm: 400,\n  lg: 600,\n} as const;\n\n/**\n * [Modal](https://cambly-syntax.vercel.app/?path=/docs/components-modal--docs) is a dialog that appears on top of the main content and locks user interaction within the modal.\n *\n ```\n  const [showModal, setShowModal] = useState(false)\n\n  return (\n    <>\n      {showModal && <Modal\n        header=\"header text\"\n        onDismiss={() => setShowModal(false)}\n        footer={\n          <>\n            <Button\n              text=\"Cancel\"\n              color=\"secondary\"\n              onClick={() => {}}\n            />\n            <Button\n              text=\"Confirm\"\n              onClick={() => {}}\n            />\n          </>\n        }\n      >\n        <Typography>\n          Body text goes here!\n        </Typography>\n      </Modal> }\n    </>\n  )\n  ```\n */\nexport default function Modal({\n  header,\n  children,\n  image,\n  onDismiss,\n  footer,\n  accessibilityCloseLabel = \"close modal\",\n  size = \"sm\",\n  zIndex = 1,\n  \"data-testid\": dataTestId,\n}: {\n  /**\n   * The modal's main content. Should typically take in `Typography`'d text.\n   */\n  children: JSX.Element;\n  /**\n   * The header inside a modal as a string.\n   */\n  header: string;\n  /**\n   * What the X button (or clicking out of the modal area) does.\n   * Typically used for closing the Modal\n   */\n  onDismiss: () => void;\n  /**\n   * The optional image rendered above the Modal.\n   * Image size should be 400w x 200h.\n   * If images aren't that sized, should ask design to give another image.\n   */\n  image?: JSX.Element;\n  /**\n   * The footer for the bottom area of the Modal. Typically used for rendering buttons.\n   * * Use Syntax `Button` and pass it into footer.\n   * * If one button, just pass it in. If two, wrap in a React fragment (`<> </>`)\n   * * If two(2) buttons, put primary button _second_.\n   *\n      <>\n        <Button\n          text=\"Cancel\"\n          color=\"secondary\"\n          onClick={() => {}}\n        />\n        <Button\n          text=\"Confirm\"\n          onClick={() => {}}\n        />\n      </>\n   */\n  footer?: JSX.Element;\n  /**\n   * The accessibilty text on the close button.\n   * (Sets the aria-label of the button)\n   *\n   *\n   * @defaultValue close modal\n   */\n  accessibilityCloseLabel?: string;\n  /**\n   * The size of the card\n   *\n   * Classic:\n   * * `sm`: 400px (Classic only)\n   * * `lg`: 600px\n   *\n   * Cambio:\n   * * `lg`: 600px\n   *\n   *\n   * @defaultValue sm\n   */\n  size?: keyof typeof sizeWidth;\n  /**\n   * The z-index for the modal.\n   * Typically used if there are other things on the page with higher z-index and you need this overlayed on top.\n   *\n   * @defaultValue 0\n   */\n  zIndex?: number;\n  /**\n   * Test id for the modal\n   */\n  \"data-testid\"?: string;\n}): ReactElement {\n  const { themeName } = useTheme();\n  return (\n    <Layer zIndex={zIndex}>\n      <StopScroll>\n        <FocusTrap>\n          <div\n            className={classnames(\n              styles.backdrop,\n              themeName === \"classic\"\n                ? styles.backdropClassic\n                : styles.backdropCambio,\n            )}\n            role=\"presentation\"\n            onClick={(e) => e.target === e.currentTarget && onDismiss()}\n            onKeyDown={(e) => e.key === \"Escape\" && onDismiss()}\n          >\n            <Box\n              data-testid={dataTestId}\n              backgroundColor=\"white\"\n              rounding={themeName === \"classic\" ? \"xl\" : \"md\"}\n              display=\"flex\"\n              direction=\"column\"\n              marginStart={4}\n              marginEnd={4}\n              minWidth={240}\n              maxWidth={sizeWidth[themeName === \"classic\" ? size : \"lg\"]}\n              width=\"100%\"\n              dangerouslySetInlineStyle={{ __style: { overflow: \"hidden\" } }}\n            >\n              <Box position=\"relative\">\n                {themeName === \"classic\" ? (\n                  <button\n                    aria-label={accessibilityCloseLabel}\n                    type=\"button\"\n                    className={classnames(\n                      styles.closeButton,\n                      styles.closeButtonClassic,\n                      {\n                        [styles.closeButtonWithImage]: !!image,\n                      },\n                    )}\n                    onClick={onDismiss}\n                  >\n                    <XIcon color={image ? \"#fff\" : \"#000\"} />\n                  </button>\n                ) : (\n                  <Box\n                    position=\"absolute\"\n                    dangerouslySetInlineStyle={{\n                      __style: { top: 4, right: 4 },\n                    }}\n                  >\n                    <IconButton\n                      accessibilityLabel={accessibilityCloseLabel}\n                      color={image ? \"primary\" : \"tertiary\"}\n                      on={image ? \"darkBackground\" : \"lightBackground\"}\n                      size=\"sm\"\n                      icon={XIconCambio}\n                    />\n                  </Box>\n                )}\n              </Box>\n              {image && <Box maxHeight={200}>{image}</Box>}\n              <Box\n                display=\"flex\"\n                gap={themeName === \"classic\" ? 3 : 4}\n                direction=\"column\"\n                padding={themeName === \"classic\" ? 9 : 6}\n              >\n                <Heading\n                  as=\"h1\"\n                  size={themeName === \"classic\" ? 500 : 600}\n                  fontStyle={themeName === \"classic\" ? \"sans-serif\" : \"serif\"}\n                >\n                  {header}\n                </Heading>\n                <Box marginBottom={themeName === \"classic\" ? 4 : 0}>\n                  {children}\n                </Box>\n                {footer && (\n                  <Box\n                    display=\"flex\"\n                    direction=\"column\"\n                    gap={3}\n                    marginTop={themeName === \"classic\" ? 0 : 2}\n                    smDirection=\"row\"\n                    smJustifyContent=\"end\"\n                    lgDirection=\"row\"\n                    lgJustifyContent=\"end\"\n                  >\n                    {footer}\n                  </Box>\n                )}\n              </Box>\n            </Box>\n          </div>\n        </FocusTrap>\n      </StopScroll>\n    </Layer>\n  );\n}\n\nModal.displayName = \"Modal\";\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Modal/Modal.module.css\"; export default {\"backdrop\":\"_backdrop_1w5vm_1\",\"backdropClassic\":\"_backdropClassic_1w5vm_11\",\"backdropCambio\":\"_backdropCambio_1w5vm_15\",\"closeButton\":\"_closeButton_1w5vm_19\",\"closeButtonClassic\":\"_closeButtonClassic_1w5vm_34\",\"closeButtonWithImage\":\"_closeButtonWithImage_1w5vm_46\",\"closeButtonWithImageCambio\":\"_closeButtonWithImageCambio_1w5vm_50\"}"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/Modal/Modal.tsx","css-module:./Modal.module.css#css-module"],"sourcesContent":["import { type ReactElement } from \"react\";\nimport classnames from \"classnames\";\n\nimport Heading from \"../Heading/Heading\";\nimport Box from \"../Box/Box\";\n\nimport FocusTrap from \"./FocusTrap\";\nimport StopScroll from \"./StopScroll\";\nimport Layer from \"./Layer\";\nimport styles from \"./Modal.module.css\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\nimport IconButton from \"../IconButton/IconButton\";\n\nfunction XIcon({ color = \"#000\" }: { color?: string }) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" fill={color}>\n      <path\n        fill=\"inherit\"\n        d=\"M11.25.758a.83.83 0 0 0-1.175 0L6 4.825 1.925.75A.83.83 0 1 0 .75 1.925L4.825 6 .75 10.075a.83.83 0 1 0 1.175 1.175L6 7.175l4.075 4.075a.83.83 0 1 0 1.175-1.175L7.175 6l4.075-4.075a.835.835 0 0 0 0-1.167Z\"\n      />\n    </svg>\n  );\n}\n\nfunction XIconCambio({ className }: { className?: string }) {\n  return (\n    <svg\n      className={className}\n      fill=\"currentColor\"\n      focusable=\"false\"\n      aria-hidden=\"true\"\n      viewBox=\"0 0 24 24\"\n    >\n      <path d=\"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"></path>\n    </svg>\n  );\n}\n\n// Note: Only sm + lg size currently. design thinks there should only be two sizes.\n// If there IS a md size at some point, we should use the \"size\" const.\nconst sizeWidth = {\n  sm: 400,\n  lg: 600,\n} as const;\n\n/**\n * [Modal](https://cambly-syntax.vercel.app/?path=/docs/components-modal--docs) is a dialog that appears on top of the main content and locks user interaction within the modal.\n *\n ```\n  const [showModal, setShowModal] = useState(false)\n\n  return (\n    <>\n      {showModal && <Modal\n        header=\"header text\"\n        onDismiss={() => setShowModal(false)}\n        footer={\n          <>\n            <Button\n              text=\"Cancel\"\n              color=\"secondary\"\n              onClick={() => {}}\n            />\n            <Button\n              text=\"Confirm\"\n              onClick={() => {}}\n            />\n          </>\n        }\n      >\n        <Typography>\n          Body text goes here!\n        </Typography>\n      </Modal> }\n    </>\n  )\n  ```\n */\nexport default function Modal({\n  header,\n  children,\n  image,\n  onDismiss,\n  footer,\n  accessibilityCloseLabel = \"close modal\",\n  size = \"sm\",\n  zIndex = 1,\n  \"data-testid\": dataTestId,\n}: {\n  /**\n   * The modal's main content. Should typically take in `Typography`'d text.\n   */\n  children: JSX.Element;\n  /**\n   * The header inside a modal as a string.\n   */\n  header: string;\n  /**\n   * What the X button (or clicking out of the modal area) does.\n   * Typically used for closing the Modal\n   */\n  onDismiss: () => void;\n  /**\n   * The optional image rendered above the Modal.\n   * Image size should be 400w x 200h.\n   * If images aren't that sized, should ask design to give another image.\n   */\n  image?: JSX.Element;\n  /**\n   * The footer for the bottom area of the Modal. Typically used for rendering buttons.\n   * * Use Syntax `Button` and pass it into footer.\n   * * If one button, just pass it in. If two, wrap in a React fragment (`<> </>`)\n   * * If two(2) buttons, put primary button _second_.\n   *\n      <>\n        <Button\n          text=\"Cancel\"\n          color=\"secondary\"\n          onClick={() => {}}\n        />\n        <Button\n          text=\"Confirm\"\n          onClick={() => {}}\n        />\n      </>\n   */\n  footer?: JSX.Element;\n  /**\n   * The accessibilty text on the close button.\n   * (Sets the aria-label of the button)\n   *\n   *\n   * @defaultValue close modal\n   */\n  accessibilityCloseLabel?: string;\n  /**\n   * The size of the card\n   *\n   * Classic:\n   * * `sm`: 400px (Classic only)\n   * * `lg`: 600px\n   *\n   * Cambio:\n   * * `lg`: 600px\n   *\n   *\n   * @defaultValue sm\n   */\n  size?: keyof typeof sizeWidth;\n  /**\n   * The z-index for the modal.\n   * Typically used if there are other things on the page with higher z-index and you need this overlayed on top.\n   *\n   * @defaultValue 0\n   */\n  zIndex?: number;\n  /**\n   * Test id for the modal\n   */\n  \"data-testid\"?: string;\n}): ReactElement {\n  const { themeName } = useTheme();\n  return (\n    <Layer zIndex={zIndex}>\n      <StopScroll>\n        <FocusTrap>\n          <div\n            className={classnames(\n              styles.backdrop,\n              themeName === \"classic\"\n                ? styles.backdropClassic\n                : styles.backdropCambio,\n            )}\n            role=\"presentation\"\n            onClick={(e) => e.target === e.currentTarget && onDismiss()}\n            onKeyDown={(e) => e.key === \"Escape\" && onDismiss()}\n          >\n            <Box\n              data-testid={dataTestId}\n              backgroundColor=\"white\"\n              rounding={themeName === \"classic\" ? \"xl\" : \"md\"}\n              display=\"flex\"\n              direction=\"column\"\n              marginStart={4}\n              marginEnd={4}\n              minWidth={240}\n              maxWidth={sizeWidth[themeName === \"classic\" ? size : \"lg\"]}\n              width=\"100%\"\n              dangerouslySetInlineStyle={{ __style: { overflow: \"hidden\" } }}\n            >\n              <Box position=\"relative\">\n                {themeName === \"classic\" ? (\n                  <button\n                    aria-label={accessibilityCloseLabel}\n                    type=\"button\"\n                    className={classnames(\n                      styles.closeButton,\n                      styles.closeButtonClassic,\n                      {\n                        [styles.closeButtonWithImage]: !!image,\n                      },\n                    )}\n                    onClick={onDismiss}\n                  >\n                    <XIcon color={image ? \"#fff\" : \"#000\"} />\n                  </button>\n                ) : (\n                  <Box\n                    position=\"absolute\"\n                    dangerouslySetInlineStyle={{\n                      __style: { top: 4, right: 4 },\n                    }}\n                  >\n                    <IconButton\n                      accessibilityLabel={accessibilityCloseLabel}\n                      color={image ? \"primary\" : \"tertiary\"}\n                      on={image ? \"darkBackground\" : \"lightBackground\"}\n                      onClick={onDismiss}\n                      size=\"sm\"\n                      icon={XIconCambio}\n                    />\n                  </Box>\n                )}\n              </Box>\n              {image && <Box maxHeight={200}>{image}</Box>}\n              <Box\n                display=\"flex\"\n                gap={themeName === \"classic\" ? 3 : 4}\n                direction=\"column\"\n                padding={themeName === \"classic\" ? 9 : 6}\n              >\n                <Heading\n                  as=\"h1\"\n                  size={themeName === \"classic\" ? 500 : 600}\n                  fontStyle={themeName === \"classic\" ? \"sans-serif\" : \"serif\"}\n                >\n                  {header}\n                </Heading>\n                <Box marginBottom={themeName === \"classic\" ? 4 : 0}>\n                  {children}\n                </Box>\n                {footer && (\n                  <Box\n                    display=\"flex\"\n                    direction=\"column\"\n                    gap={3}\n                    marginTop={themeName === \"classic\" ? 0 : 2}\n                    smDirection=\"row\"\n                    smJustifyContent=\"end\"\n                    lgDirection=\"row\"\n                    lgJustifyContent=\"end\"\n                  >\n                    {footer}\n                  </Box>\n                )}\n              </Box>\n            </Box>\n          </div>\n        </FocusTrap>\n      </StopScroll>\n    </Layer>\n  );\n}\n\nModal.displayName = \"Modal\";\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Modal/Modal.module.css\"; export default {\"backdrop\":\"_backdrop_1w5vm_1\",\"backdropClassic\":\"_backdropClassic_1w5vm_11\",\"backdropCambio\":\"_backdropCambio_1w5vm_15\",\"closeButton\":\"_closeButton_1w5vm_19\",\"closeButtonClassic\":\"_closeButtonClassic_1w5vm_34\",\"closeButtonWithImage\":\"_closeButtonWithImage_1w5vm_46\",\"closeButtonWithImageCambio\":\"_closeButtonWithImageCambio_1w5vm_50\"}"],"mappings":"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","names":[]}

package/dist/__chunks/{CCDZUAUU.cjs → O2J3F7UE.cjs}

@@ -8,4 +8,4 @@ var ColorBaseGray800 = "#353535";
 
 
 exports.ColorBaseDestructive700 = ColorBaseDestructive700; exports.ColorBaseGray800 = ColorBaseGray800;
-//# sourceMappingURL=CCDZUAUU.cjs.map
+//# sourceMappingURL=O2J3F7UE.cjs.map

package/dist/__chunks/{CCDZUAUU.cjs.map → O2J3F7UE.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"names":[],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB","sourcesContent":["/**\n * Do not edit directly\n * Generated on Mon, 25 Mar 2024 22:41:08 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\n"]}
+{"version":3,"sources":["../../../syntax-design-tokens/dist/js/index.js"],"names":[],"mappings":";;;AASO,IAAM,0BAA0B;AAWhC,IAAM,mBAAmB","sourcesContent":["/**\n * Do not edit directly\n * Generated on Wed, 27 Mar 2024 18:59:22 GMT\n */\n\nexport const ColorBaseBlack = \"#000000\";\nexport const ColorBaseDestructive100 = \"#fef3f5\";\nexport const ColorBaseDestructive200 = \"#fad6de\";\nexport const ColorBaseDestructive300 = \"#f2a2b2\";\nexport const ColorBaseDestructive700 = \"#d32a4b\";\nexport const ColorBaseDestructive800 = \"#81162c\";\nexport const ColorBaseDestructive900 = \"#55101d\";\nexport const ColorBaseGray10 = \"#cbcbcb\"; // Used as the default color for dividers and inner strokes\nexport const ColorBaseGray30 = \"#000000\"; // For IconButton background when on top of an image\nexport const ColorBaseGray60 = \"#000000\"; // Used for icon background in classroom video grid\nexport const ColorBaseGray80 = \"#000000\"; // Used as the background for modals\nexport const ColorBaseGray100 = \"#f7f7f7\";\nexport const ColorBaseGray200 = \"#f0f0f0\"; // Used for light mode backgrounds when showing card content on top\nexport const ColorBaseGray300 = \"#d0d0d0\"; // Used for component outlines, eg: select and textfield\nexport const ColorBaseGray700 = \"#767676\"; // For secondary text in light mode\nexport const ColorBaseGray800 = \"#353535\";\nexport const ColorBaseGray900 = \"#191919\"; // Default text color, Classroom background\nexport const ColorBaseOrange100 = \"#fdf2f0\";\nexport const ColorBaseOrange200 = \"#f6cdc4\";\nexport const ColorBaseOrange300 = \"#ec9987\";\nexport const ColorBaseOrange700 = \"#c34124\";\nexport const ColorBaseOrange800 = \"#732818\";\nexport const ColorBaseOrange900 = \"#4d1a10\";\nexport const ColorBasePrimary100 = \"#eff6fa\";\nexport const ColorBasePrimary200 = \"#c1dbe7\";\nexport const ColorBasePrimary300 = \"#84b7d0\";\nexport const ColorBasePrimary700 = \"#236482\";\nexport const ColorBasePrimary800 = \"#274858\";\nexport const ColorBasePrimary900 = \"#1b303b\";\nexport const ColorBaseSuccess100 = \"#eff7f1\";\nexport const ColorBaseSuccess200 = \"#bddcc6\";\nexport const ColorBaseSuccess300 = \"#81ba92\";\nexport const ColorBaseSuccess700 = \"#397b4d\";\nexport const ColorBaseSuccess800 = \"#2d4936\";\nexport const ColorBaseSuccess900 = \"#1e3124\";\nexport const ColorBasePurple100 = \"#f9f5fa\";\nexport const ColorBasePurple200 = \"#e8dceb\";\nexport const ColorBasePurple300 = \"#cdb4d3\";\nexport const ColorBasePurple700 = \"#8b5f95\";\nexport const ColorBasePurple800 = \"#523b58\";\nexport const ColorBasePurple900 = \"#37273b\";\nexport const ColorBaseYellow100 = \"#fdf5d9\";\nexport const ColorBaseYellow200 = \"#fbe8a3\";\nexport const ColorBaseYellow300 = \"#f8d663\";\nexport const ColorBaseYellow700 = \"#ffc929\";\nexport const ColorBaseYellow800 = \"#765f1c\";\nexport const ColorBaseYellow900 = \"#3b3009\";\nexport const ColorBaseWhite = \"#ffffff\";\nexport const ColorCambioBlack = \"#050500\";\nexport const ColorCambioWhite = \"#ffffff\";\nexport const ColorCambioGray100 = \"#faf4eb\";\nexport const ColorCambioGray200 = \"#e4dbd3\";\nexport const ColorCambioGray300 = \"#beb4ab\";\nexport const ColorCambioGray370 = \"#beb4ab\";\nexport const ColorCambioGray700 = \"#888077\";\nexport const ColorCambioGray800 = \"#5c554d\";\nexport const ColorCambioGray870 = \"#5c554d\";\nexport const ColorCambioGray900 = \"#312b23\";\nexport const ColorCambioDestructive100 = \"#ffdeda\";\nexport const ColorCambioDestructive300 = \"#ff8071\";\nexport const ColorCambioDestructive370 = \"#ff8071\";\nexport const ColorCambioDestructive700 = \"#c93f32\";\nexport const ColorCambioDestructive770 = \"#c93f32\";\nexport const ColorCambioDestructive900 = \"#6d0002\";\nexport const ColorCambioSuccess100 = \"#daf2c8\";\nexport const ColorCambioSuccess300 = \"#84ce64\";\nexport const ColorCambioSuccess370 = \"#84ce64\";\nexport const ColorCambioSuccess700 = \"#3c7f20\";\nexport const ColorCambioSuccess770 = \"#3c7f20\";\nexport const ColorCambioSuccess900 = \"#103e00\";\nexport const ColorCambioRed = \"#f56e56\";\nexport const ColorCambioOrange = \"#ff8f57\";\nexport const ColorCambioTan = \"#ffb47d\";\nexport const ColorCambioCream = \"#fffad1\";\nexport const ColorCambioPurple = \"#6840a8\";\nexport const ColorCambioLilac = \"#b59ef0\";\nexport const ColorCambioThistle = \"#d69ca4\";\nexport const ColorCambioPink = \"#ffccea\";\nexport const ColorCambioNavy = \"#191142\";\nexport const ColorCambioTeal = \"#44a6cf\";\nexport const ColorCambioSlate = \"#7c9fc6\";\nexport const ColorCambioSky = \"#b1e8fc\";\nexport const ColorCambioYellow700 = \"#ffe733\";\nexport const ColorCambioTransparentFull = \"#000000\";\nexport const Elevation400 = \"0px 16px 32px 0px #00000040\";\nexport const SyntaxFontSansSerif = \"-apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif\";\n"]}

package/dist/__chunks/{KWT6ABYP.cjs → OAZD7W2W.cjs}

@@ -16,7 +16,7 @@ var _UQY2ELTZcjs = require('./UQY2ELTZ.cjs');
 var _J43HGNHNcjs = require('./J43HGNHN.cjs');
 
 
-var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
+var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
 
 
 var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
@@ -53,7 +53,7 @@ var IconButton = _react.forwardRef.call(void 0,
     onClick
   }, ref) => {
     const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
-    const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
+    const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
     const foregroundColorClass = themeName === "classic" ? _UQY2ELTZcjs.classicForegroundColor.call(void 0, _HWQUS53Mcjs.classicColor.call(void 0, color)) : _UQY2ELTZcjs.cambioForegroundColor.call(void 0, _HWQUS53Mcjs.cambioColor.call(void 0, color), on);
     const backgroundColorClass = themeName === "classic" ? _J43HGNHNcjs.classicBackgroundColor.call(void 0, _HWQUS53Mcjs.classicColor.call(void 0, color)) : _J43HGNHNcjs.cambioBackgroundColor.call(void 0, _HWQUS53Mcjs.cambioColor.call(void 0, color), on);
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -93,4 +93,4 @@ var IconButton_default = IconButton;
 
 
 exports.IconButton_default = IconButton_default;
-//# sourceMappingURL=KWT6ABYP.cjs.map
+//# sourceMappingURL=OAZD7W2W.cjs.map

package/dist/__chunks/{WZZQUJZF.cjs → PDKMXSDQ.cjs}

@@ -1,29 +1,29 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _VBQTLO2Pcjs = require('./VBQTLO2P.cjs');
+var _RVFY33X2cjs = require('./RVFY33X2.cjs');
 
 
-var _IXDYGNLNcjs = require('./IXDYGNLN.cjs');
+var _QZZW6BPPcjs = require('./QZZW6BPP.cjs');
 
 
-var _MG2NM3WUcjs = require('./MG2NM3WU.cjs');
+var _HYRATHVKcjs = require('./HYRATHVK.cjs');
 
 
-var _2TLKWIYCcjs = require('./2TLKWIYC.cjs');
+var _M2CJONYScjs = require('./M2CJONYS.cjs');
 
 
-var _J3ES6ZT6cjs = require('./J3ES6ZT6.cjs');
+var _Y2TA6QLYcjs = require('./Y2TA6QLY.cjs');
 
 
-var _OVXHL32Ncjs = require('./OVXHL32N.cjs');
+var _AGJ2QSEPcjs = require('./AGJ2QSEP.cjs');
 
 
 
 var _RYUXG4AScjs = require('./RYUXG4AS.cjs');
 
 
-var _E4LISCR7cjs = require('./E4LISCR7.cjs');
+var _GANR5JVVcjs = require('./GANR5JVV.cjs');
 
 // src/RichSelect/RichSelectBox.tsx
 
@@ -125,7 +125,7 @@ var RichSelectBox = _react.forwardRef.call(void 0,
       });
     }, []);
     const { autoFocus } = _react.useContext.call(void 0, RichSelectBoxContext);
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RYUXG4AScjs.RichSelectItemContext.Provider, { value: { disableKey }, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _E4LISCR7cjs.Box_default, { children: [
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RYUXG4AScjs.RichSelectItemContext.Provider, { value: { disableKey }, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _GANR5JVVcjs.Box_default, { children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         _reactariacomponents.ListBox,
         {
@@ -144,7 +144,7 @@ var RichSelectBox = _react.forwardRef.call(void 0,
         }
       ),
       !autosave && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-        _E4LISCR7cjs.Box_default,
+        _GANR5JVVcjs.Box_default,
         {
           backgroundColor: "white",
           display: "flex",
@@ -159,17 +159,17 @@ var RichSelectBox = _react.forwardRef.call(void 0,
             }
           },
           children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _E4LISCR7cjs.Box_default, { flex: "grow", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _MG2NM3WUcjs.Divider, {}) }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _GANR5JVVcjs.Box_default, { flex: "grow", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _HYRATHVKcjs.Divider, {}) }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _E4LISCR7cjs.Box_default,
+              _GANR5JVVcjs.Box_default,
               {
                 paddingY: 5,
                 marginTop: -5,
                 display: "flex",
                 justifyContent: "end",
-                children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _VBQTLO2Pcjs.ButtonGroup_default, { orientation: "horizontal", children: [
+                children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _RVFY33X2cjs.ButtonGroup_default, { orientation: "horizontal", children: [
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _IXDYGNLNcjs.Button_default,
+                    _QZZW6BPPcjs.Button_default,
                     {
                       onClick: clearChanges,
                       color: "secondary",
@@ -179,7 +179,7 @@ var RichSelectBox = _react.forwardRef.call(void 0,
                     }
                   ),
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _IXDYGNLNcjs.Button_default,
+                    _QZZW6BPPcjs.Button_default,
                     {
                       onClick: saveChanges,
                       text: primaryButtonText,
@@ -198,9 +198,9 @@ var RichSelectBox = _react.forwardRef.call(void 0,
   }
 );
 var RichSelectBox_default = Object.assign(RichSelectBox, {
-  Section: _J3ES6ZT6cjs.RichSelectSection_default,
-  Chip: _2TLKWIYCcjs.RichSelectChip_default,
-  RadioButton: _OVXHL32Ncjs.RichSelectRadioButton_default
+  Section: _Y2TA6QLYcjs.RichSelectSection_default,
+  Chip: _M2CJONYScjs.RichSelectChip_default,
+  RadioButton: _AGJ2QSEPcjs.RichSelectRadioButton_default
 });
 
 
@@ -208,4 +208,4 @@ var RichSelectBox_default = Object.assign(RichSelectBox, {
 
 
 exports.convertSelection = convertSelection; exports.RichSelectBoxContext = RichSelectBoxContext; exports.RichSelectBox_default = RichSelectBox_default;
-//# sourceMappingURL=WZZQUJZF.cjs.map
+//# sourceMappingURL=PDKMXSDQ.cjs.map

package/dist/__chunks/{4MLT3AHK.cjs → PKBQW5T6.cjs}

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _E4LISCR7cjs = require('./E4LISCR7.cjs');
+var _GANR5JVVcjs = require('./GANR5JVV.cjs');
 
 
-var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
+var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
 
 // src/AvatarGroup/AvatarGroup.tsx
 
@@ -22,10 +22,10 @@ function AvatarGroup({
   orientation = "standard",
   children
 }) {
-  const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
+  const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
   const parsedSize = themeName === "cambio" && size === "xl" ? "lg" : size;
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AvatarGroupContext.Provider, { value: { size: parsedSize, orientation }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _E4LISCR7cjs.Box_default,
+    _GANR5JVVcjs.Box_default,
     {
       display: "flex",
       justifyContent: orientation === "standard" ? "start" : "end",
@@ -44,4 +44,4 @@ AvatarGroup.displayName = "AvatarGroup";
 
 
 exports.useAvatarGroup = useAvatarGroup; exports.AvatarGroup = AvatarGroup;
-//# sourceMappingURL=4MLT3AHK.cjs.map
+//# sourceMappingURL=PKBQW5T6.cjs.map

package/dist/__chunks/{G4L4P5KD.js → Q4HTXMNF.js}

@@ -1,10 +1,10 @@
 "use client"
 import {
   Box_default
-} from "./XQM7YZ26.js";
+} from "./HCHFPFNX.js";
 import {
   useTheme
-} from "./ZSHAHV4F.js";
+} from "./4GTNQPPD.js";
 
 // src/AvatarGroup/AvatarGroup.tsx
 import {
@@ -44,4 +44,4 @@ export {
   useAvatarGroup,
   AvatarGroup
 };
-//# sourceMappingURL=G4L4P5KD.js.map
+//# sourceMappingURL=Q4HTXMNF.js.map

package/dist/__chunks/{IXDYGNLN.cjs → QZZW6BPP.cjs}

@@ -22,13 +22,13 @@ var _UQY2ELTZcjs = require('./UQY2ELTZ.cjs');
 var _J43HGNHNcjs = require('./J43HGNHN.cjs');
 
 
-var _E4LISCR7cjs = require('./E4LISCR7.cjs');
+var _GANR5JVVcjs = require('./GANR5JVV.cjs');
 
 
-var _TJN7NBWUcjs = require('./TJN7NBWU.cjs');
+var _YJWKUNYUcjs = require('./YJWKUNYU.cjs');
 
 
-var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
+var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
 
 
 var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
@@ -61,7 +61,7 @@ var Button = _react.forwardRef.call(void 0,
     type = "button"
   }, ref) => {
     const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
-    const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
+    const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
     const foregroundColorClass = themeName === "classic" ? _UQY2ELTZcjs.classicForegroundColor.call(void 0, _HWQUS53Mcjs.classicColor.call(void 0, color)) : _UQY2ELTZcjs.cambioForegroundColor.call(void 0, _HWQUS53Mcjs.cambioColor.call(void 0, color), on);
     const backgroundColorClass = themeName === "classic" ? _J43HGNHNcjs.classicBackgroundColor.call(void 0, _HWQUS53Mcjs.classicColor.call(void 0, color)) : _J43HGNHNcjs.cambioBackgroundColor.call(void 0, _HWQUS53Mcjs.cambioColor.call(void 0, color), on);
     const disabledCambioPrimary = themeName === "cambio" && color === "primary" && disabled;
@@ -98,8 +98,8 @@ var Button = _react.forwardRef.call(void 0,
               )
             }
           ),
-          (loading && loadingText || !loading && text) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _E4LISCR7cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _TJN7NBWUcjs.Typography_default,
+          (loading && loadingText || !loading && text) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _GANR5JVVcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _YJWKUNYUcjs.Typography_default,
             {
               size: themeName === "classic" ? _5JUNB754cjs.textVariant_default[size] : _5JUNB754cjs.textVariant_default[size],
               children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -157,4 +157,4 @@ var Button_default = Button;
 
 
 exports.Button_default = Button_default;
-//# sourceMappingURL=IXDYGNLN.cjs.map
+//# sourceMappingURL=QZZW6BPP.cjs.map

package/dist/__chunks/{MKGPWRAB.cjs → RJX7ZVAG.cjs}

@@ -1,13 +1,13 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _E4LISCR7cjs = require('./E4LISCR7.cjs');
+var _GANR5JVVcjs = require('./GANR5JVV.cjs');
 
 
-var _TJN7NBWUcjs = require('./TJN7NBWU.cjs');
+var _YJWKUNYUcjs = require('./YJWKUNYU.cjs');
 
 
-var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
+var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
 
 // css-module:./Badge.module.css#css-module
 var Badge_module_default = { "icon": "_icon_1g9xb_1" };
@@ -78,10 +78,10 @@ var Badge = ({
   text,
   color = "primary700"
 }) => {
-  const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
+  const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
   const mappedColor = themeName === "cambio" ? badgeColorClassicToCambio[color] : badgeColorCambioToClassic[color];
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _E4LISCR7cjs.Box_default,
+    _GANR5JVVcjs.Box_default,
     {
       display: themeName === "classic" ? "inlineBlock" : "inlineFlex",
       paddingX: themeName === "classic" ? 2 : 3,
@@ -91,10 +91,10 @@ var Badge = ({
       alignItems: "center",
       justifyContent: "center",
       height: themeName === "cambio" ? 32 : void 0,
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _TJN7NBWUcjs.Typography_default, { color: textColorForBackgroundColor(mappedColor), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _E4LISCR7cjs.Box_default, { display: "flex", gap: 1, alignItems: "center", justifyContent: "start", children: [
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _YJWKUNYUcjs.Typography_default, { color: textColorForBackgroundColor(mappedColor), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _GANR5JVVcjs.Box_default, { display: "flex", gap: 1, alignItems: "center", justifyContent: "start", children: [
         Icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: Badge_module_default.icon }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _TJN7NBWUcjs.Typography_default,
+          _YJWKUNYUcjs.Typography_default,
           {
             color: textColorForBackgroundColor(mappedColor),
             size: 100,
@@ -111,4 +111,4 @@ var Badge_default = Badge;
 
 
 exports.Badge_default = Badge_default;
-//# sourceMappingURL=MKGPWRAB.cjs.map
+//# sourceMappingURL=RJX7ZVAG.cjs.map

package/dist/__chunks/{VBQTLO2P.cjs → RVFY33X2.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
 
 
-var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
+var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
 
 // css-module:./ButtonGroup.module.css#css-module
 var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_e77bq_1", "horizontal": "_horizontal_e77bq_5", "vertical": "_vertical_e77bq_9", "smallGap": "_smallGap_e77bq_13", "mediumGap": "_mediumGap_e77bq_17", "largeGap": "_largeGap_e77bq_21", "smallGapCambio": "_smallGapCambio_e77bq_25", "mediumGapCambio": "_mediumGapCambio_e77bq_29", "largeGapCambio": "_largeGapCambio_e77bq_33" };
@@ -24,7 +24,7 @@ var ButtonGroup = ({
   size = "md",
   children
 }) => {
-  const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
+  const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
   const classnames = _classnames2.default.call(void 0, 
     ButtonGroup_module_default.buttonGroup,
     themeName === "classic" ? gapClassic[size] : gapCambio[size],
@@ -40,4 +40,4 @@ var ButtonGroup_default = ButtonGroup;
 
 
 exports.ButtonGroup_default = ButtonGroup_default;
-//# sourceMappingURL=VBQTLO2P.cjs.map
+//# sourceMappingURL=RVFY33X2.cjs.map

package/dist/__chunks/{Z6B4SAEZ.cjs → SRAYR7UN.cjs}

@@ -3,38 +3,38 @@
 
 
 
-var _WZZQUJZFcjs = require('./WZZQUJZF.cjs');
+var _PDKMXSDQcjs = require('./PDKMXSDQ.cjs');
 
 
-var _2TLKWIYCcjs = require('./2TLKWIYC.cjs');
+var _M2CJONYScjs = require('./M2CJONYS.cjs');
 
 
-var _L5FISA2Ucjs = require('./L5FISA2U.cjs');
+var _LECUYS4Ocjs = require('./LECUYS4O.cjs');
 
 
-var _RINTHGJZcjs = require('./RINTHGJZ.cjs');
+var _W5MIJIZAcjs = require('./W5MIJIZA.cjs');
 
 
 var _UKLQ64N7cjs = require('./UKLQ64N7.cjs');
 
 
 
-var _CCDZUAUUcjs = require('./CCDZUAUU.cjs');
+var _O2J3F7UEcjs = require('./O2J3F7UE.cjs');
 
 
-var _J3ES6ZT6cjs = require('./J3ES6ZT6.cjs');
+var _Y2TA6QLYcjs = require('./Y2TA6QLY.cjs');
 
 
-var _OVXHL32Ncjs = require('./OVXHL32N.cjs');
+var _AGJ2QSEPcjs = require('./AGJ2QSEP.cjs');
 
 
-var _E4LISCR7cjs = require('./E4LISCR7.cjs');
+var _GANR5JVVcjs = require('./GANR5JVV.cjs');
 
 
-var _TJN7NBWUcjs = require('./TJN7NBWU.cjs');
+var _YJWKUNYUcjs = require('./YJWKUNYU.cjs');
 
 
-var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
+var _JXOKXBDZcjs = require('./JXOKXBDZ.cjs');
 
 
 var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
@@ -108,14 +108,14 @@ function RichSelectList(props) {
   const inputId = id != null ? id : reactId;
   const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
   const disabled = !isHydrated || disabledProp;
-  const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
+  const { themeName } = _JXOKXBDZcjs.useTheme.call(void 0, );
   const overlayHandlerRef = _react.useRef.call(void 0, {});
   const selectedKeysProp = _react.useMemo.call(void 0, 
-    () => _WZZQUJZFcjs.convertSelection.call(void 0, selectedValuesProp),
+    () => _PDKMXSDQcjs.convertSelection.call(void 0, selectedValuesProp),
     [selectedValuesProp]
   );
   const defaultSelectedKeys = _react.useMemo.call(void 0, 
-    () => _WZZQUJZFcjs.convertSelection.call(void 0, defaultSelectedValuesProp, /* @__PURE__ */ new Set()),
+    () => _PDKMXSDQcjs.convertSelection.call(void 0, defaultSelectedValuesProp, /* @__PURE__ */ new Set()),
     [defaultSelectedValuesProp]
   );
   const [selectedKeys, setSelectedKeys] = _utils.useControlledState.call(void 0, 
@@ -153,8 +153,8 @@ function RichSelectList(props) {
     _reactariacomponents.Provider,
     {
       values: [
-        [_WZZQUJZFcjs.RichSelectBoxContext, { autoFocus: true }],
-        [_RINTHGJZcjs.DialogContext, { padding: autosave ? void 0 : 0 }]
+        [_PDKMXSDQcjs.RichSelectBoxContext, { autoFocus: true }],
+        [_W5MIJIZAcjs.DialogContext, { padding: autosave ? void 0 : 0 }]
         // this is altering Popover's internal dialog padding to show the sticky save/close buttons. Ideally this could be avoided
       ],
       children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -177,23 +177,23 @@ function RichSelectList(props) {
                   (_a2 = fieldRef.current) == null ? void 0 : _a2.focus();
                   _interactions.setInteractionModality.call(void 0, "keyboard");
                 },
-                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _E4LISCR7cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _TJN7NBWUcjs.Typography_default, { size: 100, color: "gray700", children: label }) })
+                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _GANR5JVVcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _YJWKUNYUcjs.Typography_default, { size: 100, color: "gray700", children: label }) })
               })
             ) }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _L5FISA2Ucjs.Popover_default,
+              _LECUYS4Ocjs.Popover_default,
               {
                 ref: overlayHandlerRef,
                 disabled,
                 content: (
                   // this Box wrapper is to reapply the padding that was stripped from popover's dialog to show the sticky save/close buttons. Ideally this could be avoided
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _E4LISCR7cjs.Box_default,
+                    _GANR5JVVcjs.Box_default,
                     {
                       padding: autosave ? void 0 : 5,
                       dangerouslySetInlineStyle: autosave ? void 0 : { __style: { paddingBottom: 0 } },
                       children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        _WZZQUJZFcjs.RichSelectBox_default,
+                        _PDKMXSDQcjs.RichSelectBox_default,
                         _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
                           autosave,
                           selectedValues: selectedKeys,
@@ -243,7 +243,7 @@ function RichSelectList(props) {
                           children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                             "path",
                             {
-                              fill: errorText ? _CCDZUAUUcjs.ColorBaseDestructive700 : _CCDZUAUUcjs.ColorBaseGray800,
+                              fill: errorText ? _O2J3F7UEcjs.ColorBaseDestructive700 : _O2J3F7UEcjs.ColorBaseGray800,
                               d: "M15.88 9.29 12 13.17 8.12 9.29a.9959.9959 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41-.39-.38-1.03-.39-1.42 0z"
                             }
                           )
@@ -254,8 +254,8 @@ function RichSelectList(props) {
                 )
               }
             ),
-            (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _E4LISCR7cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _TJN7NBWUcjs.Typography_default,
+            (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _GANR5JVVcjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _YJWKUNYUcjs.Typography_default,
               _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
                 size: 100,
                 color: errorText ? "destructive-primary" : "gray700"
@@ -270,12 +270,12 @@ function RichSelectList(props) {
   );
 }
 var RichSelectList_default = Object.assign(RichSelectList, {
-  Section: _J3ES6ZT6cjs.RichSelectSection_default,
-  Chip: _2TLKWIYCcjs.RichSelectChip_default,
-  RadioButton: _OVXHL32Ncjs.RichSelectRadioButton_default
+  Section: _Y2TA6QLYcjs.RichSelectSection_default,
+  Chip: _M2CJONYScjs.RichSelectChip_default,
+  RadioButton: _AGJ2QSEPcjs.RichSelectRadioButton_default
 });
 
 
 
 exports.RichSelectList_default = RichSelectList_default;
-//# sourceMappingURL=Z6B4SAEZ.cjs.map
+//# sourceMappingURL=SRAYR7UN.cjs.map

package/dist/__chunks/{LUGWXC6Z.js → UENUF2KR.js}

@@ -1,13 +1,13 @@
 "use client"
 import {
   Box_default
-} from "./XQM7YZ26.js";
+} from "./HCHFPFNX.js";
 import {
   Typography_default
-} from "./HINMIM2W.js";
+} from "./MDAWMKBY.js";
 import {
   useTheme
-} from "./ZSHAHV4F.js";
+} from "./4GTNQPPD.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -95,4 +95,4 @@ function TextField({
 export {
   TextField
 };
-//# sourceMappingURL=LUGWXC6Z.js.map
+//# sourceMappingURL=UENUF2KR.js.map

package/dist/__chunks/{WG6366VB.js → UF7SXHS4.js}

@@ -16,7 +16,7 @@ import {
 } from "./B7PDT66P.js";
 import {
   useTheme
-} from "./ZSHAHV4F.js";
+} from "./4GTNQPPD.js";
 
 // src/Dialog/Dialog.tsx
 import React, {
@@ -86,4 +86,4 @@ export {
   DialogContext,
   Dialog_default
 };
-//# sourceMappingURL=WG6366VB.js.map
+//# sourceMappingURL=UF7SXHS4.js.map