@cambly/syntax-core 21.17.0 → 22.0.0

package/dist/index.js

@@ -38,12 +38,12 @@ import {
 } from "./__chunks/STLN5GZL.js";
 import {
   SelectList
-} from "./__chunks/RPXD7HFU.js";
+} from "./__chunks/6MC2JC5D.js";
 import "./__chunks/SPQ7DQHG.js";
 import {
   RichSelectList_default
-} from "./__chunks/YOTIKAZ4.js";
-import "./__chunks/X42H56XS.js";
+} from "./__chunks/NAKEUWBD.js";
+import "./__chunks/R6OBV53M.js";
 import {
   ButtonGroup_default
 } from "./__chunks/36DG472B.js";
@@ -63,7 +63,7 @@ import {
   IconButton_default
 } from "./__chunks/KEJPRZJ5.js";
 import "./__chunks/4U4UW4AK.js";
-import "./__chunks/LQQTJIBH.js";
+import "./__chunks/LEHKWTCB.js";
 import "./__chunks/Y53Z25OG.js";
 import "./__chunks/DDUJFFG7.js";
 import "./__chunks/N7G37EKF.js";
@@ -71,10 +71,10 @@ import {
   RadioButton_default
 } from "./__chunks/GBIA6TDE.js";
 import "./__chunks/KKADUD65.js";
-import "./__chunks/XTV66LZO.js";
+import "./__chunks/LUK43ZOB.js";
 import {
   Chip_default
-} from "./__chunks/EBR6W2V2.js";
+} from "./__chunks/B5PWI2NT.js";
 import "./__chunks/Z5ZUAP2B.js";
 import "./__chunks/6TM2ES2T.js";
 import "./__chunks/ODMJANSX.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cambly/syntax-core",
   "description": "Cambly design system core components",
-  "version": "21.17.0",
+  "version": "22.0.0",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -27,8 +27,8 @@
     "react": "18.2.0",
     "tsup": "6.7.0",
     "typescript": "5.0.4",
-    "@cambly/eslint-config-syntax": "1.4.1",
-    "@cambly/syntax-tsconfig": "1.4.2"
+    "@cambly/syntax-tsconfig": "1.4.2",
+    "@cambly/eslint-config-syntax": "1.4.1"
   },
   "publishConfig": {
     "access": "public"

package/dist/__chunks/EBR6W2V2.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Chip/Chip.tsx","css-module:./Chip.module.css#css-module"],"sourcesContent":["import React, { forwardRef, useMemo, type ComponentProps } 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 type InternalIcon from \"../Icon/Icon\";\nimport { type Size } from \"../constants\";\nimport textVariant from \"../Button/constants/textVariant\";\nimport {\n  internalIconSize,\n  materialIconSize,\n} from \"../Button/constants/iconSize\";\n\nfunction typographyColor({\n  selected,\n  on,\n}: {\n  selected: boolean;\n  on: \"lightBackground\" | \"darkBackground\";\n}): \"white\" | \"gray900\" {\n  if (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   * The size of the chip\n   *\n   * * `sm`: 32px height\n   * * `md`: 48px height\n   *\n   * @defaultValue \"sm\"\n   */\n  size?: (typeof Size)[number];\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\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?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\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      size = \"sm\",\n      \"data-testid\": dataTestId,\n      text,\n      on = \"lightBackground\",\n      onChange,\n      icon: Icon,\n      dangerouslyForceFocusStyles,\n    }: ChipProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n    const disabled = !isHydrated || disabledProp;\n\n    const selectedChipStyle =\n      on === \"lightBackground\"\n        ? styles.selectedChip\n        : styles.selectedChipOnDarkBackground;\n\n    const deselectedChipStyle =\n      on === \"lightBackground\"\n        ? styles.deselectedChip\n        : styles.deselectedChipOnDarkBackground;\n\n    const chipStyles = classnames(styles.chip, styles.sm, {\n      [selectedChipStyle]: selected,\n      [deselectedChipStyle]: !selected,\n      [styles.disabled]: disabled,\n      [styles.forceFocus]: dangerouslyForceFocusStyles,\n    });\n    const iconStyles = classnames(styles.icon, {\n      [styles.selectedIcon]: selected,\n    });\n\n    const color = useMemo(\n      () => typographyColor({ selected, on }),\n      [selected, on],\n    );\n\n    return (\n      <button\n        className={classnames(chipStyles, styles[size])}\n        disabled={disabled}\n        data-testid={dataTestId}\n        ref={ref}\n        type=\"button\"\n        aria-pressed={selected}\n        onClick={onChange}\n      >\n        {Icon && (\n          <Icon\n            className={classnames(iconStyles, materialIconSize[size])}\n            color={color}\n            size={internalIconSize[size]}\n          />\n        )}\n        <Box paddingX={Icon ? 1 : 0}>\n          <Typography size={textVariant[size]} color={color} weight=\"medium\">\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_1lns9_1\",\"disabled\":\"_disabled_1lns9_12\",\"deselectedChip\":\"_deselectedChip_1lns9_17\",\"deselectedChipOnDarkBackground\":\"_deselectedChipOnDarkBackground_1lns9_21\",\"selectedChip\":\"_selectedChip_1lns9_25\",\"selectedChipOnDarkBackground\":\"_selectedChipOnDarkBackground_1lns9_29\",\"icon\":\"_icon_1lns9_33\",\"selectedIcon\":\"_selectedIcon_1lns9_40\",\"sm\":\"_sm_1lns9_44\",\"md\":\"_md_1lns9_50\",\"forceFocus\":\"_forceFocus_1lns9_57\"}"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,SAAgB,YAAY,eAAoC;AAChE,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,QAAO,iBAAgB,YAAW,sBAAqB,kBAAiB,4BAA2B,kCAAiC,4CAA2C,gBAAe,0BAAyB,gCAA+B,0CAAyC,QAAO,kBAAiB,gBAAe,0BAAyB,MAAK,gBAAe,MAAK,gBAAe,cAAa,uBAAsB;;;ADoI5gB,SAUI,KAVJ;AAtHN,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AACF,GAGwB;AACtB,MAAI,OAAO,kBAAkB;AAC3B,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;AAsDA,IAAM,OAAO;AAAA,EACX,CACE;AAAA,IACE,UAAU,eAAe;AAAA,IACzB,WAAW;AAAA,IACX,OAAO;AAAA,IACP,eAAe;AAAA,IACf;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA,MAAM;AAAA,IACN;AAAA,EACF,GACA,QACG;AACH,UAAM,aAAa,cAAc;AACjC,UAAM,WAAW,CAAC,cAAc;AAEhC,UAAM,oBACJ,OAAO,oBACH,oBAAO,eACP,oBAAO;AAEb,UAAM,sBACJ,OAAO,oBACH,oBAAO,iBACP,oBAAO;AAEb,UAAM,aAAa,WAAW,oBAAO,MAAM,oBAAO,IAAI;AAAA,MACpD,CAAC,iBAAiB,GAAG;AAAA,MACrB,CAAC,mBAAmB,GAAG,CAAC;AAAA,MACxB,CAAC,oBAAO,QAAQ,GAAG;AAAA,MACnB,CAAC,oBAAO,UAAU,GAAG;AAAA,IACvB,CAAC;AACD,UAAM,aAAa,WAAW,oBAAO,MAAM;AAAA,MACzC,CAAC,oBAAO,YAAY,GAAG;AAAA,IACzB,CAAC;AAED,UAAM,QAAQ;AAAA,MACZ,MAAM,gBAAgB,EAAE,UAAU,GAAG,CAAC;AAAA,MACtC,CAAC,UAAU,EAAE;AAAA,IACf;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,WAAW,YAAY,oBAAO,IAAI,CAAC;AAAA,QAC9C;AAAA,QACA,eAAa;AAAA,QACb;AAAA,QACA,MAAK;AAAA,QACL,gBAAc;AAAA,QACd,SAAS;AAAA,QAER;AAAA,kBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,YAAY,iBAAiB,IAAI,CAAC;AAAA,cACxD;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAEF,oBAAC,eAAI,UAAU,OAAO,IAAI,GACxB,8BAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,OAAc,QAAO,UACvD,gBACH,GACF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;AAEnB,IAAO,eAAQ;","names":[]}