@cambly/syntax-core 10.13.0 → 10.15.0

package/dist/__chunks/{2ZUWZKPV.js → YKGFFSWB.js}

@@ -13,14 +13,33 @@ import {
 } from "./JB65NEXK.js";
 
 // src/Chip/Chip.tsx
-import { forwardRef } from "react";
+import { forwardRef, useMemo } from "react";
 import classnames from "classnames";
 
 // css-module:./Chip.module.css#css-module
-var Chip_module_default = { "chip": "_chip_1jp9s_1", "chipClassic": "_chipClassic_1jp9s_10", "chipCambio": "_chipCambio_1jp9s_15", "disabled": "_disabled_1jp9s_20", "deselectedChip": "_deselectedChip_1jp9s_25", "selectedChip": "_selectedChip_1jp9s_29", "deselectedChipCambio": "_deselectedChipCambio_1jp9s_34", "selectedChipCambio": "_selectedChipCambio_1jp9s_38", "icon": "_icon_1jp9s_42", "selectedIcon": "_selectedIcon_1jp9s_50", "sm": "_sm_1jp9s_54", "lg": "_lg_1jp9s_60", "forceFocus": "_forceFocus_1jp9s_67" };
+var Chip_module_default = { "chip": "_chip_1ndh3_1", "chipClassic": "_chipClassic_1ndh3_10", "chipCambio": "_chipCambio_1ndh3_15", "disabled": "_disabled_1ndh3_20", "deselectedChip": "_deselectedChip_1ndh3_25", "selectedChip": "_selectedChip_1ndh3_29", "deselectedChipCambio": "_deselectedChipCambio_1ndh3_34", "deselectedChipCambioOnDarkBackground": "_deselectedChipCambioOnDarkBackground_1ndh3_38", "selectedChipCambio": "_selectedChipCambio_1ndh3_42", "selectedChipCambioOnDarkBackground": "_selectedChipCambioOnDarkBackground_1ndh3_46", "icon": "_icon_1ndh3_50", "selectedIcon": "_selectedIcon_1ndh3_58", "sm": "_sm_1ndh3_62", "lg": "_lg_1ndh3_68", "forceFocus": "_forceFocus_1ndh3_75" };
 
 // src/Chip/Chip.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
+function typographyColor({
+  themeName,
+  selected,
+  on
+}) {
+  if (themeName === "cambio" && on === "darkBackground") {
+    if (selected) {
+      return "gray900";
+    } else {
+      return "white";
+    }
+  } else {
+    if (selected) {
+      return "white";
+    } else {
+      return "gray900";
+    }
+  }
+}
 var Chip = forwardRef(
   ({
     disabled: disabledProp = false,
@@ -28,6 +47,7 @@ var Chip = forwardRef(
     "data-testid": dataTestId,
     size = "sm",
     text,
+    on = "lightBackground",
     onChange,
     icon: Icon,
     dangerouslyForceFocusStyles
@@ -36,13 +56,15 @@ var Chip = forwardRef(
     const transformedSize = themeName === "cambio" ? "sm" : size;
     const isHydrated = useIsHydrated();
     const disabled = !isHydrated || disabledProp;
+    const selectedChipCambioStyle = on === "lightBackground" ? Chip_module_default.selectedChipCambio : Chip_module_default.selectedChipCambioOnDarkBackground;
+    const deselectedChipCambioStyle = on === "lightBackground" ? Chip_module_default.deselectedChipCambio : Chip_module_default.deselectedChipCambioOnDarkBackground;
     const chipStyles = classnames(
       Chip_module_default.chip,
       themeName === "classic" ? Chip_module_default.chipClassic : Chip_module_default.chipCambio,
       Chip_module_default[transformedSize],
       {
-        [themeName === "classic" ? Chip_module_default.selectedChip : Chip_module_default.selectedChipCambio]: selected,
-        [themeName === "classic" ? Chip_module_default.deselectedChip : Chip_module_default.deselectedChipCambio]: !selected,
+        [themeName === "classic" ? Chip_module_default.selectedChip : selectedChipCambioStyle]: selected,
+        [themeName === "classic" ? Chip_module_default.deselectedChip : deselectedChipCambioStyle]: !selected,
         [Chip_module_default.disabled]: disabled,
         [Chip_module_default.forceFocus]: dangerouslyForceFocusStyles
       }
@@ -54,6 +76,10 @@ var Chip = forwardRef(
       ["sm"]: 200,
       ["lg"]: 300
     };
+    const color = useMemo(
+      () => typographyColor({ themeName, selected, on }),
+      [themeName, selected, on]
+    );
     return /* @__PURE__ */ jsxs(
       "button",
       {
@@ -70,7 +96,7 @@ var Chip = forwardRef(
             Typography_default,
             {
               size: themeName === "classic" ? typographySize[transformedSize] : 100,
-              color: selected ? "white" : "gray900",
+              color,
               children: text
             }
           ) })
@@ -85,4 +111,4 @@ var Chip_default = Chip;
 export {
   Chip_default
 };
-//# sourceMappingURL=2ZUWZKPV.js.map
+//# sourceMappingURL=YKGFFSWB.js.map

package/dist/__chunks/YKGFFSWB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Chip/Chip.tsx","css-module:./Chip.module.css#css-module"],"sourcesContent":["import React, { forwardRef, useMemo } 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\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nfunction typographyColor({\n  themeName,\n  selected,\n  on,\n}: {\n  themeName: \"cambio\" | \"classic\";\n  selected: boolean;\n  on: \"lightBackground\" | \"darkBackground\";\n}): \"white\" | \"gray900\" {\n  if (themeName === \"cambio\" && on === \"darkBackground\") {\n    if (selected) {\n      return \"gray900\";\n    } else {\n      return \"white\";\n    }\n  } else {\n    if (selected) {\n      return \"white\";\n    } else {\n      return \"gray900\";\n    }\n  }\n}\n\ntype ChipProps = {\n  /**\n   * If true, the chip will be disabled.\n   */\n  disabled?: boolean;\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   * Classic:\n   * * `sm`: 32px\n   * * `lg`: 48px\n   *\n   * Cambio:\n   * * `sm`: 32px\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   * Indicate whether the badge renders on a light or dark background. Changes the color of the chip (Cambio only)\n   *\n   * @defaulValue `lightBackground`\n   */\n  on?: \"lightBackground\" | \"darkBackground\";\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  /** forces focus ring styling */\n  dangerouslyForceFocusStyles?: boolean;\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      disabled: disabledProp = false,\n      selected = false,\n      \"data-testid\": dataTestId,\n      size = \"sm\",\n      text,\n      on = \"lightBackground\",\n      onChange,\n      icon: Icon,\n      dangerouslyForceFocusStyles,\n    }: ChipProps,\n    ref,\n  ) => {\n    const { themeName } = useTheme();\n    const transformedSize = themeName === \"cambio\" ? \"sm\" : size;\n    const isHydrated = useIsHydrated();\n    const disabled = !isHydrated || disabledProp;\n\n    const selectedChipCambioStyle =\n      on === \"lightBackground\"\n        ? styles.selectedChipCambio\n        : styles.selectedChipCambioOnDarkBackground;\n\n    const deselectedChipCambioStyle =\n      on === \"lightBackground\"\n        ? styles.deselectedChipCambio\n        : styles.deselectedChipCambioOnDarkBackground;\n\n    const chipStyles = classnames(\n      styles.chip,\n      themeName === \"classic\" ? styles.chipClassic : styles.chipCambio,\n      styles[transformedSize],\n      {\n        [themeName === \"classic\"\n          ? styles.selectedChip\n          : selectedChipCambioStyle]: selected,\n        [themeName === \"classic\"\n          ? styles.deselectedChip\n          : deselectedChipCambioStyle]: !selected,\n        [styles.disabled]: disabled,\n        [styles.forceFocus]: dangerouslyForceFocusStyles,\n      },\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\n    const color = useMemo(\n      () => typographyColor({ themeName, selected, on }),\n      [themeName, selected, on],\n    );\n\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={\n              themeName === \"classic\" ? typographySize[transformedSize] : 100\n            }\n            color={color}\n          >\n            {text}\n          </Typography>\n        </Box>\n      </button>\n    );\n  },\n);\n\nChip.displayName = \"Chip\";\n\nexport default Chip;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Chip/Chip.module.css\"; export default {\"chip\":\"_chip_1ndh3_1\",\"chipClassic\":\"_chipClassic_1ndh3_10\",\"chipCambio\":\"_chipCambio_1ndh3_15\",\"disabled\":\"_disabled_1ndh3_20\",\"deselectedChip\":\"_deselectedChip_1ndh3_25\",\"selectedChip\":\"_selectedChip_1ndh3_29\",\"deselectedChipCambio\":\"_deselectedChipCambio_1ndh3_34\",\"deselectedChipCambioOnDarkBackground\":\"_deselectedChipCambioOnDarkBackground_1ndh3_38\",\"selectedChipCambio\":\"_selectedChipCambio_1ndh3_42\",\"selectedChipCambioOnDarkBackground\":\"_selectedChipCambioOnDarkBackground_1ndh3_46\",\"icon\":\"_icon_1ndh3_50\",\"selectedIcon\":\"_selectedIcon_1ndh3_58\",\"sm\":\"_sm_1ndh3_62\",\"lg\":\"_lg_1ndh3_68\",\"forceFocus\":\"_forceFocus_1ndh3_75\"}"],"mappings":";;;;;;;;;;;;;;;AAAA,SAAgB,YAAY,eAAe;AAC3C,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,eAAc,yBAAwB,cAAa,wBAAuB,YAAW,sBAAqB,kBAAiB,4BAA2B,gBAAe,0BAAyB,wBAAuB,kCAAiC,wCAAuC,kDAAiD,sBAAqB,gCAA+B,sCAAqC,gDAA+C,QAAO,kBAAiB,gBAAe,0BAAyB,MAAK,gBAAe,MAAK,gBAAe,cAAa,uBAAsB;;;ADiJ1tB,SASW,KATX;AAzIN,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACF,GAIwB;AACtB,MAAI,cAAc,YAAY,OAAO,kBAAkB;AACrD,QAAI,UAAU;AACZ,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF,OAAO;AACL,QAAI,UAAU;AACZ,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF;AACF;AAwDA,IAAM,OAAO;AAAA,EACX,CACE;AAAA,IACE,UAAU,eAAe;AAAA,IACzB,WAAW;AAAA,IACX,eAAe;AAAA,IACf,OAAO;AAAA,IACP;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA,MAAM;AAAA,IACN;AAAA,EACF,GACA,QACG;AACH,UAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,UAAM,kBAAkB,cAAc,WAAW,OAAO;AACxD,UAAM,aAAa,cAAc;AACjC,UAAM,WAAW,CAAC,cAAc;AAEhC,UAAM,0BACJ,OAAO,oBACH,oBAAO,qBACP,oBAAO;AAEb,UAAM,4BACJ,OAAO,oBACH,oBAAO,uBACP,oBAAO;AAEb,UAAM,aAAa;AAAA,MACjB,oBAAO;AAAA,MACP,cAAc,YAAY,oBAAO,cAAc,oBAAO;AAAA,MACtD,oBAAO,eAAe;AAAA,MACtB;AAAA,QACE,CAAC,cAAc,YACX,oBAAO,eACP,uBAAuB,GAAG;AAAA,QAC9B,CAAC,cAAc,YACX,oBAAO,iBACP,yBAAyB,GAAG,CAAC;AAAA,QACjC,CAAC,oBAAO,QAAQ,GAAG;AAAA,QACnB,CAAC,oBAAO,UAAU,GAAG;AAAA,MACvB;AAAA,IACF;AACA,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;AAEA,UAAM,QAAQ;AAAA,MACZ,MAAM,gBAAgB,EAAE,WAAW,UAAU,GAAG,CAAC;AAAA,MACjD,CAAC,WAAW,UAAU,EAAE;AAAA,IAC1B;AAEA,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,MACE,cAAc,YAAY,eAAe,eAAe,IAAI;AAAA,cAE9D;AAAA,cAEC;AAAA;AAAA,UACH,GACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ;","names":[]}

package/dist/__chunks/{XSHPEZBA.cjs → ZDDA4AKB.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
 
 
-var _GRYQKIWRcjs = require('./GRYQKIWR.cjs');
+var _MUNI4VXLcjs = require('./MUNI4VXL.cjs');
 
 
 var _RYUXG4AScjs = require('./RYUXG4AS.cjs');
@@ -16,7 +16,7 @@ var _jsxruntime = require('react/jsx-runtime');
 var RichSelectChip_default = _react.forwardRef.call(void 0, 
   function RichSelectChip(props, ref) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RYUXG4AScjs.RichSelectItem_default, _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, props), { ref, children: ({ isSelected, isFocusVisible, isDisabled }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _GRYQKIWRcjs.Chip_default,
+      _MUNI4VXLcjs.Chip_default,
       {
         text: props.label,
         selected: isSelected,
@@ -31,4 +31,4 @@ var RichSelectChip_default = _react.forwardRef.call(void 0,
 
 
 exports.RichSelectChip_default = RichSelectChip_default;
-//# sourceMappingURL=XSHPEZBA.cjs.map
+//# sourceMappingURL=ZDDA4AKB.cjs.map

package/dist/__chunks/{NUDTHTSM.js → ZM7GAFGB.js}

@@ -3,13 +3,13 @@ import {
   RichSelectBoxContext,
   RichSelectBox_default,
   convertSelection
-} from "./L4RR2XJT.js";
+} from "./PX3OQSL4.js";
 import {
   RichSelectChip_default
-} from "./TIG3BSZG.js";
+} from "./4FB7KTL3.js";
 import {
   Popover_default
-} from "./ZLBPIQ2I.js";
+} from "./E7G4CMBM.js";
 import {
   DialogContext
 } from "./A7AAGKC2.js";
@@ -19,7 +19,7 @@ import {
 import {
   ColorBaseDestructive700,
   ColorBaseGray800
-} from "./EE5VI7K5.js";
+} from "./AVW5DTQH.js";
 import {
   RichSelectSection_default
 } from "./53I23AHM.js";
@@ -32,6 +32,9 @@ import {
 import {
   Typography_default
 } from "./2A52YKFW.js";
+import {
+  useTheme
+} from "./FY4WHNNR.js";
 import {
   useIsHydrated
 } from "./JB65NEXK.js";
@@ -56,11 +59,11 @@ import { useControlledState } from "@react-stately/utils";
 import { setInteractionModality } from "@react-aria/interactions";
 
 // css-module:../SelectList/SelectList.module.css#css-module
-var SelectList_module_default = { "selectContainer": "_selectContainer_1o5o7_1", "selectContainerCambio": "_selectContainerCambio_1o5o7_7", "opacityOverlay": "_opacityOverlay_1o5o7_11", "labelCambio": "_labelCambio_1o5o7_15", "selectWrapper": "_selectWrapper_1o5o7_26", "selectBox": "_selectBox_1o5o7_31", "selectBoxClassic": "_selectBoxClassic_1o5o7_47", "selectBoxCambio": "_selectBoxCambio_1o5o7_52", "selectMouseFocusStyling": "_selectMouseFocusStyling_1o5o7_60", "unselected": "_unselected_1o5o7_65", "selected": "_selected_1o5o7_69", "arrowIcon": "_arrowIcon_1o5o7_73", "sm": "_sm_1o5o7_87", "md": "_md_1o5o7_93", "lg": "_lg_1o5o7_99", "selectError": "_selectError_1o5o7_105", "selectErrorCambio": "_selectErrorCambio_1o5o7_111" };
+var SelectList_module_default = { "selectContainer": "_selectContainer_hzvfu_1", "selectContainerCambio": "_selectContainerCambio_hzvfu_7", "opacityOverlay": "_opacityOverlay_hzvfu_11", "labelCambio": "_labelCambio_hzvfu_15", "selectWrapper": "_selectWrapper_hzvfu_26", "selectBox": "_selectBox_hzvfu_31", "selectBoxClassic": "_selectBoxClassic_hzvfu_47", "selectBoxCambio": "_selectBoxCambio_hzvfu_52", "selectMouseFocusStyling": "_selectMouseFocusStyling_hzvfu_61", "unselected": "_unselected_hzvfu_66", "selected": "_selected_hzvfu_70", "arrowIcon": "_arrowIcon_hzvfu_74", "sm": "_sm_hzvfu_88", "md": "_md_hzvfu_94", "lg": "_lg_hzvfu_100", "selectError": "_selectError_hzvfu_106", "selectErrorCambio": "_selectErrorCambio_hzvfu_112" };
 
 // src/RichSelect/RichSelectList.tsx
 import { useField } from "react-aria";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var NOOP = () => void 0;
 var iconSize = {
   sm: 20,
@@ -105,6 +108,7 @@ function RichSelectList(props) {
   const inputId = id != null ? id : reactId;
   const isHydrated = useIsHydrated();
   const disabled = !isHydrated || disabledProp;
+  const { themeName } = useTheme();
   const overlayHandlerRef = useRef({});
   const selectedKeysProp = useMemo(
     () => convertSelection(selectedValuesProp),
@@ -157,16 +161,16 @@ function RichSelectList(props) {
         "div",
         {
           className: classNames(SelectList_module_default.selectContainer, {
-            [SelectList_module_default.opacityOverlay]: disabled
+            [SelectList_module_default.opacityOverlay]: disabled,
+            [SelectList_module_default.selectContainerCambio]: themeName === "cambio"
           }),
           children: [
-            /* @__PURE__ */ jsx(
+            label && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
               ReactAriaLabel,
               __spreadProps(__spreadValues({
                 "data-testid": [dataTestId, "label"].filter(Boolean).join("-"),
                 className: classNames(
-                  SelectList_module_default.selectContainer,
-                  SelectList_module_default.outerTextContainer
+                  themeName === "cambio" && SelectList_module_default.labelCambio
                 )
               }, labelProps), {
                 onClick: () => {
@@ -176,9 +180,9 @@ function RichSelectList(props) {
                   (_a2 = fieldRef.current) == null ? void 0 : _a2.focus();
                   setInteractionModality("keyboard");
                 },
-                children: label && /* @__PURE__ */ jsx("label", { className: SelectList_module_default.label, htmlFor: id, children: /* @__PURE__ */ jsx(Box_default, { paddingX: 1, children: /* @__PURE__ */ jsx(Typography_default, { size: 100, color: "gray700", children: label }) }) })
+                children: /* @__PURE__ */ jsx(Box_default, { paddingX: themeName === "classic" ? 1 : 3, children: /* @__PURE__ */ jsx(Typography_default, { size: 100, color: "gray700", children: label }) })
               })
-            ),
+            ) }),
             /* @__PURE__ */ jsx(
               Popover_default,
               {
@@ -219,11 +223,16 @@ function RichSelectList(props) {
                       /* @__PURE__ */ jsx(
                         "div",
                         {
-                          className: classNames(SelectList_module_default.selectBox, SelectList_module_default[size], {
-                            [SelectList_module_default.unselected]: !errorText && selectedKeys !== "all" && !selectedKeys.size,
-                            [SelectList_module_default.selected]: !errorText && (selectedKeys === "all" || selectedKeys.size),
-                            [SelectList_module_default.selectError]: errorText
-                          }),
+                          className: classNames(
+                            SelectList_module_default.selectBox,
+                            themeName === "classic" ? SelectList_module_default.selectBoxClassic : SelectList_module_default.selectBoxCambio,
+                            themeName === "classic" && SelectList_module_default[size],
+                            {
+                              [SelectList_module_default.unselected]: !errorText && selectedKeys !== "all" && !selectedKeys.size,
+                              [SelectList_module_default.selected]: !errorText && (selectedKeys === "all" || selectedKeys.size),
+                              [themeName === "classic" ? SelectList_module_default.selectError : SelectList_module_default.selectErrorCambio]: errorText
+                            }
+                          ),
                           children: selectedTextValue
                         }
                       ),
@@ -248,7 +257,7 @@ function RichSelectList(props) {
                 )
               }
             ),
-            (helperText || errorText) && /* @__PURE__ */ jsx("div", { className: SelectList_module_default.outerTextContainer, children: /* @__PURE__ */ jsx(
+            (helperText || errorText) && /* @__PURE__ */ jsx(Box_default, { paddingX: themeName === "classic" ? 1 : 0, children: /* @__PURE__ */ jsx(
               Typography_default,
               __spreadProps(__spreadValues({
                 size: 100,
@@ -272,4 +281,4 @@ var RichSelectList_default = Object.assign(RichSelectList, {
 export {
   RichSelectList_default
 };
-//# sourceMappingURL=NUDTHTSM.js.map
+//# sourceMappingURL=ZM7GAFGB.js.map

package/dist/__chunks/ZM7GAFGB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/RichSelect/RichSelectList.tsx","css-module:../SelectList/SelectList.module.css#css-module"],"sourcesContent":["import React, {\n  type ReactElement,\n  useMemo,\n  type SyntheticEvent,\n  useRef,\n  useId,\n} from \"react\";\nimport classNames from \"classnames\";\nimport {\n  ColorBaseDestructive700,\n  ColorBaseGray800,\n} from \"@cambly/syntax-design-tokens\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport Popover from \"../Popover/Popover\";\nimport {\n  Label as ReactAriaLabel,\n  Provider as ReactAriaProvider,\n} from \"react-aria-components\";\nimport { useControlledState } from \"@react-stately/utils\";\nimport { setInteractionModality } from \"@react-aria/interactions\";\nimport { DialogContext } from \"../Dialog/Dialog\";\nimport styles from \"../SelectList/SelectList.module.css\";\nimport RichSelectBox, {\n  RichSelectBoxContext,\n  convertSelection,\n  type RichSelectBoxProps,\n} from \"./RichSelectBox\";\nimport TapArea from \"../TapArea/TapArea\";\nimport { type OverlayHandlerRef } from \"../react-aria-utils/Triggerable\";\nimport Box from \"../Box/Box\";\nimport RichSelectSection from \"./RichSelectSection\";\nimport RichSelectChip from \"./RichSelectChip\";\nimport RichSelectRadioButton from \"./RichSelectRadioButton\";\nimport { useField } from \"react-aria\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\nconst NOOP = () => undefined;\n\nconst iconSize = {\n  sm: 20,\n  md: 24,\n  lg: 24,\n} as const;\n\nexport type RichSelectListProps = RichSelectBoxProps & {\n  /** Test id for the select element */\n  \"data-testid\"?: string;\n  /**\n   * Disables the select dropdown entirely\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /** Callback to be called when select is clicked */\n  onClick?: (event: SyntheticEvent<HTMLDivElement>) => void;\n  /** Text shown below select box if there is an input error. */\n  errorText?: string;\n  /** Text shown below select box */\n  helperText?: string;\n  /**\n   * RichSelectList id, if not provided, a unique id will be generated\n   */\n  id?: string;\n  /** Text shown above select box */\n  label: string;\n  /**\n   * Text showing in select box if no option has been chosen.\n   * There should always have a placeholder unless there is a default option selected\n   */\n  placeholderText?: string;\n  /** Use to render (override) text shown in the select box */\n  selectTextValue?: (selectedValues?: \"all\" | string[]) => string | undefined;\n  /**\n   * Size of the select box\n   *\n   * @defaultValue \"md\"\n   */\n  size?: \"sm\" | \"md\" | \"lg\";\n};\n\n/**\n * [RichSelectList](https://cambly-syntax.vercel.app/?path=/docs/components-richselectlist--docs) is a dropdown menu that allows users to select one or multiple options from a list.\n *\n * Example Usage:\n ```\n  <RichSelectList\n    label=\"My Label\"\n    multiple\n    onChange={() => { ... }}\n    primaryButtonText=\"Save\"\n    primaryButtonAccessibilityLabel=\"Save\"\n    secondaryButtonText=\"Clear\"\n    secondaryButtonAccessibilityLabel=\"Clear\"\n  >\n    <RichSelectList.Section label=\"Cities\">\n      <RichSelectList.Chip label=\"San Francisco\" value=\"sf\" />\n      <RichSelectList.Chip label=\"New York\" value=\"ny\" disabled />\n      <RichSelectList.Chip label=\"Tulsa\" value=\"tulsa\" />\n      <RichSelectList.Chip label=\"Chicago\" value=\"chicago\" disabled />\n    </RichSelectList.Section>\n  </RichSelectList>\n ```\n */\nfunction RichSelectList(props: RichSelectListProps): ReactElement {\n  const {\n    autosave,\n    children,\n    \"data-testid\": dataTestId,\n    disabled: disabledProp = false,\n    errorText,\n    helperText,\n    label,\n    id,\n    onChange,\n    onClick = NOOP,\n    placeholderText,\n    selectTextValue,\n    selectedValues: selectedValuesProp,\n    defaultSelectedValues: defaultSelectedValuesProp,\n    size = \"md\",\n    ...richSelectBoxProps\n  } = props;\n\n  const reactId = useId();\n  const inputId = id ?? reactId;\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n  const { themeName } = useTheme();\n\n  // passed to popover, which attached open/close methods\n  const overlayHandlerRef = useRef<OverlayHandlerRef>({});\n\n  const selectedKeysProp = useMemo(\n    () => convertSelection(selectedValuesProp),\n    [selectedValuesProp],\n  );\n  const defaultSelectedKeys = useMemo(\n    () => convertSelection(defaultSelectedValuesProp, new Set()),\n    [defaultSelectedValuesProp],\n  );\n  const [selectedKeys, setSelectedKeys] = useControlledState(\n    selectedKeysProp!, // eslint-disable-line @typescript-eslint/no-non-null-assertion -- there is a bug in the typedef for useControlledState from react-stately.  Internally they rely on value (first arg) able to be undefined\n    defaultSelectedKeys,\n    (value) => {\n      const _value = value === \"all\" ? \"all\" : [...value].map(String);\n      onChange(_value);\n      if (!autosave) overlayHandlerRef.current.close?.();\n    },\n  );\n\n  const selectedTextValue = useMemo(() => {\n    if (selectTextValue)\n      return (\n        selectTextValue(\n          selectedKeys === \"all\" ? \"all\" : [...selectedKeys].map(String),\n        ) ?? placeholderText\n      );\n    if (selectedKeys === \"all\") return \"All selected\";\n    if (selectedKeys.size) return `${selectedKeys.size} selected`;\n    return placeholderText;\n  }, [selectTextValue, selectedKeys, placeholderText]);\n\n  const fieldRef = useRef<HTMLDivElement>(null);\n  const { labelProps, fieldProps, descriptionProps, errorMessageProps } =\n    useField({\n      label, // this is the label for the select box\n      description: helperText,\n      errorMessage: errorText,\n    });\n\n  return (\n    <ReactAriaProvider\n      values={[\n        [RichSelectBoxContext, { autoFocus: true }],\n        [DialogContext, { padding: autosave ? undefined : 0 }], // this is altering Popover's internal dialog padding to show the sticky save/close buttons. Ideally this could be avoided\n      ]}\n    >\n      <div\n        className={classNames(styles.selectContainer, {\n          [styles.opacityOverlay]: disabled,\n          [styles.selectContainerCambio]: themeName === \"cambio\",\n        })}\n      >\n        {label && (\n          <>\n            <ReactAriaLabel\n              data-testid={[dataTestId, \"label\"].filter(Boolean).join(\"-\")}\n              className={classNames(\n                themeName === \"cambio\" && styles.labelCambio,\n              )}\n              {...labelProps}\n              onClick={() => {\n                if (disabled) return;\n                fieldRef.current?.focus();\n                setInteractionModality(\"keyboard\"); // Show the focus ring so the user knows where focus went\n              }}\n            >\n              <Box paddingX={themeName === \"classic\" ? 1 : 3}>\n                <Typography size={100} color=\"gray700\">\n                  {label}\n                </Typography>\n              </Box>\n            </ReactAriaLabel>\n          </>\n        )}\n        <Popover\n          ref={overlayHandlerRef}\n          disabled={disabled}\n          content={\n            // 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\n            <Box\n              padding={autosave ? undefined : 5}\n              dangerouslySetInlineStyle={\n                autosave ? undefined : { __style: { paddingBottom: 0 } }\n              }\n            >\n              <RichSelectBox\n                autosave={autosave}\n                selectedValues={selectedKeys}\n                defaultSelectedValues={defaultSelectedKeys}\n                onChange={(selected) => setSelectedKeys(new Set(selected))}\n                {...richSelectBoxProps}\n                accessibilityLabel={inputId}\n              >\n                {children}\n              </RichSelectBox>\n            </Box>\n          }\n        >\n          <TapArea\n            data-testid={dataTestId}\n            disabled={disabled}\n            onClick={onClick}\n            rounding={size === \"lg\" ? \"lg\" : \"md\"}\n            {...fieldProps}\n            ref={fieldRef}\n          >\n            <div className={styles.selectWrapper}>\n              <div\n                className={classNames(\n                  styles.selectBox,\n                  themeName === \"classic\"\n                    ? styles.selectBoxClassic\n                    : styles.selectBoxCambio,\n                  themeName === \"classic\" && styles[size],\n                  {\n                    [styles.unselected]:\n                      !errorText &&\n                      selectedKeys !== \"all\" &&\n                      !selectedKeys.size,\n                    [styles.selected]:\n                      !errorText &&\n                      (selectedKeys === \"all\" || selectedKeys.size),\n                    [themeName === \"classic\"\n                      ? styles.selectError\n                      : styles.selectErrorCambio]: errorText,\n                  },\n                )}\n              >\n                {selectedTextValue}\n              </div>\n              <div className={styles.arrowIcon}>\n                <svg\n                  focusable=\"false\"\n                  aria-hidden=\"true\"\n                  viewBox=\"0 0 24 24\"\n                  width={iconSize[size]}\n                >\n                  <path\n                    fill={\n                      errorText ? ColorBaseDestructive700 : ColorBaseGray800\n                    }\n                    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\"\n                  />\n                </svg>\n              </div>\n            </div>\n          </TapArea>\n        </Popover>\n        {(helperText || errorText) && (\n          <Box paddingX={themeName === \"classic\" ? 1 : 0}>\n            <Typography\n              size={100}\n              color={errorText ? \"destructive-primary\" : \"gray700\"}\n              {...(errorText ? errorMessageProps : descriptionProps)}\n            >\n              {errorText ? errorText : helperText}\n            </Typography>\n          </Box>\n        )}\n      </div>\n    </ReactAriaProvider>\n  );\n}\n\nexport default Object.assign(RichSelectList, {\n  Section: RichSelectSection,\n  Chip: RichSelectChip,\n  RadioButton: RichSelectRadioButton,\n});\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/SelectList/SelectList.module.css\"; export default {\"selectContainer\":\"_selectContainer_hzvfu_1\",\"selectContainerCambio\":\"_selectContainerCambio_hzvfu_7\",\"opacityOverlay\":\"_opacityOverlay_hzvfu_11\",\"labelCambio\":\"_labelCambio_hzvfu_15\",\"selectWrapper\":\"_selectWrapper_hzvfu_26\",\"selectBox\":\"_selectBox_hzvfu_31\",\"selectBoxClassic\":\"_selectBoxClassic_hzvfu_47\",\"selectBoxCambio\":\"_selectBoxCambio_hzvfu_52\",\"selectMouseFocusStyling\":\"_selectMouseFocusStyling_hzvfu_61\",\"unselected\":\"_unselected_hzvfu_66\",\"selected\":\"_selected_hzvfu_70\",\"arrowIcon\":\"_arrowIcon_hzvfu_74\",\"sm\":\"_sm_hzvfu_88\",\"md\":\"_md_hzvfu_94\",\"lg\":\"_lg_hzvfu_100\",\"selectError\":\"_selectError_hzvfu_106\",\"selectErrorCambio\":\"_selectErrorCambio_hzvfu_112\"}"],"mappings":"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","names":["_a"]}

package/dist/colors/backgroundColor.cjs

@@ -2,12 +2,12 @@
 
 
 
-var _A4O4F3KKcjs = require('../__chunks/A4O4F3KK.cjs');
+var _QWMAWIWIcjs = require('../__chunks/QWMAWIWI.cjs');
 require('../__chunks/VKB7KOAH.cjs');
 require('../__chunks/WFVGNGEP.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
 
-exports.cambioBackgroundColor = _A4O4F3KKcjs.cambioBackgroundColor; exports.classicBackgroundColor = _A4O4F3KKcjs.classicBackgroundColor;
+exports.cambioBackgroundColor = _QWMAWIWIcjs.cambioBackgroundColor; exports.classicBackgroundColor = _QWMAWIWIcjs.classicBackgroundColor;
 //# sourceMappingURL=backgroundColor.cjs.map

package/dist/colors/backgroundColor.d.ts

@@ -1,6 +1,6 @@
 import { Color, CambioColor } from '../constants.js';
 
 declare function classicBackgroundColor(color: (typeof Color)[number]): string;
-declare function cambioBackgroundColor(color: (typeof CambioColor)[number]): string;
+declare function cambioBackgroundColor(color: (typeof CambioColor)[number], on: "lightBackground" | "darkBackground"): string;
 
 export { cambioBackgroundColor, classicBackgroundColor };

package/dist/colors/backgroundColor.js

@@ -2,7 +2,7 @@
 import {
   cambioBackgroundColor,
   classicBackgroundColor
-} from "../__chunks/Y2OAIOQE.js";
+} from "../__chunks/OFW6A65B.js";
 import "../__chunks/FMQVMNVR.js";
 import "../__chunks/4U4UW4AK.js";
 import "../__chunks/UWGNJENA.js";

package/dist/colors/foregroundColor.cjs

@@ -2,12 +2,12 @@
 
 
 
-var _RKEF7WKZcjs = require('../__chunks/RKEF7WKZ.cjs');
+var _HCM63U3Jcjs = require('../__chunks/HCM63U3J.cjs');
 require('../__chunks/VKB7KOAH.cjs');
 require('../__chunks/WFVGNGEP.cjs');
 require('../__chunks/X2SDR4SD.cjs');
 
 
 
-exports.cambioForegroundColor = _RKEF7WKZcjs.cambioForegroundColor; exports.classicForegroundColor = _RKEF7WKZcjs.classicForegroundColor;
+exports.cambioForegroundColor = _HCM63U3Jcjs.cambioForegroundColor; exports.classicForegroundColor = _HCM63U3Jcjs.classicForegroundColor;
 //# sourceMappingURL=foregroundColor.cjs.map

package/dist/colors/foregroundColor.d.ts

@@ -1,6 +1,6 @@
 import { Color, CambioColor } from '../constants.js';
 
 declare function classicForegroundColor(color: (typeof Color)[number]): string;
-declare function cambioForegroundColor(color: (typeof CambioColor)[number]): string;
+declare function cambioForegroundColor(color: (typeof CambioColor)[number], on: "lightBackground" | "darkBackground"): string;
 
 export { cambioForegroundColor, classicForegroundColor };

package/dist/colors/foregroundColor.js

@@ -2,7 +2,7 @@
 import {
   cambioForegroundColor,
   classicForegroundColor
-} from "../__chunks/JVOQF4CG.js";
+} from "../__chunks/JGYZV3JA.js";
 import "../__chunks/FMQVMNVR.js";
 import "../__chunks/4U4UW4AK.js";
 import "../__chunks/UWGNJENA.js";

package/dist/index.cjs

@@ -13,7 +13,7 @@ var _LLI3KZARcjs = require('./__chunks/LLI3KZAR.cjs');
 var _W7GPAEHPcjs = require('./__chunks/W7GPAEHP.cjs');
 
 
-var _SFJT2TM2cjs = require('./__chunks/SFJT2TM2.cjs');
+var _OXXXLEUDcjs = require('./__chunks/OXXXLEUD.cjs');
 
 
 var _GBZPZQPJcjs = require('./__chunks/GBZPZQPJ.cjs');
@@ -31,35 +31,35 @@ require('./__chunks/BA4JPX36.cjs');
 var _ZFX4HW2Pcjs = require('./__chunks/ZFX4HW2P.cjs');
 
 
-var _RZCA77DHcjs = require('./__chunks/RZCA77DH.cjs');
+var _SI257QZEcjs = require('./__chunks/SI257QZE.cjs');
 require('./__chunks/4UJE5GMH.cjs');
 
 
-var _HZ7TRVX2cjs = require('./__chunks/HZ7TRVX2.cjs');
-require('./__chunks/OLWEXK5F.cjs');
+var _VOLO4QB4cjs = require('./__chunks/VOLO4QB4.cjs');
+require('./__chunks/4TWU6PQA.cjs');
 
 
 var _P3JJQI6Ncjs = require('./__chunks/P3JJQI6N.cjs');
 
 
-var _4JXNDR7Bcjs = require('./__chunks/4JXNDR7B.cjs');
+var _5T5R6ZMDcjs = require('./__chunks/5T5R6ZMD.cjs');
 require('./__chunks/3P2PWHOU.cjs');
 require('./__chunks/5JUNB754.cjs');
 require('./__chunks/54PSDUCD.cjs');
 
 
 var _VDAYXRSAcjs = require('./__chunks/VDAYXRSA.cjs');
-require('./__chunks/XSHPEZBA.cjs');
+require('./__chunks/ZDDA4AKB.cjs');
 
 
-var _GRYQKIWRcjs = require('./__chunks/GRYQKIWR.cjs');
+var _MUNI4VXLcjs = require('./__chunks/MUNI4VXL.cjs');
 
 
-var _BXUTWPRUcjs = require('./__chunks/BXUTWPRU.cjs');
-require('./__chunks/DSMWIJEY.cjs');
+var _EVDDEHP3cjs = require('./__chunks/EVDDEHP3.cjs');
+require('./__chunks/3P4HISCU.cjs');
 
 
-var _7P7YX4X2cjs = require('./__chunks/7P7YX4X2.cjs');
+var _IMYS42TLcjs = require('./__chunks/IMYS42TL.cjs');
 require('./__chunks/WRTSVDQZ.cjs');
 require('./__chunks/VL5ONCQD.cjs');
 require('./__chunks/WFVGNGEP.cjs');
@@ -67,7 +67,7 @@ require('./__chunks/HWQUS53M.cjs');
 
 
 var _UKLQ64N7cjs = require('./__chunks/UKLQ64N7.cjs');
-require('./__chunks/H6JCVQBU.cjs');
+require('./__chunks/C2JXAQM4.cjs');
 require('./__chunks/NFDOY7GE.cjs');
 require('./__chunks/MF7LLV7V.cjs');
 require('./__chunks/I5HC6BIK.cjs');
@@ -76,8 +76,8 @@ require('./__chunks/I5HC6BIK.cjs');
 var _GPW7ICYPcjs = require('./__chunks/GPW7ICYP.cjs');
 require('./__chunks/XLUVINJW.cjs');
 require('./__chunks/RYUXG4AS.cjs');
-require('./__chunks/RKEF7WKZ.cjs');
-require('./__chunks/A4O4F3KK.cjs');
+require('./__chunks/HCM63U3J.cjs');
+require('./__chunks/QWMAWIWI.cjs');
 require('./__chunks/VKB7KOAH.cjs');
 
 
@@ -134,5 +134,5 @@ require('./__chunks/X2SDR4SD.cjs');
 
 
 
-exports.Avatar = _CXD34CNPcjs.Avatar_default; exports.AvatarGroup = _LLI3KZARcjs.AvatarGroup; exports.Badge = _POGPHQGUcjs.Badge_default; exports.Box = _27K33DEMcjs.Box_default; exports.Button = _4JXNDR7Bcjs.Button_default; exports.ButtonGroup = _P3JJQI6Ncjs.ButtonGroup_default; exports.Card = _W7GPAEHPcjs.Card; exports.Checkbox = _GBZPZQPJcjs.Checkbox_default; exports.Chip = _GRYQKIWRcjs.Chip_default; exports.Divider = _VDAYXRSAcjs.Divider; exports.Heading = _XYAY2TL4cjs.Heading_default; exports.IconButton = _7P7YX4X2cjs.IconButton_default; exports.LinkButton = _SFJT2TM2cjs.LinkButton_default; exports.Modal = _YLJDLIHHcjs.Modal; exports.Popover = _BXUTWPRUcjs.Popover_default; exports.RadioButton = _GPW7ICYPcjs.RadioButton_default; exports.RichSelectList = _HZ7TRVX2cjs.RichSelectList_default; exports.SelectList = _RZCA77DHcjs.SelectList; exports.TapArea = _UKLQ64N7cjs.TapArea_default; exports.TextArea = _ZFX4HW2Pcjs.TextArea_default; exports.TextField = _4SUKTRWGcjs.TextField; exports.ThemeProvider = _6W5WRS53cjs.ThemeProvider; exports.Tooltip = _7TGECM7Wcjs.Tooltip_default; exports.Typography = _WGRHH5TFcjs.Typography_default;
+exports.Avatar = _CXD34CNPcjs.Avatar_default; exports.AvatarGroup = _LLI3KZARcjs.AvatarGroup; exports.Badge = _POGPHQGUcjs.Badge_default; exports.Box = _27K33DEMcjs.Box_default; exports.Button = _5T5R6ZMDcjs.Button_default; exports.ButtonGroup = _P3JJQI6Ncjs.ButtonGroup_default; exports.Card = _W7GPAEHPcjs.Card; exports.Checkbox = _GBZPZQPJcjs.Checkbox_default; exports.Chip = _MUNI4VXLcjs.Chip_default; exports.Divider = _VDAYXRSAcjs.Divider; exports.Heading = _XYAY2TL4cjs.Heading_default; exports.IconButton = _IMYS42TLcjs.IconButton_default; exports.LinkButton = _OXXXLEUDcjs.LinkButton_default; exports.Modal = _YLJDLIHHcjs.Modal; exports.Popover = _EVDDEHP3cjs.Popover_default; exports.RadioButton = _GPW7ICYPcjs.RadioButton_default; exports.RichSelectList = _VOLO4QB4cjs.RichSelectList_default; exports.SelectList = _SI257QZEcjs.SelectList; exports.TapArea = _UKLQ64N7cjs.TapArea_default; exports.TextArea = _ZFX4HW2Pcjs.TextArea_default; exports.TextField = _4SUKTRWGcjs.TextField; exports.ThemeProvider = _6W5WRS53cjs.ThemeProvider; exports.Tooltip = _7TGECM7Wcjs.Tooltip_default; exports.Typography = _WGRHH5TFcjs.Typography_default;
 //# sourceMappingURL=index.cjs.map