@cambly/syntax-core 20.7.0 → 21.1.0

package/dist/__chunks/R7BL4JYZ.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/IconLinkButton/IconLinkButton.tsx","css-module:../IconButton/IconButton.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AACP,OAAO,gBAAgB;;;ACL6E,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,mBAAkB;;;AD8I9R;AAxCR,IAAM,iBAAiB;AAAA,EACrB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,MAAM;AAAA,IACN,KAAK;AAAA,IACL;AAAA,IACA,WAAW;AAAA,IACX;AAAA,EACF,GACA,QACG;AACH,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AACtD,UAAM,uBAAuB,gBAAgB,OAAO,EAAE;AAEtD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAa;AAAA,QACb,cAAY;AAAA,QACZ,WAAW;AAAA,UACT,0BAAiB;AAAA,UACjB;AAAA,UACA;AAAA,UACA,OAAO,OAAO,EAAE;AAAA,UAChB,0BAAiB,IAAI;AAAA,UACrB;AAAA,YACE,CAAC,sBAAa,QAAQ,GAAG;AAAA,UAC3B;AAAA,QACF;AAAA,QACA;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,iBAAiB,IAAI;AAAA,YAChC,MAAM,iBAAiB,IAAI;AAAA;AAAA,QAC7B;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;AAE7B,IAAO,yBAAQ","sourcesContent":["import {\n  forwardRef,\n  type HtmlHTMLAttributes,\n  type ComponentProps,\n} from \"react\";\nimport classNames from \"classnames\";\nimport React from \"react\";\nimport { type Size } from \"../constants\";\nimport {\n  materialIconSize,\n  internalIconSize,\n} from \"../Button/constants/iconSize\";\nimport { border } from \"../colors/border\";\n\nimport buttonStyles from \"../Button/Button.module.css\";\nimport type InternalIcon from \"../Icon/Icon\";\nimport iconButtonStyles from \"../IconButton/IconButton.module.css\";\n\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { backgroundColor } from \"../colors/backgroundColor\";\n\ntype IconLinkButtonProps = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The link that the IconLinkButton should route to.\n   *\n   */\n  href?: string;\n  /**\n   * The target attribute specifies where to open the linked document.\n   *\n   */\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  /**\n   * The rel attribute specifies the relationship between the document and the link.\n   *\n   */\n  rel?: HtmlHTMLAttributes<HTMLAnchorElement>[\"rel\"];\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-primary\"\n    | \"success-secondary\"\n    | \"success-tertiary\";\n  /**\n   * The size of the button\n   * * `sm`: 32px\n   * * `md`: 48px\n   * * `lg`: 64px\n   *\n   * @defaultValue \"md\"\n   */\n  size?: (typeof Size)[number];\n  /**\n   * If `true`, the button will be disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * The label to be used for accessibility\n   */\n\n  accessibilityLabel: string;\n\n  /**\n   * The icon to be displayed.\n   *\n   * Deprecated: [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   * Preferred: Syntax icon\n   */\n  icon:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\n  /**\n   * Indicate whether the button renders on a light or dark background. Changes the color of the button\n   *\n   * @defaultValue `lightBackground`\n   */\n  on?: \"lightBackground\" | \"darkBackground\";\n  /**\n   * An optional onClick event. This is used for certain wrapper's support (such as react-router-dom).\n   */\n  onClick?: React.MouseEventHandler<HTMLAnchorElement>;\n};\n\n/**\n * [IconLinkButton](https://cambly-syntax.vercel.app/?path=/docs/components-iconlinkbutton--docs) is a \"variation\" of IconButton that should look identical to IconButton, but should be used to render links instead.\n */\nconst IconLinkButton = forwardRef<HTMLAnchorElement, IconLinkButtonProps>(\n  (\n    {\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      color = \"primary\",\n      size = \"md\",\n      icon: Icon,\n      on = \"lightBackground\",\n      onClick,\n      disabled = false,\n      accessibilityLabel,\n    }: IconLinkButtonProps,\n    ref,\n  ) => {\n    const foregroundColorClass = foregroundColor(color, on);\n    const backgroundColorClass = backgroundColor(color, on);\n\n    return (\n      <a\n        ref={ref}\n        href={href}\n        target={target}\n        rel={rel}\n        data-testid={dataTestId}\n        aria-label={accessibilityLabel}\n        className={classNames(\n          iconButtonStyles.iconButton,\n          foregroundColorClass,\n          backgroundColorClass,\n          border(color, on),\n          iconButtonStyles[size],\n          {\n            [buttonStyles.disabled]: disabled,\n          },\n        )}\n        onClick={onClick}\n      >\n        <Icon\n          className={materialIconSize[size]}\n          size={internalIconSize[size]}\n        />\n      </a>\n    );\n  },\n);\n\nIconLinkButton.displayName = \"IconLinkButton\";\n\nexport default IconLinkButton;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/IconButton/IconButton.module.css\"; export default {\"iconButton\":\"_iconButton_txjkh_1\",\"sm\":\"_sm_txjkh_46\",\"md\":\"_md_txjkh_51\",\"lg\":\"_lg_txjkh_56\",\"smIcon\":\"_smIcon_txjkh_61\",\"mdIcon\":\"_mdIcon_txjkh_68\",\"lgIcon\":\"_lgIcon_txjkh_75\"}"]}

package/dist/__chunks/RHJARLXB.cjs

@@ -1,160 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
-
-
-var _OKT24L6Dcjs = require('./OKT24L6D.cjs');
-
-
-var _KFNK5PLGcjs = require('./KFNK5PLG.cjs');
-
-
-var _QODNNCT2cjs = require('./QODNNCT2.cjs');
-
-
-var _PLUVW6AMcjs = require('./PLUVW6AM.cjs');
-
-
-var _IL22HCBFcjs = require('./IL22HCBF.cjs');
-
-
-var _E5P6WRJDcjs = require('./E5P6WRJD.cjs');
-
-
-
-
-var _X2SDR4SDcjs = require('./X2SDR4SD.cjs');
-
-// src/Dialog/ModalDialog.tsx
-
-
-var _react = require('react');
-
-
-
-
-var _reactariacomponents = require('react-aria-components');
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
-var _reactaria = require('react-aria');
-
-// css-module:./ModalDialog.module.css#css-module
-var ModalDialog_module_default = { "modalOverlay": "_modalOverlay_1fy5w_1", "modal": "_modal_1fy5w_1" };
-
-// src/Dialog/ModalDialog.tsx
-var _jsxruntime = require('react/jsx-runtime');
-function XIcon({ color = "#000" }) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", fill: color, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "path",
-    {
-      fill: "inherit",
-      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"
-    }
-  ) });
-}
-var AriaModalOverlay = _react.forwardRef.call(void 0, function AriaModalOverlay2(_a, ref) {
-  var _b = _a, { children } = _b, otherProps = _X2SDR4SDcjs.__objRest.call(void 0, _b, ["children"]);
-  const className = _classnames2.default.call(void 0, [
-    _IL22HCBFcjs.Box_module_default.box,
-    _IL22HCBFcjs.Box_module_default.fixed,
-    _IL22HCBFcjs.Box_module_default.box,
-    _IL22HCBFcjs.Box_module_default.flex,
-    _IL22HCBFcjs.Box_module_default.column,
-    _IL22HCBFcjs.Box_module_default.alignItemscenter,
-    _IL22HCBFcjs.Box_module_default.justifyContentcenter,
-    _PLUVW6AMcjs.padding_module_default.paddingX4,
-    _PLUVW6AMcjs.padding_module_default.paddingY4,
-    ModalDialog_module_default.modalOverlay
-  ]);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.ModalOverlay, _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, { ref }, _reactaria.mergeProps.call(void 0, { className }, otherProps)), { children }));
-});
-var AriaModal = _react.forwardRef.call(void 0, 
-  function AriaModal2(_a, ref) {
-    var _b = _a, { children: childrenProp, onChangeContentVisibility } = _b, otherProps = _X2SDR4SDcjs.__objRest.call(void 0, _b, ["children", "onChangeContentVisibility"]);
-    const className = _classnames2.default.call(void 0, [_IL22HCBFcjs.Box_module_default.box, ModalDialog_module_default.modal]);
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.Modal, _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, { ref }, _reactaria.mergeProps.call(void 0, { className }, otherProps)), { children: _reactariacomponents.composeRenderProps.call(void 0, 
-      childrenProp,
-      (children, { isEntering, isExiting }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _E5P6WRJDcjs.OverlayVisibility,
-          {
-            isEntering,
-            isExiting,
-            onChange: onChangeContentVisibility
-          }
-        ),
-        children
-      ] })
-    ) }));
-  }
-);
-var ModalDialog = _react.forwardRef.call(void 0, 
-  function ModalDialog2(props, ref) {
-    const {
-      "data-testid": dataTestId,
-      accessibilityLabel,
-      children,
-      dismissable = true,
-      accessibilityCloseLabel = "Dismiss",
-      initialOpen,
-      onChangeContentVisibility,
-      onOpenChange,
-      open
-    } = props;
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      AriaModalOverlay,
-      {
-        isDismissable: dismissable,
-        isKeyboardDismissDisabled: !dismissable,
-        defaultOpen: initialOpen,
-        isOpen: open,
-        onOpenChange,
-        children: ({ state }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          AriaModal,
-          {
-            ref,
-            "aria-label": accessibilityLabel,
-            onChangeContentVisibility,
-            children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-              _OKT24L6Dcjs.Dialog_default,
-              {
-                accessibilityLabel,
-                "data-testid": dataTestId,
-                children: [
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _QODNNCT2cjs.Box_default,
-                    {
-                      position: "absolute",
-                      padding: 2,
-                      dangerouslySetInlineStyle: {
-                        __style: {
-                          top: "0",
-                          right: "0"
-                        }
-                      },
-                      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        _KFNK5PLGcjs.IconButton_default,
-                        {
-                          onClick: () => state.close(),
-                          color: "tertiary",
-                          accessibilityLabel: accessibilityCloseLabel,
-                          icon: XIcon
-                        }
-                      )
-                    }
-                  ),
-                  children
-                ]
-              }
-            )
-          }
-        )
-      }
-    );
-  }
-);
-var ModalDialog_default = ModalDialog;
-
-
-
-
-
-exports.AriaModalOverlay = AriaModalOverlay; exports.AriaModal = AriaModal; exports.ModalDialog_default = ModalDialog_default;
-//# sourceMappingURL=RHJARLXB.cjs.map

package/dist/__chunks/RHJARLXB.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Dialog/ModalDialog.tsx","css-module:./ModalDialog.module.css#css-module"],"names":["AriaModalOverlay","AriaModal","ModalDialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,EAEE;AAAA,OAEK;AACP;AAAA,EACE,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB;AAAA,OAEK;AACP,OAAO,gBAAgB;AACvB,SAAS,kBAAkB;;;ACZsE,IAAO,6BAAQ,EAAC,gBAAe,yBAAwB,SAAQ,iBAAgB;;;ADwB1K,SA6DM,UA7DN,KA6DM,YA7DN;AAHN,SAAS,MAAM,EAAE,QAAQ,OAAO,GAA2C;AACzE,SACE,oBAAC,SAAI,OAAM,8BAA6B,OAAM,MAAK,QAAO,MAAK,MAAM,OACnE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,GAAE;AAAA;AAAA,EACJ,GACF;AAEJ;AAUO,IAAM,mBAAmB,WAG9B,SAASA,kBAAiB,IAA6B,KAAmB;AAAhD,eAAE,WA3C9B,IA2C4B,IAAe,uBAAf,IAAe,CAAb;AAC5B,QAAM,YAAY,WAAW;AAAA,IAC3B,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,mBAAU;AAAA,IACV,uBAAc;AAAA,IACd,uBAAc;AAAA,IACd,2BAAO;AAAA,EACT,CAAC;AACD,SACE,oBAAC,sDAAsB,OAAc,WAAW,EAAE,UAAU,GAAG,UAAU,IAAxE,EACE,WACH;AAEJ,CAAC;AAaM,IAAM,YAAY;AAAA,EACvB,SAASC,WACP,IACA,KACc;AAFd,iBAAE,YAAU,cAAc,0BA5E9B,IA4EI,IAAwD,uBAAxD,IAAwD,CAAtD,YAAwB;AAG1B,UAAM,YAAY,WAAW,CAAC,mBAAU,KAAK,2BAAO,KAAK,CAAC;AAC1D,WACE,oBAAC,+CAAe,OAAc,WAAW,EAAE,UAAU,GAAG,UAAU,IAAjE,EACE;AAAA,MACC;AAAA,MACA,CAAC,UAAU,EAAE,YAAY,UAAU,MACjC,iCACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,UAAU;AAAA;AAAA,QACZ;AAAA,QACC;AAAA,SACH;AAAA,IAEJ,IACF;AAAA,EAEJ;AACF;AAkCA,IAAM,cAAc;AAAA,EAClB,SAASC,aAAY,OAAO,KAAmB;AAC7C,UAAM;AAAA,MACJ,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd,0BAA0B;AAAA,MAC1B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI;AAEJ,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAe;AAAA,QACf,2BAA2B,CAAC;AAAA,QAC5B,aAAa;AAAA,QACb,QAAQ;AAAA,QACR;AAAA,QAEC,WAAC,EAAE,MAAM,MACR;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,cAAY;AAAA,YACZ;AAAA,YAEA;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,eAAa;AAAA,gBAEb;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,UAAS;AAAA,sBACT,SAAS;AAAA,sBACT,2BAA2B;AAAA,wBACzB,SAAS;AAAA,0BACP,KAAK;AAAA,0BACL,OAAO;AAAA,wBACT;AAAA,sBACF;AAAA,sBAEA;AAAA,wBAAC;AAAA;AAAA,0BACC,SAAS,MAAM,MAAM,MAAM;AAAA,0BAC3B,OAAM;AAAA,0BACN,oBAAoB;AAAA,0BACpB,MAAM;AAAA;AAAA,sBACR;AAAA;AAAA,kBACF;AAAA,kBACC;AAAA;AAAA;AAAA,YACH;AAAA;AAAA,QACF;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,IAAO,sBAAQ","sourcesContent":["import React, {\n  type ReactElement,\n  forwardRef,\n  type ComponentProps,\n} from \"react\";\nimport {\n  Modal as ReactAriaModal,\n  ModalOverlay as ReactAriaModalOverlay,\n  composeRenderProps,\n  type ModalOverlayProps as ReactAriaModalOverlayProps,\n} from \"react-aria-components\";\nimport classNames from \"classnames\";\nimport { mergeProps } from \"react-aria\";\nimport Dialog, { type DialogProps } from \"./Dialog\";\nimport OverlayVisibility from \"../react-aria-utils/OverlayVisibility\";\nimport paddingStyles from \"../Box/padding.module.css\";\nimport boxStyles from \"../Box/Box.module.css\";\nimport styles from \"./ModalDialog.module.css\";\nimport IconButton from \"../IconButton/IconButton\";\nimport Box from \"../Box/Box\";\n\nfunction XIcon({ color = \"#000\" }: { color?: string; className?: 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\ntype AriaModalOverlayProps = {\n  \"data-testid\"?: string;\n} & ReactAriaModalOverlayProps;\n/**\n * AriaModalOverlay: This component extends ModalOverlay from react-aria-components\n * It applies syntax styles and adds aadditional props:\n *  - data-testid\n */\nexport const AriaModalOverlay = forwardRef<\n  HTMLDivElement,\n  AriaModalOverlayProps\n>(function AriaModalOverlay({ children, ...otherProps }, ref): ReactElement {\n  const className = classNames([\n    boxStyles.box,\n    boxStyles.fixed,\n    boxStyles.box,\n    boxStyles.flex,\n    boxStyles.column,\n    boxStyles.alignItemscenter,\n    boxStyles.justifyContentcenter,\n    paddingStyles.paddingX4,\n    paddingStyles.paddingY4,\n    styles.modalOverlay,\n  ]);\n  return (\n    <ReactAriaModalOverlay ref={ref} {...mergeProps({ className }, otherProps)}>\n      {children}\n    </ReactAriaModalOverlay>\n  );\n});\n\ntype AriaModalProps = {\n  \"data-testid\"?: string;\n  /** Optional handler for change of visibility for overlaid content, for analytics timing */\n  onChangeContentVisibility?: (visible: boolean) => void;\n} & ComponentProps<typeof ReactAriaModal>;\n/**\n * AriaModal: This component extends Modal from react-aria-components\n * It applies syntax styles and adds aadditional props:\n *  - data-testid\n *  - onContentChangeVisibility\n */\nexport const AriaModal = forwardRef<HTMLDivElement, AriaModalProps>(\n  function AriaModal(\n    { children: childrenProp, onChangeContentVisibility, ...otherProps },\n    ref,\n  ): ReactElement {\n    const className = classNames([boxStyles.box, styles.modal]);\n    return (\n      <ReactAriaModal ref={ref} {...mergeProps({ className }, otherProps)}>\n        {composeRenderProps(\n          childrenProp,\n          (children, { isEntering, isExiting }) => (\n            <>\n              <OverlayVisibility\n                isEntering={isEntering}\n                isExiting={isExiting}\n                onChange={onChangeContentVisibility}\n              />\n              {children}\n            </>\n          ),\n        )}\n      </ReactAriaModal>\n    );\n  },\n);\n\ntype ModalDialogProps = DialogProps & {\n  /** Whether dialog can be dismissed with click outside / Escape key  */\n  dismissable?: boolean;\n  /** render visible initially. */\n  initialOpen?: boolean;\n  /** Optional handler for change of visibility for popover content, for analytics timing */\n  onChangeContentVisibility?: (visible: boolean) => void;\n  /** Optional handler for change of visibility for popover content, for control */\n  onOpenChange?: (open: boolean) => void;\n  /** Optional boolean to control open state of modal dialog externally */\n  open?: boolean;\n  /** Optional override for default dismiss button accessibility label */\n  accessibilityCloseLabel?: string;\n};\n\n/**\n * ModalDialog is a controlled component -- visibility is managed with the `open` prop.\n *\n * Example Usage:\n ```\n  <ModalDialog\n    open={open}\n    initialOpen\n    content={<Box>I am some content</Box>}\n    onChangeContentVisibility={(visible) => ...}\n  >\n    <Box padding={2} maxWidth={400}>\n      ... some content goes here\n    </Box>\n  </ModalDialog>\n ```\n */\nconst ModalDialog = forwardRef<HTMLDivElement, ModalDialogProps>(\n  function ModalDialog(props, ref): ReactElement {\n    const {\n      \"data-testid\": dataTestId,\n      accessibilityLabel,\n      children,\n      dismissable = true,\n      accessibilityCloseLabel = \"Dismiss\",\n      initialOpen,\n      onChangeContentVisibility,\n      onOpenChange,\n      open,\n    } = props;\n\n    return (\n      <AriaModalOverlay\n        isDismissable={dismissable}\n        isKeyboardDismissDisabled={!dismissable}\n        defaultOpen={initialOpen}\n        isOpen={open}\n        onOpenChange={onOpenChange}\n      >\n        {({ state }) => (\n          <AriaModal\n            ref={ref}\n            aria-label={accessibilityLabel}\n            onChangeContentVisibility={onChangeContentVisibility}\n          >\n            <Dialog\n              accessibilityLabel={accessibilityLabel}\n              data-testid={dataTestId}\n            >\n              <Box\n                position=\"absolute\"\n                padding={2}\n                dangerouslySetInlineStyle={{\n                  __style: {\n                    top: \"0\",\n                    right: \"0\",\n                  },\n                }}\n              >\n                <IconButton\n                  onClick={() => state.close()}\n                  color=\"tertiary\"\n                  accessibilityLabel={accessibilityCloseLabel}\n                  icon={XIcon}\n                />\n              </Box>\n              {children}\n            </Dialog>\n          </AriaModal>\n        )}\n      </AriaModalOverlay>\n    );\n  },\n);\n\nexport default ModalDialog;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Dialog/ModalDialog.module.css\"; export default {\"modalOverlay\":\"_modalOverlay_1fy5w_1\",\"modal\":\"_modal_1fy5w_1\"}"]}

package/dist/__chunks/RXQBNEFR.cjs

@@ -1,47 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
-
-
-var _UKQIAZA5cjs = require('./UKQIAZA5.cjs');
-
-// src/colors/foregroundColor.ts
-function foregroundColor(color, on) {
-  if (on === "lightBackground") {
-    switch (color) {
-      case "primary":
-      case "success-primary":
-      case "destructive-primary":
-        return _UKQIAZA5cjs.colors_module_default.cambioWhiteColor;
-      case "success-secondary":
-      case "success-tertiary":
-        return _UKQIAZA5cjs.colors_module_default.cambioSuccess700Color;
-      case "destructive-secondary":
-      case "destructive-tertiary":
-        return _UKQIAZA5cjs.colors_module_default.cambioDestructive700Color;
-      default:
-        return _UKQIAZA5cjs.colors_module_default.cambioBlackColor;
-    }
-  } else {
-    switch (color) {
-      case "primary":
-      case "success-primary":
-      case "destructive-primary":
-        return _UKQIAZA5cjs.colors_module_default.cambioBlackColor;
-      case "secondary":
-      case "tertiary":
-        return _UKQIAZA5cjs.colors_module_default.cambioWhiteColor;
-      case "success-secondary":
-      case "success-tertiary":
-        return _UKQIAZA5cjs.colors_module_default.cambioSuccess300Color;
-      case "destructive-secondary":
-      case "destructive-tertiary":
-        return _UKQIAZA5cjs.colors_module_default.cambioDestructive300Color;
-      default:
-        return _UKQIAZA5cjs.colors_module_default.cambioBlackColor;
-    }
-  }
-}
-
-
-
-exports.foregroundColor = foregroundColor;
-//# sourceMappingURL=RXQBNEFR.cjs.map

package/dist/__chunks/RXQBNEFR.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/colors/foregroundColor.ts"],"names":[],"mappings":";;;;;;AAGO,SAAS,gBACd,OACA,IACQ;AACR,MAAI,OAAO,mBAAmB;AAC5B,YAAQ,OAAO;AAAA,MACb,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB;AACE,eAAO,sBAAO;AAAA,IAClB;AAAA,EACF,OAAO;AACL,YAAQ,OAAO;AAAA,MACb,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB,KAAK;AAAA,MACL,KAAK;AACH,eAAO,sBAAO;AAAA,MAChB;AACE,eAAO,sBAAO;AAAA,IAClB;AAAA,EACF;AACF","sourcesContent":["import { type Color } from \"../constants\";\nimport styles from \"./colors.module.css\";\n\nexport function foregroundColor(\n  color: (typeof Color)[number],\n  on: \"lightBackground\" | \"darkBackground\",\n): string {\n  if (on === \"lightBackground\") {\n    switch (color) {\n      case \"primary\":\n      case \"success-primary\":\n      case \"destructive-primary\":\n        return styles.cambioWhiteColor;\n      case \"success-secondary\":\n      case \"success-tertiary\":\n        return styles.cambioSuccess700Color;\n      case \"destructive-secondary\":\n      case \"destructive-tertiary\":\n        return styles.cambioDestructive700Color;\n      default:\n        return styles.cambioBlackColor;\n    }\n  } else {\n    switch (color) {\n      case \"primary\":\n      case \"success-primary\":\n      case \"destructive-primary\":\n        return styles.cambioBlackColor;\n      case \"secondary\":\n      case \"tertiary\":\n        return styles.cambioWhiteColor;\n      case \"success-secondary\":\n      case \"success-tertiary\":\n        return styles.cambioSuccess300Color;\n      case \"destructive-secondary\":\n      case \"destructive-tertiary\":\n        return styles.cambioDestructive300Color;\n      default: // branded\n        return styles.cambioBlackColor;\n    }\n  }\n}\n"]}

package/dist/__chunks/RYUXG4AS.cjs

@@ -1,53 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
-
-
-var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
-
-// src/RichSelect/RichSelectItem.tsx
-
-
-
-
-
-var _react = require('react');
-
-
-var _reactariacomponents = require('react-aria-components');
-
-// css-module:./RichSelect.module.css#css-module
-var RichSelect_module_default = { "richSelectItem": "_richSelectItem_dvxf4_1", "richSelectBox": "_richSelectBox_dvxf4_2", "label": "_label_dvxf4_6" };
-
-// src/RichSelect/RichSelectItem.tsx
-var _jsxruntime = require('react/jsx-runtime');
-var RichSelectItemContext = _react.createContext.call(void 0, {});
-var RichSelectItem_default = _react.forwardRef.call(void 0, function RichSelectItem(props, ref) {
-  const {
-    "data-testid": dataTestId,
-    value,
-    label,
-    disabled: disabledProp = false,
-    children
-  } = props;
-  const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
-  const disabled = !isHydrated || disabledProp;
-  const { disableKey } = _react.useContext.call(void 0, RichSelectItemContext);
-  _react.useEffect.call(void 0, () => disableKey == null ? void 0 : disableKey(value, disabled), [disableKey, disabled, value]);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _reactariacomponents.ListBoxItem,
-    {
-      id: value,
-      textValue: label,
-      className: RichSelect_module_default.richSelectItem,
-      "data-testid": dataTestId,
-      ref,
-      children
-    }
-  );
-});
-
-
-
-
-
-exports.RichSelect_module_default = RichSelect_module_default; exports.RichSelectItemContext = RichSelectItemContext; exports.RichSelectItem_default = RichSelectItem_default;
-//# sourceMappingURL=RYUXG4AS.cjs.map

package/dist/__chunks/RYUXG4AS.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/RichSelect/RichSelectItem.tsx","css-module:./RichSelect.module.css#css-module"],"names":[],"mappings":";;;;;;AAAA;AAAA,EACE;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE,eAAe;AAAA,OAEV;;;ACV6F,IAAO,4BAAQ,EAAC,kBAAiB,2BAA0B,iBAAgB,0BAAyB,SAAQ,iBAAgB;;;ADkD5N;AA3BG,IAAM,wBAAwB,cAElC,CAAC,CAAC;AAEL,IAAO,yBAAQ,WASb,SAAS,eAAe,OAAO,KAAmB;AAClD,QAAM;AAAA,IACJ,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA,UAAU,eAAe;AAAA,IACzB;AAAA,EACF,IAAI;AACJ,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAEhC,QAAM,EAAE,WAAW,IAAI,WAAW,qBAAqB;AACvD,YAAU,MAAM,yCAAa,OAAO,WAAW,CAAC,YAAY,UAAU,KAAK,CAAC;AAC5E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,WAAW;AAAA,MACX,WAAW,0BAAO;AAAA,MAClB,eAAa;AAAA,MACb;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ,CAAC","sourcesContent":["import React, {\n  forwardRef,\n  type ReactElement,\n  createContext,\n  useEffect,\n  useContext,\n} from \"react\";\nimport {\n  ListBoxItem as ReactAriaListBoxItem,\n  type ListBoxItemRenderProps,\n} from \"react-aria-components\";\nimport styles from \"./RichSelect.module.css\";\nimport { type Key } from \"react-aria\";\nimport useIsHydrated from \"../useIsHydrated\";\n\nexport type RichSelectItemProps = {\n  \"data-testid\"?: string;\n  value: string;\n  label: string;\n  name?: string;\n  disabled?: boolean;\n};\n\nexport const RichSelectItemContext = createContext<{\n  disableKey?: (key: Key, value: boolean) => void;\n}>({});\n\nexport default forwardRef<\n  HTMLDivElement,\n  RichSelectItemProps & {\n    /** The children of the component. A function may be provided to alter the children based on component state. */\n    children?:\n      | string\n      | ReactElement\n      | ((values: ListBoxItemRenderProps) => ReactElement);\n  }\n>(function RichSelectItem(props, ref): ReactElement {\n  const {\n    \"data-testid\": dataTestId,\n    value,\n    label,\n    disabled: disabledProp = false,\n    children,\n  } = props;\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\n\n  const { disableKey } = useContext(RichSelectItemContext);\n  useEffect(() => disableKey?.(value, disabled), [disableKey, disabled, value]);\n  return (\n    <ReactAriaListBoxItem\n      id={value}\n      textValue={label}\n      className={styles.richSelectItem}\n      data-testid={dataTestId}\n      ref={ref}\n    >\n      {children}\n    </ReactAriaListBoxItem>\n  );\n});\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/RichSelect/RichSelect.module.css\"; export default {\"richSelectItem\":\"_richSelectItem_dvxf4_1\",\"richSelectBox\":\"_richSelectBox_dvxf4_2\",\"label\":\"_label_dvxf4_6\"}"]}

package/dist/__chunks/RZSHTFXZ.cjs

@@ -1,289 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
-
-
-var _IJHKE2Y3cjs = require('./IJHKE2Y3.cjs');
-
-
-var _OKT24L6Dcjs = require('./OKT24L6D.cjs');
-
-
-
-
-var _7VI7DO7Pcjs = require('./7VI7DO7P.cjs');
-
-
-
-
-var _AFOQ6JVBcjs = require('./AFOQ6JVB.cjs');
-
-
-var _VDLYCYDQcjs = require('./VDLYCYDQ.cjs');
-
-
-var _WKADTHRKcjs = require('./WKADTHRK.cjs');
-
-
-var _J2QDHB6Icjs = require('./J2QDHB6I.cjs');
-
-
-var _3UEOKPM2cjs = require('./3UEOKPM2.cjs');
-
-
-var _QODNNCT2cjs = require('./QODNNCT2.cjs');
-
-
-var _4TYOP5XMcjs = require('./4TYOP5XM.cjs');
-
-
-var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
-
-
-
-
-var _X2SDR4SDcjs = require('./X2SDR4SD.cjs');
-
-// src/RichSelect/RichSelectList.tsx
-
-
-
-
-var _react = require('react');
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
-
-
-
-var _reactariacomponents = require('react-aria-components');
-var _utils = require('@react-stately/utils');
-var _interactions = require('@react-aria/interactions');
-
-// css-module:../SelectList/SelectList.module.css#css-module
-var SelectList_module_default = { "selectContainer": "_selectContainer_p5tv4_1", "opacityOverlay": "_opacityOverlay_p5tv4_7", "selectWrapper": "_selectWrapper_p5tv4_11", "selectBox": "_selectBox_p5tv4_16", "selectBoxCambio": "_selectBoxCambio_p5tv4_30", "selectMouseFocusStyling": "_selectMouseFocusStyling_p5tv4_38", "unselected": "_unselected_p5tv4_43", "selected": "_selected_p5tv4_47", "darkBackground": "_darkBackground_p5tv4_51", "arrowIcon": "_arrowIcon_p5tv4_63", "selectErrorCambio": "_selectErrorCambio_p5tv4_77", "selectColorwhite": "_selectColorwhite_p5tv4_83", "transparentInputError": "_transparentInputError_p5tv4_89", "transparenInputError": "_transparenInputError_p5tv4_94" };
-
-// src/RichSelect/RichSelectList.tsx
-var _reactaria = require('react-aria');
-var _jsxruntime = require('react/jsx-runtime');
-var NOOP = () => void 0;
-function RichSelectList(props) {
-  const _a = props, {
-    autosave,
-    children,
-    "data-testid": dataTestId,
-    disabled: disabledProp = false,
-    errorText,
-    helperText,
-    label,
-    id,
-    onChange,
-    onClick = NOOP,
-    placeholderText,
-    selectTextValue,
-    selectedValues: selectedValuesProp,
-    defaultSelectedValues: defaultSelectedValuesProp,
-    color = "white"
-  } = _a, richSelectBoxProps = _X2SDR4SDcjs.__objRest.call(void 0, _a, [
-    "autosave",
-    "children",
-    "data-testid",
-    "disabled",
-    "errorText",
-    "helperText",
-    "label",
-    "id",
-    "onChange",
-    "onClick",
-    "placeholderText",
-    "selectTextValue",
-    "selectedValues",
-    "defaultSelectedValues",
-    "color"
-  ]);
-  const reactId = _react.useId.call(void 0, );
-  const inputId = id != null ? id : reactId;
-  const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
-  const disabled = !isHydrated || disabledProp;
-  const overlayHandlerRef = _react.useRef.call(void 0, {});
-  const selectedKeysProp = _react.useMemo.call(void 0, 
-    () => _AFOQ6JVBcjs.convertSelection.call(void 0, selectedValuesProp),
-    [selectedValuesProp]
-  );
-  const defaultSelectedKeys = _react.useMemo.call(void 0, 
-    () => _AFOQ6JVBcjs.convertSelection.call(void 0, defaultSelectedValuesProp, /* @__PURE__ */ new Set()),
-    [defaultSelectedValuesProp]
-  );
-  const [selectedKeys, setSelectedKeys] = _utils.useControlledState.call(void 0, 
-    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
-    defaultSelectedKeys,
-    (value) => {
-      var _a2, _b;
-      const _value = value === "all" ? "all" : [...value].map(String);
-      onChange(_value);
-      if (!autosave)
-        (_b = (_a2 = overlayHandlerRef.current).close) == null ? void 0 : _b.call(_a2);
-    }
-  );
-  const selectedTextValue = _react.useMemo.call(void 0, () => {
-    var _a2;
-    if (selectTextValue)
-      return (_a2 = selectTextValue(
-        selectedKeys === "all" ? "all" : [...selectedKeys].map(String)
-      )) != null ? _a2 : placeholderText;
-    if (selectedKeys === "all")
-      return "All selected";
-    if (selectedKeys.size)
-      return `${selectedKeys.size} selected`;
-    return placeholderText;
-  }, [selectTextValue, selectedKeys, placeholderText]);
-  const fieldRef = _react.useRef.call(void 0, null);
-  const { labelProps, fieldProps, descriptionProps, errorMessageProps } = _reactaria.useField.call(void 0, {
-    label,
-    // this is the label for the select box
-    description: helperText,
-    errorMessage: errorText
-  });
-  const textColor = {
-    white: "gray700",
-    clear: "white"
-  };
-  const getArrowIconColor = () => {
-    if (errorText) {
-      return _7VI7DO7Pcjs.ColorBaseDestructive700;
-    } else {
-      if (color === "clear") {
-        return _7VI7DO7Pcjs.ColorCambioWhite100;
-      } else {
-        return _7VI7DO7Pcjs.ColorBaseGray700;
-      }
-    }
-  };
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _reactariacomponents.Provider,
-    {
-      values: [
-        [_AFOQ6JVBcjs.RichSelectBoxContext, { autoFocus: true }],
-        [_OKT24L6Dcjs.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, 
-        "div",
-        {
-          className: _classnames2.default.call(void 0, SelectList_module_default.selectContainer, {
-            [SelectList_module_default.opacityOverlay]: disabled
-          }),
-          onClick,
-          children: [
-            label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _reactariacomponents.Label,
-              _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
-                "data-testid": [dataTestId, "label"].filter(Boolean).join("-")
-              }, labelProps), {
-                onClick: () => {
-                  var _a2;
-                  if (disabled)
-                    return;
-                  (_a2 = fieldRef.current) == null ? void 0 : _a2.focus();
-                  _interactions.setInteractionModality.call(void 0, "keyboard");
-                },
-                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _4TYOP5XMcjs.Typography_default, { size: 100, color: textColor[color], children: label }) })
-              })
-            ) }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _IJHKE2Y3cjs.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, 
-                    _QODNNCT2cjs.Box_default,
-                    {
-                      padding: autosave ? void 0 : 5,
-                      dangerouslySetInlineStyle: autosave ? void 0 : { __style: { paddingBottom: 0 } },
-                      role: "menu",
-                      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        _AFOQ6JVBcjs.RichSelectBox_default,
-                        _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
-                          autosave,
-                          selectedValues: selectedKeys,
-                          defaultSelectedValues: defaultSelectedKeys,
-                          onChange: (selected) => setSelectedKeys(new Set(selected))
-                        }, richSelectBoxProps), {
-                          accessibilityLabel: inputId,
-                          children
-                        })
-                      )
-                    }
-                  )
-                ),
-                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                  _3UEOKPM2cjs.TapArea_default,
-                  _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
-                    "data-testid": dataTestId,
-                    disabled,
-                    onClick,
-                    rounding: "md"
-                  }, fieldProps), {
-                    ref: fieldRef,
-                    children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: SelectList_module_default.selectWrapper, children: [
-                      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        "div",
-                        {
-                          className: _classnames2.default.call(void 0, 
-                            SelectList_module_default.selectBox,
-                            SelectList_module_default.selectBoxCambio,
-                            {
-                              [SelectList_module_default.unselected]: !errorText && selectedKeys !== "all" && !selectedKeys.size,
-                              [SelectList_module_default.selected]: !errorText && (selectedKeys === "all" || selectedKeys.size),
-                              [SelectList_module_default.selectErrorCambio]: errorText,
-                              [SelectList_module_default[`selectColor${color}`]]: color
-                            }
-                          ),
-                          children: selectedTextValue
-                        }
-                      ),
-                      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: SelectList_module_default.arrowIcon, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        "svg",
-                        {
-                          focusable: "false",
-                          "aria-hidden": "true",
-                          viewBox: "0 0 24 24",
-                          width: 24,
-                          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                            "path",
-                            {
-                              fill: getArrowIconColor(),
-                              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"
-                            }
-                          )
-                        }
-                      ) })
-                    ] })
-                  })
-                )
-              }
-            ),
-            (helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QODNNCT2cjs.Box_default, { paddingX: 1, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _4TYOP5XMcjs.Typography_default,
-              _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
-                size: 100,
-                color: errorText ? "destructive-primary" : textColor[color]
-              }, errorText ? errorMessageProps : descriptionProps), {
-                children: errorText ? errorText : helperText
-              })
-            ) })
-          ]
-        }
-      )
-    }
-  );
-}
-var RichSelectList_default = Object.assign(RichSelectList, {
-  Section: _VDLYCYDQcjs.RichSelectSection_default,
-  Chip: _J2QDHB6Icjs.RichSelectChip_default,
-  RadioButton: _WKADTHRKcjs.RichSelectRadioButton_default
-});
-
-
-
-exports.RichSelectList_default = RichSelectList_default;
-//# sourceMappingURL=RZSHTFXZ.cjs.map

package/dist/__chunks/RZSHTFXZ.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/RichSelect/RichSelectList.tsx","css-module:../SelectList/SelectList.module.css#css-module"],"names":["_a"],"mappings":"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","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  ColorBaseGray700,\n  ColorCambioWhite100,\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\";\n\nconst NOOP = () => undefined;\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   * Color of the select box\n   * @defaultValue white\n   */\n  color?: \"white\" | \"clear\";\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    color = \"white\",\n    ...richSelectBoxProps\n  } = props;\n\n  const reactId = useId();\n  const inputId = id ?? reactId;\n  const isHydrated = useIsHydrated();\n  const disabled = !isHydrated || disabledProp;\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  const textColor = {\n    white: \"gray700\",\n    clear: \"white\",\n  } as const;\n\n  const getArrowIconColor = () => {\n    if (errorText) {\n      return ColorBaseDestructive700;\n    } else {\n      if (color === \"clear\") {\n        return ColorCambioWhite100;\n      } else {\n        return ColorBaseGray700;\n      }\n    }\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        })}\n        onClick={onClick}\n      >\n        {label && (\n          <>\n            <ReactAriaLabel\n              data-testid={[dataTestId, \"label\"].filter(Boolean).join(\"-\")}\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={1}>\n                <Typography size={100} color={textColor[color]}>\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              role=\"menu\"\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=\"md\"\n            {...fieldProps}\n            ref={fieldRef}\n          >\n            <div className={styles.selectWrapper}>\n              <div\n                className={classNames(\n                  styles.selectBox,\n                  styles.selectBoxCambio,\n                  {\n                    [styles.unselected]:\n                      !errorText &&\n                      selectedKeys !== \"all\" &&\n                      !selectedKeys.size,\n                    [styles.selected]:\n                      !errorText &&\n                      (selectedKeys === \"all\" || selectedKeys.size),\n                    [styles.selectErrorCambio]: errorText,\n                    [styles[`selectColor${color}`]]: color,\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={24}\n                >\n                  <path\n                    fill={getArrowIconColor()}\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={1}>\n            <Typography\n              size={100}\n              color={errorText ? \"destructive-primary\" : textColor[color]}\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_p5tv4_1\",\"opacityOverlay\":\"_opacityOverlay_p5tv4_7\",\"selectWrapper\":\"_selectWrapper_p5tv4_11\",\"selectBox\":\"_selectBox_p5tv4_16\",\"selectBoxCambio\":\"_selectBoxCambio_p5tv4_30\",\"selectMouseFocusStyling\":\"_selectMouseFocusStyling_p5tv4_38\",\"unselected\":\"_unselected_p5tv4_43\",\"selected\":\"_selected_p5tv4_47\",\"darkBackground\":\"_darkBackground_p5tv4_51\",\"arrowIcon\":\"_arrowIcon_p5tv4_63\",\"selectErrorCambio\":\"_selectErrorCambio_p5tv4_77\",\"selectColorwhite\":\"_selectColorwhite_p5tv4_83\",\"transparentInputError\":\"_transparentInputError_p5tv4_89\",\"transparenInputError\":\"_transparenInputError_p5tv4_94\"}"]}

package/dist/__chunks/TH4TA3JN.cjs

@@ -1,9 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client"
-
-// css-module:../Button/Button.module.css#css-module
-var Button_module_default = { "button": "_button_v2jgj_1", "buttonGap": "_buttonGap_v2jgj_8", "disabled": "_disabled_v2jgj_42", "disabledPrimary": "_disabledPrimary_v2jgj_57", "fullWidth": "_fullWidth_v2jgj_61", "sm": "_sm_v2jgj_65", "md": "_md_v2jgj_72", "lg": "_lg_v2jgj_79", "icon": "_icon_v2jgj_86", "smIcon": "_smIcon_v2jgj_90", "mdIcon": "_mdIcon_v2jgj_97", "lgIcon": "_lgIcon_v2jgj_104", "loading": "_loading_v2jgj_121", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_v2jgj_1", "loadingCircle": "_loadingCircle_v2jgj_125" };
-
-
-
-exports.Button_module_default = Button_module_default;
-//# sourceMappingURL=TH4TA3JN.cjs.map

package/dist/__chunks/TH4TA3JN.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["css-module:../Button/Button.module.css#css-module"],"names":[],"mappings":";;;AAA4F,IAAO,wBAAQ,EAAC,UAAS,mBAAkB,aAAY,sBAAqB,YAAW,sBAAqB,mBAAkB,6BAA4B,aAAY,uBAAsB,MAAK,gBAAe,MAAK,gBAAe,MAAK,gBAAe,QAAO,kBAAiB,UAAS,oBAAmB,UAAS,oBAAmB,UAAS,qBAAoB,WAAU,sBAAqB,6BAA4B,sCAAqC,iBAAgB,2BAA0B","sourcesContent":["import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Button/Button.module.css\"; export default {\"button\":\"_button_v2jgj_1\",\"buttonGap\":\"_buttonGap_v2jgj_8\",\"disabled\":\"_disabled_v2jgj_42\",\"disabledPrimary\":\"_disabledPrimary_v2jgj_57\",\"fullWidth\":\"_fullWidth_v2jgj_61\",\"sm\":\"_sm_v2jgj_65\",\"md\":\"_md_v2jgj_72\",\"lg\":\"_lg_v2jgj_79\",\"icon\":\"_icon_v2jgj_86\",\"smIcon\":\"_smIcon_v2jgj_90\",\"mdIcon\":\"_mdIcon_v2jgj_97\",\"lgIcon\":\"_lgIcon_v2jgj_104\",\"loading\":\"_loading_v2jgj_121\",\"syntaxButtonLoadingRotate\":\"_syntaxButtonLoadingRotate_v2jgj_1\",\"loadingCircle\":\"_loadingCircle_v2jgj_125\"}"]}