@cambly/syntax-core 20.6.0 → 21.0.0

package/dist/__chunks/3UEOKPM2.cjs

@@ -1,136 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
-
-
-var _CHDS4D44cjs = require('./CHDS4D44.cjs');
-
-
-var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
-
-
-
-
-var _X2SDR4SDcjs = require('./X2SDR4SD.cjs');
-
-// src/TapArea/TapArea.tsx
-
-
-
-var _react = require('react');
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
-
-// css-module:./TapArea.module.css#css-module
-var TapArea_module_default = { "tapArea": "_tapArea_g6gkz_1", "fullWidth": "_fullWidth_g6gkz_5", "disabled": "_disabled_g6gkz_9", "enabled": "_enabled_g6gkz_16", "overlay": "_overlay_g6gkz_29", "hoveredOrFocussed": "_hoveredOrFocussed_g6gkz_39" };
-
-// src/TapArea/TapArea.tsx
-var _jsxruntime = require('react/jsx-runtime');
-function reducer(state, action) {
-  switch (action.type) {
-    case "BLUR":
-      return _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, state), { focussed: false });
-    case "FOCUS":
-      return _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, state), { focussed: true });
-    case "MOUSE_ENTER":
-      return _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, state), { hovered: true });
-    case "MOUSE_LEAVE":
-      return _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, state), { hovered: false });
-    default:
-      return state;
-  }
-}
-var TapArea = _react.forwardRef.call(void 0, 
-  (_a, ref) => {
-    var _b = _a, {
-      children,
-      accessibilityLabel,
-      "data-testid": dataTestId,
-      disabled: disabledProp = false,
-      fullWidth = true,
-      onClick,
-      onMouseEnter,
-      onMouseLeave,
-      rounding = "none",
-      tabIndex = 0
-    } = _b, accessibilityProps = _X2SDR4SDcjs.__objRest.call(void 0, _b, [
-      "children",
-      "accessibilityLabel",
-      "data-testid",
-      "disabled",
-      "fullWidth",
-      "onClick",
-      "onMouseEnter",
-      "onMouseLeave",
-      "rounding",
-      "tabIndex"
-    ]);
-    const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
-    const disabled = !isHydrated || disabledProp;
-    const [{ hovered, focussed }, dispatch] = _react.useReducer.call(void 0, reducer, {
-      hovered: false,
-      focussed: false
-    });
-    const handleClick = (event) => {
-      if (disabled) {
-      } else {
-        event.currentTarget.blur();
-        onClick(event);
-      }
-    };
-    const handleKeyDown = (event) => {
-      if (disabled)
-        return;
-      if (event.key === "Enter" || event.key === " " || event.key === "Space") {
-        event.preventDefault();
-        onClick(event);
-      }
-    };
-    const handleOnMouseEnter = (event) => {
-      if (disabled)
-        return;
-      dispatch({ type: "MOUSE_ENTER" });
-      onMouseEnter == null ? void 0 : onMouseEnter(event);
-    };
-    const handleOnMouseLeave = (event) => {
-      if (disabled)
-        return;
-      dispatch({ type: "MOUSE_LEAVE" });
-      onMouseLeave == null ? void 0 : onMouseLeave(event);
-    };
-    const isHoveredOrFocussed = !disabled && (hovered || focussed);
-    const roundingClasses = rounding !== "none" && _CHDS4D44cjs.rounding_module_default[`rounding${rounding}`];
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "div",
-      _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, accessibilityProps), {
-        "aria-disabled": disabled || accessibilityProps["aria-disabled"],
-        "aria-label": accessibilityLabel != null ? accessibilityLabel : accessibilityProps["aria-label"],
-        className: _classnames2.default.call(void 0, 
-          TapArea_module_default.tapArea,
-          TapArea_module_default[`${disabled ? "disabled" : "enabled"}`],
-          fullWidth && TapArea_module_default.fullWidth,
-          isHoveredOrFocussed && TapArea_module_default.hoveredOrFocussed,
-          roundingClasses
-        ),
-        "data-testid": dataTestId,
-        onClick: handleClick,
-        onKeyDown: handleKeyDown,
-        onMouseEnter: handleOnMouseEnter,
-        onMouseLeave: handleOnMouseLeave,
-        onFocus: () => dispatch({ type: "FOCUS" }),
-        onBlur: () => dispatch({ type: "BLUR" }),
-        ref,
-        role: "button",
-        tabIndex: disabled ? void 0 : tabIndex,
-        children: [
-          !disabled && (hovered || focussed) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _classnames2.default.call(void 0, TapArea_module_default.overlay, roundingClasses) }),
-          children
-        ]
-      })
-    );
-  }
-);
-TapArea.displayName = "TapArea";
-var TapArea_default = TapArea;
-
-
-
-exports.TapArea_default = TapArea_default;
-//# sourceMappingURL=3UEOKPM2.cjs.map

package/dist/__chunks/3UEOKPM2.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/TapArea/TapArea.tsx","css-module:./TapArea.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA;AAAA,EAEE;AAAA,EACA;AAAA,OAEK;AACP,OAAO,gBAAgB;;;ACNuE,IAAO,yBAAQ,EAAC,WAAU,oBAAmB,aAAY,sBAAqB,YAAW,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,qBAAoB,8BAA6B;;;ADyJlT,SAuBI,KAvBJ;AA1FN,SAAS,QACP,OAIA,QAGA;AACA,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK;AACH,aAAO,iCAAK,QAAL,EAAY,UAAU,MAAM;AAAA,IACrC,KAAK;AACH,aAAO,iCAAK,QAAL,EAAY,UAAU,KAAK;AAAA,IACpC,KAAK;AACH,aAAO,iCAAK,QAAL,EAAY,SAAS,KAAK;AAAA,IACnC,KAAK;AACH,aAAO,iCAAK,QAAL,EAAY,SAAS,MAAM;AAAA,IACpC;AACE,aAAO;AAAA,EACX;AACF;AAKA,IAAM,UAAU;AAAA,EACd,CACE,IAaA,QACG;AAdH,iBACE;AAAA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf,UAAU,eAAe;AAAA,MACzB,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX,WAAW;AAAA,IArGjB,IA2FI,IAWK,+BAXL,IAWK;AAAA,MAVH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,aAAa,cAAc;AACjC,UAAM,WAAW,CAAC,cAAc;AAChC,UAAM,CAAC,EAAE,SAAS,SAAS,GAAG,QAAQ,IAAI,WAAW,SAAS;AAAA,MAC5D,SAAS;AAAA,MACT,UAAU;AAAA,IACZ,CAAC;AAED,UAAM,cAAuD,CAAC,UAAU;AACtE,UAAI,UAAU;AAAA,MAEd,OAAO;AACL,cAAM,cAAc,KAAK;AACzB,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF;AAEA,UAAM,gBAA4D,CAChE,UACG;AACH,UAAI;AAAU;AACd,UAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,OAAO,MAAM,QAAQ,SAAS;AACvE,cAAM,eAAe;AACrB,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF;AAEA,UAAM,qBAA8D,CAClE,UACG;AACH,UAAI;AAAU;AACd,eAAS,EAAE,MAAM,cAAc,CAAC;AAChC,mDAAe;AAAA,IACjB;AAEA,UAAM,qBAA8D,CAClE,UACG;AACH,UAAI;AAAU;AACd,eAAS,EAAE,MAAM,cAAc,CAAC;AAChC,mDAAe;AAAA,IACjB;AAEA,UAAM,sBAAsB,CAAC,aAAa,WAAW;AACrD,UAAM,kBACJ,aAAa,UAAU,wBAAe,WAAW,UAAU;AAE7D,WACE;AAAA,MAAC;AAAA,uCACK,qBADL;AAAA,QAEC,iBAAe,YAAY,mBAAmB,eAAe;AAAA,QAC7D,cAAY,kDAAsB,mBAAmB,YAAY;AAAA,QACjE,WAAW;AAAA,UACT,uBAAO;AAAA,UACP,uBAAO,GAAG,WAAW,aAAa,WAAW;AAAA,UAC7C,aAAa,uBAAO;AAAA,UACpB,uBAAuB,uBAAO;AAAA,UAC9B;AAAA,QACF;AAAA,QACA,eAAa;AAAA,QACb,SAAS;AAAA,QACT,WAAW;AAAA,QACX,cAAc;AAAA,QACd,cAAc;AAAA,QACd,SAAS,MAAM,SAAS,EAAE,MAAM,QAAQ,CAAC;AAAA,QACzC,QAAQ,MAAM,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,QACvC;AAAA,QACA,MAAK;AAAA,QACL,UAAU,WAAW,SAAY;AAAA,QAEhC;AAAA,WAAC,aAAa,WAAW,aACxB,oBAAC,SAAI,WAAW,WAAW,uBAAO,SAAS,eAAe,GAAG;AAAA,UAE9D;AAAA;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;AAEtB,IAAO,kBAAQ","sourcesContent":["import React, {\n  type ReactNode,\n  forwardRef,\n  useReducer,\n  type AriaAttributes,\n} from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./TapArea.module.css\";\nimport roundingStyles from \"../rounding.module.css\";\nimport useIsHydrated from \"../useIsHydrated\";\n\ntype TapAreaProps = AriaAttributes & {\n  /**\n   * The children to be rendered inside the tap area.\n   */\n  children?: ReactNode;\n  /**\n   * The label to be used for accessibility\n   */\n  accessibilityLabel?: string;\n  /**\n   * Test id for the tap area\n   */\n  \"data-testid\"?: string;\n  /**\n   * If `true`, the tap area will be disabled\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean;\n  /**\n   * If `true`, the tap area will be full width\n   */\n  fullWidth?: boolean;\n  /**\n   * The callback to be called when the tap area is clicked\n   */\n  onClick: (event: React.SyntheticEvent<HTMLDivElement>) => void;\n  /**\n   * The callback to be called when the tap area is hovered\n   */\n  onMouseEnter?: (event: React.SyntheticEvent<HTMLDivElement>) => void;\n  /**\n   * The callback to be called when the tap area is no longer hovered\n   */\n  onMouseLeave?: (event: React.SyntheticEvent<HTMLDivElement>) => void;\n  /**\n   * Border radius of the tap area.\n   *\n   * * `none`: 0px\n   * * `sm`: 8px\n   * * `md`: 12px\n   * * `full`: 999px\n   *\n   * @defaultValue \"none\"\n   */\n  rounding?: \"md\" | \"sm\" | \"full\" | \"none\";\n  /**\n   * The tab index of the tap area\n   */\n  tabIndex?: 0 | -1;\n};\n\nfunction reducer(\n  state: {\n    hovered: boolean;\n    focussed: boolean;\n  },\n  action: {\n    type: \"BLUR\" | \"FOCUS\" | \"MOUSE_ENTER\" | \"MOUSE_LEAVE\";\n  },\n) {\n  switch (action.type) {\n    case \"BLUR\":\n      return { ...state, focussed: false };\n    case \"FOCUS\":\n      return { ...state, focussed: true };\n    case \"MOUSE_ENTER\":\n      return { ...state, hovered: true };\n    case \"MOUSE_LEAVE\":\n      return { ...state, hovered: false };\n    default:\n      return state;\n  }\n}\n\n/**\n * [TapArea](https://cambly-syntax.vercel.app/?path=/docs/components-taparea--docs) allows components to be clickable and touchable in an accessible way.\n */\nconst TapArea = forwardRef<HTMLDivElement, TapAreaProps>(\n  (\n    {\n      children,\n      accessibilityLabel,\n      \"data-testid\": dataTestId,\n      disabled: disabledProp = false,\n      fullWidth = true,\n      onClick,\n      onMouseEnter,\n      onMouseLeave,\n      rounding = \"none\",\n      tabIndex = 0,\n      ...accessibilityProps\n    }: TapAreaProps,\n    ref,\n  ) => {\n    const isHydrated = useIsHydrated();\n    const disabled = !isHydrated || disabledProp;\n    const [{ hovered, focussed }, dispatch] = useReducer(reducer, {\n      hovered: false,\n      focussed: false,\n    });\n\n    const handleClick: React.MouseEventHandler<HTMLDivElement> = (event) => {\n      if (disabled) {\n        undefined;\n      } else {\n        event.currentTarget.blur();\n        onClick(event);\n      }\n    };\n\n    const handleKeyDown: React.KeyboardEventHandler<HTMLDivElement> = (\n      event,\n    ) => {\n      if (disabled) return;\n      if (event.key === \"Enter\" || event.key === \" \" || event.key === \"Space\") {\n        event.preventDefault();\n        onClick(event);\n      }\n    };\n\n    const handleOnMouseEnter: React.MouseEventHandler<HTMLDivElement> = (\n      event,\n    ) => {\n      if (disabled) return;\n      dispatch({ type: \"MOUSE_ENTER\" });\n      onMouseEnter?.(event);\n    };\n\n    const handleOnMouseLeave: React.MouseEventHandler<HTMLDivElement> = (\n      event,\n    ) => {\n      if (disabled) return;\n      dispatch({ type: \"MOUSE_LEAVE\" });\n      onMouseLeave?.(event);\n    };\n\n    const isHoveredOrFocussed = !disabled && (hovered || focussed);\n    const roundingClasses =\n      rounding !== \"none\" && roundingStyles[`rounding${rounding}`];\n\n    return (\n      <div\n        {...accessibilityProps}\n        aria-disabled={disabled || accessibilityProps[\"aria-disabled\"]}\n        aria-label={accessibilityLabel ?? accessibilityProps[\"aria-label\"]}\n        className={classNames(\n          styles.tapArea,\n          styles[`${disabled ? \"disabled\" : \"enabled\"}`],\n          fullWidth && styles.fullWidth,\n          isHoveredOrFocussed && styles.hoveredOrFocussed,\n          roundingClasses,\n        )}\n        data-testid={dataTestId}\n        onClick={handleClick}\n        onKeyDown={handleKeyDown}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleOnMouseLeave}\n        onFocus={() => dispatch({ type: \"FOCUS\" })}\n        onBlur={() => dispatch({ type: \"BLUR\" })}\n        ref={ref}\n        role=\"button\"\n        tabIndex={disabled ? undefined : tabIndex}\n      >\n        {!disabled && (hovered || focussed) && (\n          <div className={classNames(styles.overlay, roundingClasses)} />\n        )}\n        {children}\n      </div>\n    );\n  },\n);\n\nTapArea.displayName = \"TapArea\";\n\nexport default TapArea;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TapArea/TapArea.module.css\"; export default {\"tapArea\":\"_tapArea_g6gkz_1\",\"fullWidth\":\"_fullWidth_g6gkz_5\",\"disabled\":\"_disabled_g6gkz_9\",\"enabled\":\"_enabled_g6gkz_16\",\"overlay\":\"_overlay_g6gkz_29\",\"hoveredOrFocussed\":\"_hoveredOrFocussed_g6gkz_39\"}"]}

package/dist/__chunks/3ULBWSHT.cjs

@@ -1,169 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
-
-
-var _PLUVW6AMcjs = require('./PLUVW6AM.cjs');
-
-
-var _IL22HCBFcjs = require('./IL22HCBF.cjs');
-
-
-var _CHDS4D44cjs = require('./CHDS4D44.cjs');
-
-
-var _4TYOP5XMcjs = require('./4TYOP5XM.cjs');
-
-
-var _2XIVACBMcjs = require('./2XIVACBM.cjs');
-
-
-var _LLFHCGRAcjs = require('./LLFHCGRA.cjs');
-
-
-var _QR3HKPXFcjs = require('./QR3HKPXF.cjs');
-
-
-var _E5P6WRJDcjs = require('./E5P6WRJD.cjs');
-
-
-
-
-var _X2SDR4SDcjs = require('./X2SDR4SD.cjs');
-
-// src/Tooltip/Tooltip.tsx
-var _react = require('react');
-var _reactaria = require('react-aria');
-
-
-
-
-
-var _reactariacomponents = require('react-aria-components');
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
-
-// css-module:./Tooltip.module.css#css-module
-var Tooltip_module_default = { "tooltip": "_tooltip_11pyp_1", "arrowPlacementtop": "_arrowPlacementtop_11pyp_5", "arrowPlacementbottom": "_arrowPlacementbottom_11pyp_10" };
-
-// src/Tooltip/Tooltip.tsx
-var _jsxruntime = require('react/jsx-runtime');
-function TooltipArrow(props) {
-  const { on } = props;
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactariacomponents.OverlayArrow, _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {}, props), { children: ({ placement }) => {
-    if (placement === "center")
-      return null;
-    if (placement === "left")
-      return null;
-    if (placement === "right")
-      return null;
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      "div",
-      {
-        className: _classnames2.default.call(void 0, [
-          _IL22HCBFcjs.Box_module_default.block,
-          Tooltip_module_default[`arrowPlacement${placement}`],
-          on === "lightBackground" ? _2XIVACBMcjs.colors_module_default.cambioBlackColor : _2XIVACBMcjs.colors_module_default.cambioWhiteColor
-        ]),
-        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          "svg",
-          {
-            className: _classnames2.default.call(void 0, [_IL22HCBFcjs.Box_module_default.block]),
-            width: 40,
-            height: 5,
-            viewBox: "0 0 40 5",
-            xmlns: "http://www.w3.org/2000/svg",
-            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M17 0L22 5H12L17 0Z", fill: "currentColor" })
-          }
-        )
-      }
-    );
-  } }));
-}
-var AriaTooltip = _react.forwardRef.call(void 0, function AriaTooltip2(_a, ref) {
-  var _b = _a, { children: childrenProp, onChangeContentVisibility, on } = _b, otherProps = _X2SDR4SDcjs.__objRest.call(void 0, _b, ["children", "onChangeContentVisibility", "on"]);
-  const className = _classnames2.default.call(void 0, [
-    _IL22HCBFcjs.Box_module_default.box,
-    _2XIVACBMcjs.colors_module_default.gray900Color,
-    on === "lightBackground" ? _2XIVACBMcjs.colors_module_default.cambioBlackBackgroundColor : _2XIVACBMcjs.colors_module_default.cambioWhiteBackgroundColor,
-    _PLUVW6AMcjs.padding_module_default.paddingX2,
-    _PLUVW6AMcjs.padding_module_default.paddingY2,
-    _CHDS4D44cjs.rounding_module_default.roundingsm,
-    Tooltip_module_default.tooltip
-  ]);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _reactariacomponents.Tooltip,
-    _X2SDR4SDcjs.__spreadProps.call(void 0, _X2SDR4SDcjs.__spreadValues.call(void 0, {
-      ref
-    }, _reactaria.mergeProps.call(void 0, 
-      {
-        className,
-        offset: 8,
-        crossOffset: 0
-      },
-      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, TooltipArrow, { on }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _4TYOP5XMcjs.Typography_default, { size: 100, color: "white", children }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _E5P6WRJDcjs.OverlayVisibility,
-            {
-              isEntering,
-              isExiting,
-              onChange: onChangeContentVisibility
-            }
-          )
-        ] })
-      )
-    })
-  );
-});
-var Tooltip = _react.forwardRef.call(void 0, function Tooltip2(props, ref) {
-  const {
-    accessibilityLabel,
-    "data-testid": dataTestId,
-    delay = 0,
-    disabled = false,
-    children,
-    content,
-    initialOpen,
-    onChangeContentVisibility,
-    onOpenChange,
-    open,
-    placement = "top",
-    on = "lightBackground"
-  } = props;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _reactariacomponents.TooltipTrigger,
-    {
-      defaultOpen: initialOpen,
-      delay,
-      closeDelay: 500,
-      isDisabled: disabled,
-      isOpen: open,
-      onOpenChange,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _QR3HKPXFcjs.Triggerable_default, { children }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          AriaTooltip,
-          {
-            ref,
-            placement: _LLFHCGRAcjs.syntaxToReactAriaPlacement.call(void 0, placement),
-            "aria-label": accessibilityLabel,
-            "data-testid": dataTestId,
-            onChangeContentVisibility,
-            on,
-            children: content
-          }
-        )
-      ]
-    }
-  );
-});
-var Tooltip_default = Tooltip;
-
-
-
-
-exports.AriaTooltip = AriaTooltip; exports.Tooltip_default = Tooltip_default;
-//# sourceMappingURL=3ULBWSHT.cjs.map

package/dist/__chunks/3ULBWSHT.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tooltip/Tooltip.tsx","css-module:./Tooltip.module.css#css-module"],"names":["AriaTooltip","Tooltip"],"mappings":"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","sourcesContent":["import React, { forwardRef, type ReactNode, type ReactElement } from \"react\";\nimport { mergeProps } from \"react-aria\";\nimport {\n  composeRenderProps,\n  OverlayArrow as ReactAriaOverlayArrow,\n  type OverlayArrowProps as ReactAriaOverlayArrowProps,\n  Tooltip as ReactAriaTooltip,\n  TooltipTrigger as ReactAriaTooltipTrigger,\n  type TooltipProps as ReactAriaTooltipProps,\n} from \"react-aria-components\";\n\nimport Triggerable from \"../react-aria-utils/Triggerable\";\nimport Typography from \"../Typography/Typography\";\nimport OverlayVisibility from \"../react-aria-utils/OverlayVisibility\";\nimport classNames from \"classnames\";\nimport boxStyles from \"../Box/Box.module.css\";\nimport paddingStyles from \"../Box/padding.module.css\";\nimport roundingStyles from \"../rounding.module.css\";\nimport colorStyles from \"../colors/colors.module.css\";\nimport styles from \"./Tooltip.module.css\";\nimport {\n  type Placement,\n  syntaxToReactAriaPlacement,\n} from \"../react-aria-utils/placement\";\n\nfunction TooltipArrow(\n  props: ReactAriaOverlayArrowProps & {\n    on?: \"lightBackground\" | \"darkBackground\";\n  },\n): ReactElement {\n  const { on } = props;\n\n  return (\n    <ReactAriaOverlayArrow {...props}>\n      {({ placement }) => {\n        if (placement === \"center\") return null;\n        if (placement === \"left\") return null;\n        if (placement === \"right\") return null;\n        return (\n          <div\n            className={classNames([\n              boxStyles.block,\n              styles[`arrowPlacement${placement}`],\n              on === \"lightBackground\"\n                ? colorStyles.cambioBlackColor\n                : colorStyles.cambioWhiteColor,\n            ])}\n          >\n            <svg\n              className={classNames([boxStyles.block])}\n              width={40}\n              height={5}\n              viewBox=\"0 0 40 5\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path d=\"M17 0L22 5H12L17 0Z\" fill=\"currentColor\" />\n            </svg>\n          </div>\n        );\n      }}\n    </ReactAriaOverlayArrow>\n  );\n}\n\n/**\n * AriaTooltip: This component extends Tooltip from react-aria-components\n * It applies syntax styles and adds aadditional props:\n *  - onContentChangeVisibility\n */\nexport const AriaTooltip = forwardRef<\n  HTMLDivElement,\n  ReactAriaTooltipProps & {\n    /** Optional handler for change of visibility for overlaid content, for analytics timing */\n    onChangeContentVisibility?: (visible: boolean) => void;\n    on?: \"lightBackground\" | \"darkBackground\";\n  }\n>(function AriaTooltip(\n  { children: childrenProp, onChangeContentVisibility, on, ...otherProps },\n  ref,\n): ReactElement {\n  const className = classNames([\n    boxStyles.box,\n    colorStyles.gray900Color,\n    on === \"lightBackground\"\n      ? colorStyles.cambioBlackBackgroundColor\n      : colorStyles.cambioWhiteBackgroundColor,\n    paddingStyles.paddingX2,\n    paddingStyles.paddingY2,\n    roundingStyles.roundingsm,\n    styles.tooltip,\n  ]);\n\n  return (\n    <ReactAriaTooltip\n      ref={ref}\n      {...mergeProps(\n        {\n          className,\n          offset: 8,\n          crossOffset: 0,\n        },\n        otherProps,\n      )}\n    >\n      {composeRenderProps(\n        childrenProp,\n        (children, { isEntering, isExiting }) => (\n          <>\n            <TooltipArrow on={on} />\n            <Typography size={100} color=\"white\">\n              {children}\n            </Typography>\n            <OverlayVisibility\n              isEntering={isEntering}\n              isExiting={isExiting}\n              onChange={onChangeContentVisibility}\n            />\n          </>\n        ),\n      )}\n    </ReactAriaTooltip>\n  );\n});\n\ntype TooltipProps = {\n  /**\n   * Test id for the floating tooltip\n   */\n  \"data-testid\"?: string;\n  /**\n   * How long a user hovers before tooltip shows (in ms)\n   * @defaultValue 0\n   */\n  delay?: number;\n  /** Optional boolean to disable tooltip trigger behavior */\n  disabled?: boolean;\n  /** Optional aria-label for the tooltip (content element) */\n  accessibilityLabel?: string;\n  /** Required trigger element */\n  children: ReactElement;\n  /** Content to be shown inside the tooltip. */\n  content: ReactNode;\n  /** If set to true the tooltip will render initially open */\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 tooltip externally */\n  open?: boolean;\n  /**\n   * Location of the tooltip content relative to anchor element\n   * @defaultValue \"top-end\"\n   */\n  placement?: Placement;\n\n  /**\n   * Indicate whether the tooltip renders on a light or dark background. Changes the color of the tooltip\n   *\n   * @defaultValue `lightBackground`\n   */\n  on?: \"lightBackground\" | \"darkBackground\";\n};\n/**\n * [Tooltip](https://cambly-syntax.vercel.app/?path=/docs/components-tooltip--docs) displays contextual information on hover or focus.\n *\n * Tooltip content is hidden by default and shown on hover or focus.\n * The content is hidden again when the user mouses out of the trigger element or blurs the trigger element or presses Escape\n *\n * Example Usage:\n ```\n  <Tooltip\n    delay={200}\n    placement=\"bottom-start\"\n    initialOpen\n    content={(\n      <Box padding={2}>\n        ... some content goes here\n      </Box>\n    )}\n  >\n      <Button text=\"Trigger me\" />\n  </Tooltip>\n ```\n */\nconst Tooltip = forwardRef<HTMLDivElement, TooltipProps>(function Tooltip(\n  props,\n  ref,\n): ReactElement {\n  const {\n    accessibilityLabel,\n    \"data-testid\": dataTestId,\n    delay = 0,\n    disabled = false,\n    children,\n    content,\n    initialOpen,\n    onChangeContentVisibility,\n    onOpenChange,\n    open,\n    placement = \"top\",\n    on = \"lightBackground\",\n  } = props;\n\n  return (\n    <ReactAriaTooltipTrigger\n      defaultOpen={initialOpen}\n      delay={delay}\n      closeDelay={500}\n      isDisabled={disabled}\n      isOpen={open}\n      onOpenChange={onOpenChange}\n    >\n      {/* transfer focus handlers to child element if it is focusable */}\n      <Triggerable>{children}</Triggerable>\n      <AriaTooltip\n        ref={ref}\n        placement={syntaxToReactAriaPlacement(placement)}\n        aria-label={accessibilityLabel}\n        data-testid={dataTestId}\n        onChangeContentVisibility={onChangeContentVisibility}\n        on={on}\n      >\n        {content}\n      </AriaTooltip>\n    </ReactAriaTooltipTrigger>\n  );\n});\n\nexport default Tooltip;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Tooltip/Tooltip.module.css\"; export default {\"tooltip\":\"_tooltip_11pyp_1\",\"arrowPlacementtop\":\"_arrowPlacementtop_11pyp_5\",\"arrowPlacementbottom\":\"_arrowPlacementbottom_11pyp_10\"}"]}

package/dist/__chunks/4QUXUGJP.cjs

@@ -1,47 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
-
-
-var _QODNNCT2cjs = require('./QODNNCT2.cjs');
-
-// src/Tabs/Tabs.tsx
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
-
-// css-module:./Tabs.module.css#css-module
-var Tabs_module_default = { "tabContainerlightBackground": "_tabContainerlightBackground_b6c60_1", "tabContainerDarkBackground": "_tabContainerDarkBackground_b6c60_5", "tab": "_tab_b6c60_1", "selectedTabOnLightBackground": "_selectedTabOnLightBackground_b6c60_13", "selectedTabOnDarkBackground": "_selectedTabOnDarkBackground_b6c60_17", "unselectedTab": "_unselectedTab_b6c60_21", "link": "_link_b6c60_25" };
-
-// src/Tabs/Tabs.tsx
-var _jsxruntime = require('react/jsx-runtime');
-function Tabs({
-  children,
-  accessibilityLabel,
-  on = "lightBackground"
-}) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "div",
-    {
-      role: "tablist",
-      "aria-label": accessibilityLabel,
-      className: _classnames2.default.call(void 0, {
-        [Tabs_module_default.tabContainerlightBackground]: on === "lightBackground",
-        [Tabs_module_default.tabContainerDarkBackground]: on === "darkBackground"
-      }),
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _QODNNCT2cjs.Box_default,
-        {
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "start",
-          width: "100%",
-          gap: 8,
-          height: 56,
-          children
-        }
-      )
-    }
-  );
-}
-
-
-
-exports.Tabs = Tabs;
-//# sourceMappingURL=4QUXUGJP.cjs.map

package/dist/__chunks/4QUXUGJP.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Tabs/Tabs.tsx","css-module:./Tabs.module.css#css-module"],"names":[],"mappings":";;;;;;AACA,OAAO,gBAAgB;;;ACDiE,IAAO,sBAAQ,EAAC,+BAA8B,wCAAuC,8BAA6B,uCAAsC,OAAM,gBAAe,gCAA+B,0CAAyC,+BAA8B,yCAAwC,iBAAgB,2BAA0B,QAAO,iBAAgB;;;ADsC9c;AA9BS,SAAR,KAAsB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,KAAK;AACP,GAgBgB;AACd,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,WAAW,WAAW;AAAA,QACpB,CAAC,oBAAO,2BAA2B,GAAG,OAAO;AAAA,QAC7C,CAAC,oBAAO,0BAA0B,GAAG,OAAO;AAAA,MAC9C,CAAC;AAAA,MAED;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,YAAW;AAAA,UACX,gBAAe;AAAA,UACf,OAAM;AAAA,UACN,KAAK;AAAA,UACL,QAAQ;AAAA,UAEP;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ","sourcesContent":["import { type ReactNode } from \"react\";\nimport classnames from \"classnames\";\nimport styles from \"./Tabs.module.css\";\nimport Box from \"../Box/Box\";\n\n/**\n * [Tabs](https://cambly-syntax.vercel.app/?path=/docs/components-tabs--docs) are used to organize content into different sections.\n */\nexport default function Tabs({\n  children,\n  accessibilityLabel,\n  on = \"lightBackground\",\n}: {\n  /**\n   * The Tabs to display. Each Tab should be a `TabButton` or a `TabLink`.\n   * Only use `TabLink` for clicking tab that update the URL upon selection. Otherwise, use `TabButton`.\n   */\n  children: ReactNode;\n  /**\n   * Accessibility label for the Tabs container.\n   */\n  accessibilityLabel: string;\n  /**\n   * Indicate whether the Tabs render on a light or dark background.\n   *\n   * @defaulValue `lightBackground`\n   */\n  on?: \"lightBackground\" | \"darkBackground\";\n}): JSX.Element {\n  return (\n    <div\n      role=\"tablist\"\n      aria-label={accessibilityLabel}\n      className={classnames({\n        [styles.tabContainerlightBackground]: on === \"lightBackground\",\n        [styles.tabContainerDarkBackground]: on === \"darkBackground\",\n      })}\n    >\n      <Box\n        display=\"flex\"\n        alignItems=\"center\"\n        justifyContent=\"start\"\n        width=\"100%\"\n        gap={8}\n        height={56}\n      >\n        {children}\n      </Box>\n    </div>\n  );\n}\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Tabs/Tabs.module.css\"; export default {\"tabContainerlightBackground\":\"_tabContainerlightBackground_b6c60_1\",\"tabContainerDarkBackground\":\"_tabContainerDarkBackground_b6c60_5\",\"tab\":\"_tab_b6c60_1\",\"selectedTabOnLightBackground\":\"_selectedTabOnLightBackground_b6c60_13\",\"selectedTabOnDarkBackground\":\"_selectedTabOnDarkBackground_b6c60_17\",\"unselectedTab\":\"_unselectedTab_b6c60_21\",\"link\":\"_link_b6c60_25\"}"]}

package/dist/__chunks/4TYOP5XM.cjs

@@ -1,64 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
-
-
-var _B3JRSVBDcjs = require('./B3JRSVBD.cjs');
-
-// src/Typography/Typography.tsx
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
-var _react = require('react');
-
-// css-module:./Typography.module.css#css-module
-var Typography_module_default = { "typography": "_typography_15w34_1", "sansSerif": "_sansSerif_15w34_22", "serif": "_serif_15w34_27", "size0": "_size0_15w34_73", "size100": "_size100_15w34_77", "size200": "_size200_15w34_81", "size300": "_size300_15w34_85", "size400": "_size400_15w34_89", "size500": "_size500_15w34_93", "size700": "_size700_15w34_97", "size800": "_size800_15w34_101", "size900": "_size900_15w34_105", "size1100": "_size1100_15w34_109", "center": "_center_15w34_137", "forceLeft": "_forceLeft_15w34_141", "forceRight": "_forceRight_15w34_145", "start": "_start_15w34_149", "end": "_end_15w34_153", "regular": "_regular_15w34_159", "medium": "_medium_15w34_163", "semiBold": "_semiBold_15w34_167", "bold": "_bold_15w34_171", "underline": "_underline_15w34_175", "inline": "_inline_15w34_179", "uppercase": "_uppercase_15w34_183", "lineClamp": "_lineClamp_15w34_187", "p100": "_p100_15w34_196", "p200": "_p200_15w34_200", "p300": "_p300_15w34_204", "p400": "_p400_15w34_208", "p500": "_p500_15w34_212" };
-
-// src/Typography/Typography.tsx
-var _jsxruntime = require('react/jsx-runtime');
-var Typography = _react.forwardRef.call(void 0, function Typography2({
-  align = "start",
-  as = "div",
-  children,
-  color = "gray900",
-  "data-testid": dataTestId,
-  fontStyle = "sans-serif",
-  id,
-  inline = false,
-  lineClamp = void 0,
-  size = 200,
-  tooltip,
-  transform = "none",
-  underline = false,
-  weight = "regular"
-}, ref) {
-  const Tag = as;
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    Tag,
-    {
-      id,
-      className: _classnames2.default.call(void 0, 
-        Typography_module_default.typography,
-        Typography_module_default[align],
-        Typography_module_default[weight],
-        fontStyle === "serif" ? Typography_module_default.serif : Typography_module_default.sansSerif,
-        _B3JRSVBDcjs.textColor.call(void 0, color),
-        inline && Typography_module_default.inline,
-        Typography_module_default[`size${size}`],
-        transform === "uppercase" && Typography_module_default.uppercase,
-        underline && Typography_module_default.underline,
-        lineClamp != null && Typography_module_default.lineClamp,
-        as === "p" && Typography_module_default[`p${size}`]
-      ),
-      "data-testid": dataTestId,
-      style: {
-        WebkitLineClamp: lineClamp
-      },
-      title: tooltip,
-      ref,
-      children
-    }
-  );
-});
-var Typography_default = Typography;
-
-
-
-exports.Typography_default = Typography_default;
-//# sourceMappingURL=4TYOP5XM.cjs.map

package/dist/__chunks/4TYOP5XM.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Typography/Typography.tsx","css-module:./Typography.module.css#css-module"],"names":["Typography"],"mappings":";;;;;;AAAA,OAAO,gBAAgB;AACvB,SAAS,kBAAqD;;;ACDsC,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,aAAY,uBAAsB,SAAQ,mBAAkB,SAAQ,mBAAkB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,qBAAoB,WAAU,sBAAqB,WAAU,sBAAqB,YAAW,uBAAsB,UAAS,qBAAoB,aAAY,wBAAuB,cAAa,yBAAwB,SAAQ,oBAAmB,OAAM,kBAAiB,WAAU,sBAAqB,UAAS,qBAAoB,YAAW,uBAAsB,QAAO,mBAAkB,aAAY,wBAAuB,UAAS,qBAAoB,aAAY,wBAAuB,aAAY,wBAAuB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,mBAAkB,QAAO,kBAAiB;;;ADwJ3gC;AAhJJ,IAAM,aAAa,WA0HjB,SAASA,YACT;AAAA,EACE,QAAQ;AAAA,EACR,KAAK;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,YAAY;AAAA,EACZ;AAAA,EACA,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,OAAO;AAAA,EACP;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,SAAS;AACX,GACA,KACc;AACd,QAAM,MAAM;AAEZ,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT,0BAAO;AAAA,QACP,0BAAO,KAAK;AAAA,QACZ,0BAAO,MAAM;AAAA,QACb,cAAc,UAAU,0BAAO,QAAQ,0BAAO;AAAA,QAC9C,UAAU,KAAK;AAAA,QACf,UAAU,0BAAO;AAAA,QACjB,0BAAO,OAAO,MAAM;AAAA,QACpB,cAAc,eAAe,0BAAO;AAAA,QACpC,aAAa,0BAAO;AAAA,QACpB,aAAa,QAAQ,0BAAO;AAAA,QAC5B,OAAO,OAAO,0BAAO,IAAI,MAAM;AAAA,MACjC;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,iBAAiB;AAAA,MACnB;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,qBAAQ","sourcesContent":["import classNames from \"classnames\";\nimport { forwardRef, type ReactElement, type ReactNode } from \"react\";\nimport styles from \"./Typography.module.css\";\nimport textColor from \"../colors/textColors\";\n\n/**\n * [Typography](https://cambly-syntax.vercel.app/?path=/docs/components-typography--docs) is a component that renders text.\n */\nconst Typography = forwardRef<\n  HTMLDivElement,\n  {\n    /**\n     * Aligns the text to the left, right, or center of the container.\n     * * `start` and `end` will align the text to the left or right of the container depending on the locale.\n     * * `forceLeft` and `forceRight` will align the text to the left or right of the container regardless of the locale (should be used sparingly).\n     *\n     * @defaultValue \"start\"\n     */\n    align?: \"start\" | \"end\" | \"forceLeft\" | \"center\" | \"forceRight\";\n    /**\n     * DOM element to render as.\n     *\n     * @defaultValue \"div\"\n     */\n    as?: \"div\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"p\";\n    /**\n     * The text to be rendered\n     */\n    children?: ReactNode;\n    /**\n     * The color of the text.\n     *\n     * @defaultValue \"gray900\"\n     */\n    color?:\n      | \"gray900\"\n      | \"gray700\"\n      | \"primary\"\n      | \"destructive-primary\"\n      | \"destructive-darkBackground\"\n      | \"destructive-lightBackground\"\n      | \"success\"\n      | \"success-darkBackground\"\n      | \"white\"\n      | \"white-secondary\"\n      | \"inherit\";\n    /**\n     * Test id for the text\n     */\n    \"data-testid\"?: string;\n    /**\n     * Style of the font\n     *\n     * Classic only supports `sans-serif`\n     *\n     * @defaultValue \"sans-serif\"\n     */\n    fontStyle?: \"serif\" | \"sans-serif\";\n    /**\n     * The id for the element\n     */\n    id?: string;\n    /**\n     * Whether the text should flow inline with other elements.\n     *\n     * @defaultValue false\n     */\n    inline?: boolean;\n    /**\n     * The number of lines we should truncate the text at\n     */\n    lineClamp?: number | undefined;\n    /**\n     * Size of the text.\n     *\n     * Mobile (viewport width <= 480px)::\n     * * `0`: 12px\n     * * `100`: 13px\n     * * `200`: 16px\n     * * `300`: 19px\n     * * `400`: 25px\n     * * `500`: 32px\n     * * `700`: 38px\n     * * `800`: 46px\n     * * `900`: 55px\n     * * `1100`: 83px\n     *\n     * Desktop (viewport width > 480px):\n     * * `0`: 12px\n     * * `100`: 13px\n     * * `200`: 16px\n     * * `300`: 20px\n     * * `400`: 25px\n     * * `500`: 32px\n     * * `700`: 49px\n     * * `800`: 63px\n     * * `900`: 76px\n     * * `1100`: 119px\n     *\n     * @defaultValue 200\n     */\n    size?: 0 | 100 | 200 | 300 | 400 | 500 | 700 | 800 | 900 | 1100;\n    /**\n     * The tooltip to be displayed when the user hovers the text\n     */\n    tooltip?: string;\n    /**\n     * Whether the text should be transformed to uppercase.\n     *\n     * @defaultValue \"none\"\n     */\n    transform?: \"none\" | \"uppercase\";\n    /**\n     * Whether the text has an underline.\n     *\n     * @defaultValue false\n     */\n    underline?: boolean;\n    /**\n     * Indicates the boldness of the text.\n     *\n     * * `regular`: 400\n     * * `medium`: 510\n     * * `semiBold`: 590\n     * * `bold`: 710\n     *\n     * @defaultValue \"regular\"\n     */\n    weight?: \"regular\" | \"medium\" | \"semiBold\" | \"bold\";\n  }\n>(function Typography(\n  {\n    align = \"start\",\n    as = \"div\",\n    children,\n    color = \"gray900\",\n    \"data-testid\": dataTestId,\n    fontStyle = \"sans-serif\",\n    id,\n    inline = false,\n    lineClamp = undefined,\n    size = 200,\n    tooltip,\n    transform = \"none\",\n    underline = false,\n    weight = \"regular\",\n  },\n  ref,\n): ReactElement {\n  const Tag = as;\n\n  return (\n    <Tag\n      id={id}\n      className={classNames(\n        styles.typography,\n        styles[align],\n        styles[weight],\n        fontStyle === \"serif\" ? styles.serif : styles.sansSerif,\n        textColor(color),\n        inline && styles.inline,\n        styles[`size${size}`],\n        transform === \"uppercase\" && styles.uppercase,\n        underline && styles.underline,\n        lineClamp != null && styles.lineClamp,\n        as === \"p\" && styles[`p${size}`],\n      )}\n      data-testid={dataTestId}\n      style={{\n        WebkitLineClamp: lineClamp,\n      }}\n      title={tooltip}\n      ref={ref}\n    >\n      {children}\n    </Tag>\n  );\n});\n\nexport default Typography;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Typography/Typography.module.css\"; export default {\"typography\":\"_typography_15w34_1\",\"sansSerif\":\"_sansSerif_15w34_22\",\"serif\":\"_serif_15w34_27\",\"size0\":\"_size0_15w34_73\",\"size100\":\"_size100_15w34_77\",\"size200\":\"_size200_15w34_81\",\"size300\":\"_size300_15w34_85\",\"size400\":\"_size400_15w34_89\",\"size500\":\"_size500_15w34_93\",\"size700\":\"_size700_15w34_97\",\"size800\":\"_size800_15w34_101\",\"size900\":\"_size900_15w34_105\",\"size1100\":\"_size1100_15w34_109\",\"center\":\"_center_15w34_137\",\"forceLeft\":\"_forceLeft_15w34_141\",\"forceRight\":\"_forceRight_15w34_145\",\"start\":\"_start_15w34_149\",\"end\":\"_end_15w34_153\",\"regular\":\"_regular_15w34_159\",\"medium\":\"_medium_15w34_163\",\"semiBold\":\"_semiBold_15w34_167\",\"bold\":\"_bold_15w34_171\",\"underline\":\"_underline_15w34_175\",\"inline\":\"_inline_15w34_179\",\"uppercase\":\"_uppercase_15w34_183\",\"lineClamp\":\"_lineClamp_15w34_187\",\"p100\":\"_p100_15w34_196\",\"p200\":\"_p200_15w34_200\",\"p300\":\"_p300_15w34_204\",\"p400\":\"_p400_15w34_208\",\"p500\":\"_p500_15w34_212\"}"]}

package/dist/__chunks/4UT6BROB.cjs

@@ -1,141 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
-
-
-var _TH4TA3JNcjs = require('./TH4TA3JN.cjs');
-
-
-var _5JUNB754cjs = require('./5JUNB754.cjs');
-
-
-var _3P2PWHOUcjs = require('./3P2PWHOU.cjs');
-
-
-
-var _UEY7FXLXcjs = require('./UEY7FXLX.cjs');
-
-
-var _RXQBNEFRcjs = require('./RXQBNEFR.cjs');
-
-
-var _2D3DOVVZcjs = require('./2D3DOVVZ.cjs');
-
-
-var _F3SUJGZLcjs = require('./F3SUJGZL.cjs');
-
-
-var _4TYOP5XMcjs = require('./4TYOP5XM.cjs');
-
-// src/LinkButton/LinkButton.tsx
-
-
-var _react = require('react');
-var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
-
-// css-module:./LinkButton.module.css#css-module
-var LinkButton_module_default = { "linkButton": "_linkButton_1qjrb_1", "fitContent": "_fitContent_1qjrb_11" };
-
-// src/LinkButton/LinkButton.tsx
-var _jsxruntime = require('react/jsx-runtime');
-var LinkButton = _react.forwardRef.call(void 0, 
-  ({
-    text,
-    href,
-    target,
-    rel,
-    "data-testid": dataTestId,
-    color = "primary",
-    size = "md",
-    loading = false,
-    fullWidth = false,
-    startIcon: StartIcon,
-    endIcon: EndIcon,
-    on = "lightBackground",
-    onClick
-  }, ref) => {
-    const foregroundColorClass = _RXQBNEFRcjs.foregroundColor.call(void 0, color, on);
-    const backgroundColorClass = _F3SUJGZLcjs.backgroundColor.call(void 0, color, on);
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "a",
-      {
-        href,
-        "data-testid": dataTestId,
-        target,
-        ref,
-        rel,
-        className: _classnames2.default.call(void 0, 
-          LinkButton_module_default.linkButton,
-          _TH4TA3JNcjs.Button_module_default.button,
-          foregroundColorClass,
-          backgroundColorClass,
-          _2D3DOVVZcjs.border.call(void 0, color, on),
-          _TH4TA3JNcjs.Button_module_default[size],
-          {
-            [_TH4TA3JNcjs.Button_module_default.fullWidth]: fullWidth,
-            [LinkButton_module_default.fitContent]: !fullWidth,
-            [_TH4TA3JNcjs.Button_module_default.buttonGap]: size === "lg" || size === "md",
-            [_TH4TA3JNcjs.Button_module_default.disabled]: loading
-          }
-        ),
-        onClick,
-        children: [
-          !loading && StartIcon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            StartIcon,
-            {
-              className: _classnames2.default.call(void 0, 
-                _TH4TA3JNcjs.Button_module_default.icon,
-                _UEY7FXLXcjs.materialIconSize[size],
-                foregroundColorClass
-              ),
-              size: _UEY7FXLXcjs.internalIconSize[size]
-            }
-          ),
-          !loading && text && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _4TYOP5XMcjs.Typography_default, { size: _5JUNB754cjs.textVariant_default[size], weight: "medium", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            "span",
-            {
-              className: foregroundColorClass,
-              children: text
-            }
-          ) }),
-          !loading && EndIcon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            EndIcon,
-            {
-              className: _classnames2.default.call(void 0, 
-                _TH4TA3JNcjs.Button_module_default.icon,
-                _UEY7FXLXcjs.materialIconSize[size],
-                foregroundColorClass
-              ),
-              size: _UEY7FXLXcjs.internalIconSize[size]
-            }
-          ),
-          loading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            "svg",
-            {
-              className: _classnames2.default.call(void 0, _TH4TA3JNcjs.Button_module_default.loading, foregroundColorClass),
-              viewBox: "22 22 44 44",
-              width: _3P2PWHOUcjs.loadingIconSize_default[size],
-              height: _3P2PWHOUcjs.loadingIconSize_default[size],
-              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                "circle",
-                {
-                  className: _TH4TA3JNcjs.Button_module_default.loadingCircle,
-                  cx: "44",
-                  cy: "44",
-                  r: "20.2",
-                  fill: "none",
-                  strokeWidth: "3.6"
-                }
-              )
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-LinkButton.displayName = "LinkButton";
-var LinkButton_default = LinkButton;
-
-
-
-exports.LinkButton_default = LinkButton_default;
-//# sourceMappingURL=4UT6BROB.cjs.map

package/dist/__chunks/4UT6BROB.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/LinkButton/LinkButton.tsx","css-module:./LinkButton.module.css#css-module"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,OAGK;AACP,OAAO,gBAAgB;;;ACL6E,IAAO,4BAAQ,EAAC,cAAa,uBAAsB,cAAa,uBAAsB;;;ADqIpL,SAuBI,KAvBJ;AAvBN,IAAM,aAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,IACT,KAAK;AAAA,IACL;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,eAAa;AAAA,QACb;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT,0BAAO;AAAA,UACP,sBAAa;AAAA,UACb;AAAA,UACA;AAAA,UACA,OAAO,OAAO,EAAE;AAAA,UAChB,sBAAa,IAAI;AAAA,UACjB;AAAA,YACE,CAAC,sBAAa,SAAS,GAAG;AAAA,YAC1B,CAAC,0BAAO,UAAU,GAAG,CAAC;AAAA,YACtB,CAAC,sBAAa,SAAS,GAAG,SAAS,QAAQ,SAAS;AAAA,YACpD,CAAC,sBAAa,QAAQ,GAAG;AAAA,UAC3B;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA,WAAC,WAAW,aACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAiB,IAAI;AAAA,gBACrB;AAAA,cACF;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,CAAC,WAAW,QACX,oBAAC,sBAAW,MAAM,oBAAY,IAAI,GAAG,QAAO,UAC1C;AAAA,YAAC;AAAA;AAAA,cAEC,WAAW;AAAA,cAEV;AAAA;AAAA,UACH,GACF;AAAA,UAED,CAAC,WAAW,WACX;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT,sBAAa;AAAA,gBACb,iBAAiB,IAAI;AAAA,gBACrB;AAAA,cACF;AAAA,cACA,MAAM,iBAAiB,IAAI;AAAA;AAAA,UAC7B;AAAA,UAED,WACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,WAAW,sBAAa,SAAS,oBAAoB;AAAA,cAChE,SAAQ;AAAA,cACR,OAAO,wBAAgB,IAAI;AAAA,cAC3B,QAAQ,wBAAgB,IAAI;AAAA,cAE5B;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAW,sBAAa;AAAA,kBACxB,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAE;AAAA,kBACF,MAAK;AAAA,kBACL,aAAY;AAAA;AAAA,cACd;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AAEzB,IAAO,qBAAQ","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 Typography from \"../Typography/Typography\";\nimport buttonStyles from \"../Button/Button.module.css\";\nimport {\n  materialIconSize,\n  internalIconSize,\n} from \"../Button/constants/iconSize\";\nimport textVariant from \"../Button/constants/textVariant\";\nimport loadingIconSize from \"../Button/constants/loadingIconSize\";\nimport styles from \"./LinkButton.module.css\";\nimport { backgroundColor } from \"../colors//backgroundColor\";\nimport { foregroundColor } from \"../colors/foregroundColor\";\nimport { border } from \"../colors/border\";\nimport type InternalIcon from \"../Icon/Icon\";\n\ntype LinkButtonProps = {\n  /**\n   * Test id for the button\n   */\n  \"data-testid\"?: string;\n  /**\n   * The text to be displayed inside the button\n   */\n  text: string;\n  /**\n   * The link that the LinkButton 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 in a loading state\n   *\n   * @defaultValue false\n   */\n  loading?: boolean;\n  /**\n   * If `true`, the button will take up the full width of its container\n   *\n   * @defaultValue false\n   */\n  fullWidth?: boolean;\n  /**\n   * The icon to be displayed at the start of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  startIcon?:\n    | React.ComponentType<{ className?: string }>\n    | React.ComponentType<ComponentProps<typeof InternalIcon>>;\n  /**\n   * The icon to be displayed at the end of the button. Please use a [Rounded Material Icon](https://material.io/resources/icons/?style=round)\n   */\n  endIcon?:\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   * @defaulValue `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 * [LinkButton](https://cambly-syntax.vercel.app/?path=/docs/components-linkbutton--docs) is a \"variation\" of Button that should look identical to Button, but should be used to render links instead.\n */\nconst LinkButton = forwardRef<HTMLAnchorElement, LinkButtonProps>(\n  (\n    {\n      text,\n      href,\n      target,\n      rel,\n      \"data-testid\": dataTestId,\n      color = \"primary\",\n      size = \"md\",\n      loading = false,\n      fullWidth = false,\n      startIcon: StartIcon,\n      endIcon: EndIcon,\n      on = \"lightBackground\",\n      onClick,\n    }: LinkButtonProps,\n    ref,\n  ) => {\n    const foregroundColorClass = foregroundColor(color, on);\n    const backgroundColorClass = backgroundColor(color, on);\n\n    return (\n      <a\n        href={href}\n        data-testid={dataTestId}\n        target={target}\n        ref={ref}\n        rel={rel}\n        className={classNames(\n          styles.linkButton,\n          buttonStyles.button,\n          foregroundColorClass,\n          backgroundColorClass,\n          border(color, on),\n          buttonStyles[size],\n          {\n            [buttonStyles.fullWidth]: fullWidth,\n            [styles.fitContent]: !fullWidth,\n            [buttonStyles.buttonGap]: size === \"lg\" || size === \"md\",\n            [buttonStyles.disabled]: loading,\n          },\n        )}\n        onClick={onClick}\n      >\n        {!loading && StartIcon && (\n          <StartIcon\n            className={classNames(\n              buttonStyles.icon,\n              materialIconSize[size],\n              foregroundColorClass,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {!loading && text && (\n          <Typography size={textVariant[size]} weight=\"medium\">\n            <span\n              // Temporary - until we have cambio colors on Typogrphay\n              className={foregroundColorClass}\n            >\n              {text}\n            </span>\n          </Typography>\n        )}\n        {!loading && EndIcon && (\n          <EndIcon\n            className={classNames(\n              buttonStyles.icon,\n              materialIconSize[size],\n              foregroundColorClass,\n            )}\n            size={internalIconSize[size]}\n          />\n        )}\n        {loading && (\n          <svg\n            className={classNames(buttonStyles.loading, foregroundColorClass)}\n            viewBox=\"22 22 44 44\"\n            width={loadingIconSize[size]}\n            height={loadingIconSize[size]}\n          >\n            <circle\n              className={buttonStyles.loadingCircle}\n              cx=\"44\"\n              cy=\"44\"\n              r=\"20.2\"\n              fill=\"none\"\n              strokeWidth=\"3.6\"\n            />\n          </svg>\n        )}\n      </a>\n    );\n  },\n);\n\nLinkButton.displayName = \"LinkButton\";\n\nexport default LinkButton;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/LinkButton/LinkButton.module.css\"; export default {\"linkButton\":\"_linkButton_1qjrb_1\",\"fitContent\":\"_fitContent_1qjrb_11\"}"]}