@cambly/syntax-core 6.7.1 → 6.9.0

package/dist/index.mjs

@@ -396,8 +396,11 @@ var Box = forwardRef(function Box2(props, ref) {
 });
 var Box_default = Box;
 
+// css-module:./Badge.module.css#css-module
+var Badge_module_default = { "icon": "_icon_f2bzd_1" };
+
 // src/Badge/Badge.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
 var textColorForBackgroundColor = (color) => {
   switch (color) {
     case "gray200":
@@ -408,6 +411,7 @@ var textColorForBackgroundColor = (color) => {
   }
 };
 var Badge = ({
+  icon: Icon,
   text,
   color = "primary700"
 }) => /* @__PURE__ */ jsx4(
@@ -418,15 +422,19 @@ var Badge = ({
     paddingY: 1,
     rounding: "full",
     backgroundColor: color,
-    children: /* @__PURE__ */ jsx4(
-      Typography_default,
-      {
-        color: textColorForBackgroundColor(color),
-        size: 100,
-        weight: "bold",
-        children: text
-      }
-    )
+    dangerouslySetInlineStyle: { __style: { lineHeight: "14px" } },
+    children: /* @__PURE__ */ jsx4(Typography_default, { color: textColorForBackgroundColor(color), size: 100, children: /* @__PURE__ */ jsxs(Box_default, { display: "flex", gap: 1, alignItems: "center", justifyContent: "start", children: [
+      Icon && /* @__PURE__ */ jsx4(Icon, { className: Badge_module_default.icon }),
+      /* @__PURE__ */ jsx4(
+        Typography_default,
+        {
+          color: textColorForBackgroundColor(color),
+          size: 100,
+          weight: "bold",
+          children: text
+        }
+      )
+    ] }) })
   }
 );
 var Badge_default = Badge;
@@ -522,7 +530,7 @@ var loadingIconSize_default = loadingIconSize;
 var Button_module_default2 = { "button": "_button_1iunh_1", "buttonGap": "_buttonGap_1iunh_9", "fullWidth": "_fullWidth_1iunh_50", "sm": "_sm_1iunh_54", "md": "_md_1iunh_61", "lg": "_lg_1iunh_68", "icon": "_icon_1iunh_75", "smIcon": "_smIcon_1iunh_79", "mdIcon": "_mdIcon_1iunh_86", "lgIcon": "_lgIcon_1iunh_93", "secondaryBorder": "_secondaryBorder_1iunh_100", "secondaryDestructiveBorder": "_secondaryDestructiveBorder_1iunh_104", "loading": "_loading_1iunh_118", "syntaxButtonLoadingRotate": "_syntaxButtonLoadingRotate_1iunh_1", "loadingCircle": "_loadingCircle_1iunh_122" };
 
 // src/Button/Button.tsx
-import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
 var Button = forwardRef2(
   ({
     "data-testid": dataTestId,
@@ -540,7 +548,7 @@ var Button = forwardRef2(
     tooltip,
     type = "button"
   }, ref) => {
-    return /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsxs2(
       "button",
       {
         "data-testid": dataTestId,
@@ -752,7 +760,7 @@ var Checkbox_module_default = { "mainContainer": "_mainContainer_1omm6_1", "inpu
 var Focus_module_default = { "accessibilityOutlineFocus": "_accessibilityOutlineFocus_1h8bq_1" };
 
 // src/Checkbox/Checkbox.tsx
-import { jsx as jsx8, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
 var typographySize = {
   sm: 100,
   md: 200
@@ -783,7 +791,7 @@ var Checkbox = ({
     [Checkbox_module_default.checkedError]: error,
     [Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible2
   });
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs3(
     "label",
     {
       className: (0, import_classnames6.default)(
@@ -923,7 +931,7 @@ var Button_module_default3 = { "button": "_button_1iunh_1", "buttonGap": "_butto
 var LinkButton_module_default = { "linkButton": "_linkButton_1b3ot_1", "fitContent": "_fitContent_1b3ot_10" };
 
 // src/LinkButton/LinkButton.tsx
-import { jsx as jsx12, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs4 } from "react/jsx-runtime";
 function LinkButton({
   text,
   href,
@@ -937,7 +945,7 @@ function LinkButton({
   endIcon: EndIcon,
   onClick
 }) {
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4(
     "a",
     {
       href,
@@ -1094,7 +1102,7 @@ function Layer({
 var Modal_module_default = { "backdrop": "_backdrop_30t3h_1", "closeButton": "_closeButton_30t3h_12", "closeButtonWithImage": "_closeButtonWithImage_30t3h_32" };
 
 // src/Modal/Modal.tsx
-import { jsx as jsx16, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs5 } from "react/jsx-runtime";
 function XIcon({ color = "#000" }) {
   return /* @__PURE__ */ jsx16("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", fill: color, children: /* @__PURE__ */ jsx16(
     "path",
@@ -1126,7 +1134,7 @@ function Modal({
       role: "presentation",
       onClick: (e) => e.target === e.currentTarget && onDismiss(),
       onKeyDown: (e) => e.key === "Escape" && onDismiss(),
-      children: /* @__PURE__ */ jsxs4(
+      children: /* @__PURE__ */ jsxs5(
         Box_default,
         {
           "data-testid": dataTestId,
@@ -1152,7 +1160,7 @@ function Modal({
               }
             ) }),
             image && /* @__PURE__ */ jsx16(Box_default, { maxHeight: 200, children: image }),
-            /* @__PURE__ */ jsxs4(Box_default, { display: "flex", gap: 3, direction: "column", padding: 9, children: [
+            /* @__PURE__ */ jsxs5(Box_default, { display: "flex", gap: 3, direction: "column", padding: 9, children: [
               /* @__PURE__ */ jsx16(Heading_default, { as: "h1", size: 500, children: header }),
               /* @__PURE__ */ jsx16(Box_default, { marginBottom: 4, children }),
               footer && /* @__PURE__ */ jsx16(
@@ -1185,7 +1193,7 @@ import { useState as useState3 } from "react";
 var RadioButton_module_default = { "radioBaseContainer": "_radioBaseContainer_6h2zg_1", "disabled": "_disabled_6h2zg_9", "cursorDisabled": "_cursorDisabled_6h2zg_13", "cursorEnabled": "_cursorEnabled_6h2zg_17", "smBase": "_smBase_6h2zg_21", "mdBase": "_mdBase_6h2zg_25", "radioStyleOverride": "_radioStyleOverride_6h2zg_29", "smOverride": "_smOverride_6h2zg_34", "mdOverride": "_mdOverride_6h2zg_39", "background": "_background_6h2zg_44", "sm": "_sm_6h2zg_21", "md": "_md_6h2zg_25", "neutralBorder": "_neutralBorder_6h2zg_61", "smCheckedBorder": "_smCheckedBorder_6h2zg_65", "mdCheckedBorder": "_mdCheckedBorder_6h2zg_69", "errorBorderColor": "_errorBorderColor_6h2zg_73", "borderColor": "_borderColor_6h2zg_77" };
 
 // src/RadioButton/RadioButton.tsx
-import { jsx as jsx17, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs6 } from "react/jsx-runtime";
 var RadioButton = ({
   checked = false,
   "data-testid": dataTestId,
@@ -1205,7 +1213,7 @@ var RadioButton = ({
     [RadioButton_module_default.borderColor]: !error,
     [Focus_module_default.accessibilityOutlineFocus]: isFocused && isFocusVisible2
   });
-  return /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs6(
     "label",
     {
       className: (0, import_classnames10.default)(
@@ -1293,7 +1301,7 @@ var SelectOption = ({
 var SelectOption_default = SelectOption;
 
 // src/SelectList/SelectList.tsx
-import { jsx as jsx19, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs7 } from "react/jsx-runtime";
 var iconSize3 = {
   sm: 20,
   md: 24,
@@ -1315,7 +1323,7 @@ function SelectList({
   const id = useId();
   const { isFocusVisible: isFocusVisible2 } = useFocusVisible();
   const [isFocused, setIsFocused] = useState4(false);
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       className: (0, import_classnames11.default)(SelectList_module_default.selectContainer, {
@@ -1323,8 +1331,8 @@ function SelectList({
       }),
       children: [
         label && /* @__PURE__ */ jsx19("label", { htmlFor: id, className: SelectList_module_default.outerTextContainer, children: /* @__PURE__ */ jsx19(Typography_default, { size: 100, color: "gray700", children: label }) }),
-        /* @__PURE__ */ jsxs6("div", { className: SelectList_module_default.selectWrapper, children: [
-          /* @__PURE__ */ jsxs6(
+        /* @__PURE__ */ jsxs7("div", { className: SelectList_module_default.selectWrapper, children: [
+          /* @__PURE__ */ jsxs7(
             "select",
             {
               id,
@@ -1391,7 +1399,7 @@ import {
 var TextField_module_default = { "textfield": "_textfield_cltsv_1", "label": "_label_cltsv_21", "sm": "_sm_cltsv_25", "md": "_md_cltsv_30", "lg": "_lg_cltsv_35", "inputError": "_inputError_cltsv_40" };
 
 // src/TextField/TextField.tsx
-import { jsx as jsx20, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs8 } from "react/jsx-runtime";
 function TextField({
   autoComplete,
   "data-testid": dataTestId,
@@ -1408,7 +1416,7 @@ function TextField({
 }) {
   const reactId = useId2();
   const inputId = id != null ? id : reactId;
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     Box_default,
     {
       display: "flex",