@cambly/syntax-core 3.2.0 → 4.0.0

package/dist/index.js

@@ -397,17 +397,6 @@ function foregroundColor(color) {
   }
 }
 
-// src/Button/Button.tsx
-var import_react2 = require("react");
-
-// src/ButtonGroup/ButtonGroupContext.tsx
-var import_react = __toESM(require("react"));
-var ButtonGroupContext = import_react.default.createContext(
-  {}
-);
-ButtonGroupContext.displayName = "ButtonGroupContext";
-var ButtonGroupContext_default = ButtonGroupContext;
-
 // css-module:./Button.module.css#css-module
 var Button_module_default = { "button": "_button_13egy_1", "buttonGap": "_buttonGap_13egy_9", "fullWidth": "_fullWidth_13egy_50", "sm": "_sm_13egy_54", "md": "_md_13egy_61", "lg": "_lg_13egy_68", "icon": "_icon_13egy_75", "smIcon": "_smIcon_13egy_79", "mdIcon": "_mdIcon_13egy_86", "lgIcon": "_lgIcon_13egy_93", "textContainer": "_textContainer_13egy_100", "secondaryBorder": "_secondaryBorder_13egy_105", "secondaryDestructiveBorder": "_secondaryDestructiveBorder_13egy_109", "loading": "_loading_13egy_123", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_13egy_1", "loadingCircle": "_loadingCircle_13egy_127", "buttonText": "_buttonText_13egy_135", "buttonTextSmall": "_buttonTextSmall_13egy_142", "buttonTextMedium": "_buttonTextMedium_13egy_146", "buttonTextLarge": "_buttonTextLarge_13egy_150" };
 
@@ -433,20 +422,16 @@ var Button = ({
   text,
   loadingText,
   color = "primary",
-  size: sizeProp = "md",
+  size = "md",
   accessibilityLabel,
-  disabled: disabledProp = false,
+  disabled = false,
   loading = false,
-  fullWidth: fullWidthProp = false,
+  fullWidth = false,
   startIcon: StartIcon,
   endIcon: EndIcon,
   onClick,
   tooltip
 }) => {
-  const contextProps = (0, import_react2.useContext)(ButtonGroupContext_default);
-  const size = (contextProps == null ? void 0 : contextProps.size) || sizeProp;
-  const disabled = (contextProps == null ? void 0 : contextProps.disabled) || disabledProp;
-  const fullWidth = (contextProps == null ? void 0 : contextProps.fullWidth) || fullWidthProp;
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
     "button",
     {
@@ -497,11 +482,8 @@ var Button = ({
 };
 var Button_default = Button;
 
-// src/ButtonGroup/ButtonGroup.tsx
-var import_react3 = require("react");
-
 // css-module:./ButtonGroup.module.css#css-module
-var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_184aa_1", "horizontal": "_horizontal_184aa_6", "vertical": "_vertical_184aa_10", "smallGap": "_smallGap_184aa_14", "mediumGap": "_mediumGap_184aa_18", "largeGap": "_largeGap_184aa_22" };
+var ButtonGroup_module_default = { "buttonGroup": "_buttonGroup_1f9x9_1", "horizontal": "_horizontal_1f9x9_5", "vertical": "_vertical_1f9x9_9", "smallGap": "_smallGap_1f9x9_13", "mediumGap": "_mediumGap_1f9x9_17", "largeGap": "_largeGap_1f9x9_21" };
 
 // src/ButtonGroup/ButtonGroup.tsx
 var import_classnames4 = __toESM(require_classnames());
@@ -512,21 +494,15 @@ var gap = {
   ["lg"]: ButtonGroup_module_default.largeGap
 };
 var ButtonGroup = ({
-  disabled = false,
-  fullWidth = false,
   orientation = "horizontal",
   size = "md",
   children
 }) => {
-  const context = (0, import_react3.useMemo)(
-    () => ({ disabled, fullWidth, size }),
-    [disabled, fullWidth, size]
-  );
   const classnames2 = (0, import_classnames4.default)(ButtonGroup_module_default.buttonGroup, gap[size], {
     [ButtonGroup_module_default.horizontal]: orientation === "horizontal",
     [ButtonGroup_module_default.vertical]: orientation === "vertical"
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ButtonGroupContext_default.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: classnames2, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: classnames2, children });
 };
 var ButtonGroup_default = ButtonGroup;
 
@@ -545,7 +521,7 @@ var Divider_module_default = { "divider": "_divider_1ddgq_1" };
 
 // src/Divider/Divider.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
-function Divider({}) {
+function Divider() {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("hr", { className: Divider_module_default.divider });
 }
 Divider.displayName = "Divider";
@@ -623,7 +599,6 @@ var Heading_default = Heading;
 
 // src/IconButton/IconButton.tsx
 var import_classnames6 = __toESM(require_classnames());
-var import_react4 = require("react");
 
 // css-module:./IconButton.module.css#css-module
 var IconButton_module_default = { "iconButton": "_iconButton_dzhn0_1", "sm": "_sm_dzhn0_46", "md": "_md_dzhn0_51", "lg": "_lg_dzhn0_56", "smIcon": "_smIcon_dzhn0_61", "mdIcon": "_mdIcon_dzhn0_68", "lgIcon": "_lgIcon_dzhn0_75" };
@@ -638,15 +613,12 @@ var iconSize2 = {
 var IconButton = ({
   accessibilityLabel,
   color = "primary",
-  disabled: disabledProp = false,
+  disabled = false,
   icon: Icon,
-  size: sizeProp = "md",
+  size = "md",
   tooltip,
   onClick
 }) => {
-  const contextProps = (0, import_react4.useContext)(ButtonGroupContext_default);
-  const size = (contextProps == null ? void 0 : contextProps.size) || sizeProp;
-  const disabled = (contextProps == null ? void 0 : contextProps.disabled) || disabledProp;
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     "button",
     {
@@ -668,7 +640,7 @@ var IconButton = ({
 var IconButton_default = IconButton;
 
 // src/Checkbox/Checkbox.tsx
-var import_react5 = require("react");
+var import_react = require("react");
 var import_classnames7 = __toESM(require_classnames());
 
 // css-module:./Checkbox.module.css#css-module
@@ -692,7 +664,7 @@ var Checkbox = ({
   error = false,
   onChange
 }) => {
-  const [isFocused, setIsFocused] = (0, import_react5.useState)(false);
+  const [isFocused, setIsFocused] = (0, import_react.useState)(false);
   const checkboxStyling = (0, import_classnames7.default)(Checkbox_module_default.checkbox, Checkbox_module_default[size]);
   const uncheckedStyling = (0, import_classnames7.default)(checkboxStyling, Checkbox_module_default.uncheckedBox, {
     [Checkbox_module_default.uncheckedBorder]: !error,
@@ -753,14 +725,14 @@ var MiniActionCard = ({
 var MiniActionCard_default = MiniActionCard;
 
 // src/RadioButton/RadioButton.tsx
-var import_react7 = require("react");
+var import_react3 = require("react");
 var import_classnames8 = __toESM(require_classnames());
 
 // css-module:./RadioButton.module.css#css-module
 var RadioButton_module_default = { "radioBaseContainer": "_radioBaseContainer_x6och_1", "smBase": "_smBase_x6och_8", "mdBase": "_mdBase_x6och_13", "radioStyleOverride": "_radioStyleOverride_x6och_18", "smOverride": "_smOverride_x6och_23", "mdOverride": "_mdOverride_x6och_28", "background": "_background_x6och_33", "sm": "_sm_x6och_8", "md": "_md_x6och_13", "neutralBorder": "_neutralBorder_x6och_50", "smCheckedBorder": "_smCheckedBorder_x6och_54", "mdCheckedBorder": "_mdCheckedBorder_x6och_58", "errorBorderColor": "_errorBorderColor_x6och_62", "borderColor": "_borderColor_x6och_66", "focusedRadioButton": "_focusedRadioButton_x6och_70" };
 
 // src/useFocusVisible.tsx
-var import_react6 = require("react");
+var import_react2 = require("react");
 var hasSetupGlobalListeners = false;
 var currentModality = null;
 var changeHandlers = /* @__PURE__ */ new Set();
@@ -830,8 +802,8 @@ function setupGlobalFocusEvents() {
 }
 function useFocusVisible() {
   setupGlobalFocusEvents();
-  const [isFocusVisibleState, setFocusVisible] = (0, import_react6.useState)(isFocusVisible());
-  (0, import_react6.useEffect)(() => {
+  const [isFocusVisibleState, setFocusVisible] = (0, import_react2.useState)(isFocusVisible());
+  (0, import_react2.useEffect)(() => {
     const handler = () => {
       setFocusVisible(isFocusVisible());
     };
@@ -855,7 +827,7 @@ var RadioButton = ({
   size = "md",
   value
 }) => {
-  const [isFocused, setIsFocused] = (0, import_react7.useState)(false);
+  const [isFocused, setIsFocused] = (0, import_react3.useState)(false);
   const { isFocusVisible: isFocusVisible2 } = useFocusVisible();
   const sharedStyles = (0, import_classnames8.default)(RadioButton_module_default.background, RadioButton_module_default[size], {
     [RadioButton_module_default.errorBorderColor]: error,
@@ -915,7 +887,7 @@ var RadioButton = ({
 var RadioButton_default = RadioButton;
 
 // src/SelectList/SelectList.tsx
-var import_react8 = require("react");
+var import_react4 = require("react");
 var import_classnames9 = __toESM(require_classnames());
 
 // ../syntax-design-tokens/dist/js/index.js
@@ -960,7 +932,7 @@ var SelectList = ({
   selectedValue = "",
   size = "md"
 }) => {
-  const id = (0, import_react8.useId)();
+  const id = (0, import_react4.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
     "div",
     {