@snack-uikit/card 0.12.42 → 0.12.43-preview-ba12ca94.0

package/dist/cjs/components/Card/Card.js

@@ -0,0 +1,114 @@
+"use strict";
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Card = Card;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = require("react");
+const typography_1 = require("@snack-uikit/typography");
+const utils_1 = require("@snack-uikit/utils");
+const constants_1 = require("../../constants");
+const context_1 = require("../../context");
+const helperComponents_1 = require("../../helperComponents");
+const constants_2 = require("./constants");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function Card(_a) {
+  var {
+      onClick,
+      disabled = false,
+      checked,
+      outline,
+      multipleSelection = false,
+      size = constants_1.SIZE.M,
+      children,
+      header,
+      footer,
+      functionBadge,
+      promoBadge,
+      image,
+      className,
+      href
+    } = _a,
+    rest = __rest(_a, ["onClick", "disabled", "checked", "outline", "multipleSelection", "size", "children", "header", "footer", "functionBadge", "promoBadge", "image", "className", "href"]);
+  const localDivRef = (0, react_1.useRef)(null);
+  const localAnchorRef = (0, react_1.useRef)(null);
+  const onKeyDown = (0, react_1.useCallback)(e => {
+    var _a, _b;
+    if (e.target === localDivRef.current) {
+      if (constants_2.TRIGGER_CLICK_KEY_CODES.includes(e.code) || e.key === ' ') {
+        href ? (_a = localAnchorRef.current) === null || _a === void 0 ? void 0 : _a.click() : (_b = localDivRef.current) === null || _b === void 0 ? void 0 : _b.click();
+      }
+    }
+  }, [href]);
+  const supportProps = (0, utils_1.extractSupportProps)(rest);
+  return (0, jsx_runtime_1.jsx)(context_1.CardContext.Provider, {
+    value: {
+      size,
+      disabled
+    },
+    children: (0, jsx_runtime_1.jsxs)("div", Object.assign({
+      ref: localDivRef,
+      className: (0, classnames_1.default)(styles_module_scss_1.default.card, className)
+    }, supportProps, {
+      onClick: onClick,
+      "data-disabled": disabled || undefined,
+      "data-checked": checked || undefined,
+      "data-outline": outline || undefined,
+      "data-pointer": onClick ? true : undefined,
+      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
+      tabIndex: 0,
+      onKeyDown: onKeyDown,
+      children: [image, (0, jsx_runtime_1.jsxs)("div", {
+        className: styles_module_scss_1.default.composition,
+        tabIndex: -1,
+        children: [href && (0, jsx_runtime_1.jsx)("a", {
+          ref: localAnchorRef,
+          "data-test-id": constants_1.TEST_IDS.anchor,
+          tabIndex: -1,
+          href: href,
+          className: styles_module_scss_1.default.anchor,
+          "aria-label": supportProps['aria-label']
+        }), !disabled && functionBadge && (0, jsx_runtime_1.jsx)(helperComponents_1.FunctionBadgeWrapper, {
+          className: styles_module_scss_1.default.functionBadgeWrapper,
+          children: functionBadge
+        }), (0, jsx_runtime_1.jsx)("div", {
+          className: styles_module_scss_1.default.contentWrapper,
+          children: (0, jsx_runtime_1.jsxs)("div", {
+            className: styles_module_scss_1.default.content,
+            "data-size": size,
+            children: [header || null, children && (0, jsx_runtime_1.jsx)(typography_1.Typography, {
+              family: 'sans',
+              size: size,
+              purpose: 'body',
+              className: styles_module_scss_1.default.body,
+              tag: 'div',
+              children: children
+            }), footer && (0, jsx_runtime_1.jsx)("div", {
+              className: styles_module_scss_1.default.footer,
+              children: footer
+            })]
+          })
+        }), promoBadge && (0, jsx_runtime_1.jsx)(helperComponents_1.PromoBadge, Object.assign({}, typeof promoBadge === 'string' ? {
+          text: promoBadge
+        } : promoBadge))]
+      }), checked && multipleSelection && (0, jsx_runtime_1.jsx)(helperComponents_1.Check, {
+        className: styles_module_scss_1.default.check
+      })]
+    }))
+  });
+}

package/dist/cjs/components/Card/constants.js

@@ -0,0 +1,7 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TRIGGER_CLICK_KEY_CODES = void 0;
+exports.TRIGGER_CLICK_KEY_CODES = ['Enter', 'Space'];

package/dist/cjs/components/Card/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./Card"), exports);

package/dist/cjs/components/Footer/components/Action/Action.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FooterAction = FooterAction;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const button_1 = require("@snack-uikit/button");
+const utils_1 = require("@snack-uikit/utils");
+const context_1 = require("../../../../context");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function FooterAction(_a) {
+  var {
+      button,
+      secondaryButton,
+      className
+    } = _a,
+    rest = __rest(_a, ["button", "secondaryButton", "className"]);
+  const {
+    disabled
+  } = (0, context_1.useCardContext)();
+  return (0, jsx_runtime_1.jsxs)("div", Object.assign({
+    className: (0, classnames_1.default)(styles_module_scss_1.default.action, className)
+  }, (0, utils_1.excludeSupportProps)(rest), {
+    children: [(0, jsx_runtime_1.jsx)(button_1.ButtonFilled, Object.assign({}, button, {
+      appearance: 'primary',
+      size: 'm',
+      disabled: disabled
+    })), secondaryButton && (0, jsx_runtime_1.jsx)(button_1.ButtonTonal, Object.assign({}, secondaryButton, {
+      appearance: 'neutral',
+      size: 'm',
+      disabled: disabled
+    }))]
+  }));
+}

package/dist/cjs/components/Footer/components/Action/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./Action"), exports);

package/dist/cjs/components/Footer/components/CallToAction/CallToAction.js

@@ -0,0 +1,43 @@
+"use strict";
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FooterCallToAction = FooterCallToAction;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const typography_1 = require("@snack-uikit/typography");
+const utils_1 = require("@snack-uikit/utils");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function FooterCallToAction(_a) {
+  var {
+      label,
+      icon,
+      className
+    } = _a,
+    rest = __rest(_a, ["label", "icon", "className"]);
+  return (0, jsx_runtime_1.jsxs)("div", Object.assign({
+    className: (0, classnames_1.default)(styles_module_scss_1.default.callToAction, className)
+  }, (0, utils_1.excludeSupportProps)(rest), {
+    children: [(0, jsx_runtime_1.jsx)(typography_1.Typography.SansLabelL, {
+      className: styles_module_scss_1.default.label,
+      children: label
+    }), (0, jsx_runtime_1.jsx)("span", {
+      className: styles_module_scss_1.default.icon,
+      children: icon
+    })]
+  }));
+}

package/dist/cjs/components/Footer/components/CallToAction/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./CallToAction"), exports);

package/dist/cjs/components/Footer/components/Dimension/Dimension.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Dimension = Dimension;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const typography_1 = require("@snack-uikit/typography");
+const context_1 = require("../../../../context");
+const constants_1 = require("./constants");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function Dimension(_ref) {
+  let {
+    dimension,
+    currentValue,
+    oldValue,
+    size: sizeProp
+  } = _ref;
+  const {
+    size: sizeContext
+  } = (0, context_1.useCardContext)();
+  const size = constants_1.TYPOGRAPHY_SIZE_MAP[sizeProp || sizeContext];
+  return (0, jsx_runtime_1.jsxs)("div", {
+    className: styles_module_scss_1.default.wrapper,
+    children: [dimension && (0, jsx_runtime_1.jsx)(typography_1.Typography, {
+      purpose: 'title',
+      family: 'sans',
+      size: size,
+      className: styles_module_scss_1.default.dimension,
+      children: dimension
+    }), (0, jsx_runtime_1.jsxs)("div", {
+      className: styles_module_scss_1.default.valueContainer,
+      children: [(0, jsx_runtime_1.jsx)(typography_1.Typography, {
+        purpose: 'title',
+        family: 'sans',
+        size: size,
+        className: styles_module_scss_1.default.currentValue,
+        children: currentValue
+      }), oldValue && (0, jsx_runtime_1.jsx)(typography_1.Typography.CrossedOutBodyS, {
+        className: styles_module_scss_1.default.oldValue,
+        children: oldValue
+      })]
+    })]
+  });
+}

package/dist/cjs/components/Footer/components/Dimension/constants.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TYPOGRAPHY_SIZE_MAP = void 0;
+const constants_1 = require("../../../../constants");
+exports.TYPOGRAPHY_SIZE_MAP = {
+  [constants_1.SIZE.S]: 'm',
+  [constants_1.SIZE.M]: 'm',
+  [constants_1.SIZE.L]: 'l'
+};

package/dist/cjs/components/Footer/components/Dimension/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./Dimension"), exports);

package/dist/cjs/components/Footer/components/Promo/Promo.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FooterPromo = FooterPromo;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const button_1 = require("@snack-uikit/button");
+const utils_1 = require("@snack-uikit/utils");
+const context_1 = require("../../../../context");
+const Dimension_1 = require("../Dimension");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function FooterPromo(_a) {
+  var {
+      volume,
+      button,
+      className,
+      size
+    } = _a,
+    rest = __rest(_a, ["volume", "button", "className", "size"]);
+  const {
+    disabled
+  } = (0, context_1.useCardContext)();
+  return (0, jsx_runtime_1.jsxs)("div", Object.assign({
+    className: (0, classnames_1.default)(styles_module_scss_1.default.promo, className)
+  }, (0, utils_1.excludeSupportProps)(rest), {
+    children: [button && (0, jsx_runtime_1.jsx)(button_1.ButtonFilled, Object.assign({}, button, {
+      appearance: 'primary',
+      size: 'm',
+      disabled: disabled
+    })), volume && (0, jsx_runtime_1.jsx)(Dimension_1.Dimension, Object.assign({}, volume, {
+      size: size
+    }))]
+  }));
+}

package/dist/cjs/components/Footer/components/Promo/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./Promo"), exports);

package/dist/cjs/components/Footer/components/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./Promo"), exports);
+__exportStar(require("./Action"), exports);
+__exportStar(require("./CallToAction"), exports);

package/dist/cjs/components/Footer/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Footer = void 0;
+const components_1 = require("./components");
+exports.Footer = {
+  Promo: components_1.FooterPromo,
+  Action: components_1.FooterAction,
+  CallToAction: components_1.FooterCallToAction
+};

package/dist/cjs/components/FunctionBadge/FunctionBadge.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FunctionBadge = FunctionBadge;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const icons_1 = require("@snack-uikit/icons");
+const list_1 = require("@snack-uikit/list");
+const tag_1 = require("@snack-uikit/tag");
+const utils_1 = require("@snack-uikit/utils");
+const constants_1 = require("../../constants");
+const context_1 = require("../../context");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function FunctionBadge(_ref) {
+  let {
+    icon,
+    options
+  } = _ref;
+  const [isOpen, setIsOpen] = (0, react_1.useState)(false);
+  const buttonRef = (0, react_1.useRef)(null);
+  const {
+    setVisible
+  } = (0, react_1.useContext)(context_1.FunctionBadgeContext);
+  (0, utils_1.useLayoutEffect)(() => {
+    setVisible && setVisible(isOpen);
+  }, [isOpen, setVisible]);
+  const onClick = (0, react_1.useCallback)(e => {
+    e.stopPropagation();
+    setIsOpen(isOpen => !isOpen);
+  }, []);
+  return (0, jsx_runtime_1.jsx)("span", {
+    className: styles_module_scss_1.default.wrapper,
+    children: (0, jsx_runtime_1.jsx)(list_1.Droplist, {
+      trigger: 'clickAndFocusVisible',
+      open: isOpen,
+      onOpenChange: setIsOpen,
+      widthStrategy: 'gte',
+      scroll: true,
+      "data-test-id": constants_1.TEST_IDS.droplist,
+      placement: 'bottom-end',
+      triggerElemRef: buttonRef,
+      items: options.map(_a => {
+        var {
+            icon,
+            tagLabel,
+            onClick
+          } = _a,
+          item = __rest(_a, ["icon", "tagLabel", "onClick"]);
+        return Object.assign(Object.assign({}, item), {
+          className: styles_module_scss_1.default.item,
+          beforeContent: icon,
+          afterContent: tagLabel ? (0, jsx_runtime_1.jsx)(tag_1.Tag, {
+            label: tagLabel
+          }) : undefined,
+          onClick: e => {
+            e.stopPropagation();
+            setIsOpen(false);
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+          }
+        });
+      }),
+      children: (0, jsx_runtime_1.jsx)("button", {
+        type: 'button',
+        "data-test-id": constants_1.TEST_IDS.functionBadge,
+        className: styles_module_scss_1.default.button,
+        onClick: onClick,
+        ref: buttonRef,
+        children: icon || (0, jsx_runtime_1.jsx)(icons_1.KebabSVG, {})
+      })
+    })
+  });
+}

package/dist/cjs/components/FunctionBadge/constants.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TRIGGER_CLOSE_DROPLIST_KEY_CODES = exports.TRIGGER_OPEN_DROPLIST_KEY_KEYS = void 0;
+exports.TRIGGER_OPEN_DROPLIST_KEY_KEYS = [' ',
+// <- Space key
+'ArrowDown'];
+exports.TRIGGER_CLOSE_DROPLIST_KEY_CODES = ['Escape', 'Tab'];

package/dist/cjs/components/FunctionBadge/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./FunctionBadge"), exports);