@elliemae/ds-pills-v2 3.22.0-next.15

package/dist/cjs/DSPillDefinitions.js

@@ -0,0 +1,40 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var DSPillDefinitions_exports = {};
+__export(DSPillDefinitions_exports, {
+  DSPillButtonName: () => DSPillButtonName,
+  DSPillGroupName: () => DSPillGroupName,
+  DSPillName: () => DSPillName
+});
+module.exports = __toCommonJS(DSPillDefinitions_exports);
+var React = __toESM(require("react"));
+const DSPillName = "DSPill";
+const DSPillButtonName = "DSPillButton";
+const DSPillGroupName = "DSPillGroup";
+//# sourceMappingURL=DSPillDefinitions.js.map

package/dist/cjs/DSPillDefinitions.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/DSPillDefinitions.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["export const DSPillName = 'DSPill';\n\nexport const DSPillButtonName = 'DSPillButton';\n\nexport const DSPillGroupName = 'DSPillGroup';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,aAAa;AAEnB,MAAM,mBAAmB;AAEzB,MAAM,kBAAkB;",
+  "names": []
+}

package/dist/cjs/components/Pill.js

@@ -0,0 +1,59 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Pill_exports = {};
+__export(Pill_exports, {
+  DSPillV2: () => DSPillV2,
+  DSPillV2WithSchema: () => DSPillV2WithSchema
+});
+module.exports = __toCommonJS(Pill_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_types = require("./types/index.js");
+var import_DSPillDefinitions = require("../DSPillDefinitions.js");
+var import_react_desc_prop_types = require("../react-desc-prop-types.js");
+const pillComponentGetter = {
+  dropdown: import_types.DropdownPill,
+  input: import_types.InputPill,
+  label: import_types.LabelPill,
+  readonly: import_types.ReadOnlyPill,
+  removable: import_types.RemovablePill,
+  value: import_types.ValuePill
+};
+const DSPillV2 = (props) => {
+  const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.DSPillV2DefaultProps);
+  (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.DSPillV2PropTypesSchema, import_DSPillDefinitions.DSPillName);
+  const { type } = propsWithDefaults;
+  const PillComponent = pillComponentGetter[type];
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PillComponent, { ...propsWithDefaults });
+};
+DSPillV2.displayName = import_DSPillDefinitions.DSPillName;
+const DSPillV2WithSchema = (0, import_ds_props_helpers.describe)(DSPillV2).description("Pill");
+DSPillV2WithSchema.propTypes = import_react_desc_prop_types.DSPillV2PropTypesSchema;
+//# sourceMappingURL=Pill.js.map

package/dist/cjs/components/Pill.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/Pill.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { DropdownPill, LabelPill, ValuePill, InputPill, ReadOnlyPill, RemovablePill } from './types/index.js';\nimport { DSPillName } from '../DSPillDefinitions.js';\nimport { type DSPillT, DSPillV2DefaultProps, DSPillV2PropTypesSchema } from '../react-desc-prop-types.js';\n\nconst pillComponentGetter: Record<string, React.ComponentType<DSPillT.InternalProps>> = {\n  dropdown: DropdownPill,\n  input: InputPill,\n  label: LabelPill,\n  readonly: ReadOnlyPill,\n  removable: RemovablePill,\n  value: ValuePill,\n};\n\nconst DSPillV2: React.ComponentType<DSPillT.Props> = (props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSPillT.InternalProps>(props, DSPillV2DefaultProps);\n  useValidateTypescriptPropTypes(propsWithDefaults, DSPillV2PropTypesSchema, DSPillName);\n  const { type } = propsWithDefaults;\n  const PillComponent = pillComponentGetter[type];\n\n  return <PillComponent {...propsWithDefaults} />;\n};\n\nDSPillV2.displayName = DSPillName;\nconst DSPillV2WithSchema = describe(DSPillV2).description('Pill');\nDSPillV2WithSchema.propTypes = DSPillV2PropTypesSchema;\n\nexport { DSPillV2, DSPillV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsBd;AApBT,8BAAuF;AACvF,mBAA2F;AAC3F,+BAA2B;AAC3B,mCAA4E;AAE5E,MAAM,sBAAkF;AAAA,EACtF,UAAU;AAAA,EACV,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,OAAO;AACT;AAEA,MAAM,WAA+C,CAAC,UAAU;AAC9D,QAAM,wBAAoB,sDAAoD,OAAO,iDAAoB;AACzG,8DAA+B,mBAAmB,sDAAyB,mCAAU;AACrF,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,gBAAgB,oBAAoB,IAAI;AAE9C,SAAO,4CAAC,iBAAe,GAAG,mBAAmB;AAC/C;AAEA,SAAS,cAAc;AACvB,MAAM,yBAAqB,kCAAS,QAAQ,EAAE,YAAY,MAAM;AAChE,mBAAmB,YAAY;",
+  "names": []
+}

package/dist/cjs/components/PillButton.js

@@ -0,0 +1,68 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var PillButton_exports = {};
+__export(PillButton_exports, {
+  DSPillButton: () => DSPillButton,
+  DSPillButtonWithSchema: () => DSPillButtonWithSchema
+});
+module.exports = __toCommonJS(PillButton_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_styled = require("./styled.js");
+var import_DSPillDefinitions = require("../DSPillDefinitions.js");
+var import_react_desc_prop_types = require("../react-desc-prop-types.js");
+const typeToClassName = {
+  only: "ds-pill-button-only",
+  left: "ds-pill-button-left",
+  right: "ds-pill-button-right"
+};
+const DSPillButton = (props) => {
+  const { children, ...restProps } = props;
+  const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(
+    restProps,
+    import_react_desc_prop_types.DSPillButtonDefaultProps
+  );
+  (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.DSPillButtonPropTypesSchema, import_DSPillDefinitions.DSPillButtonName);
+  const { type, ...rest } = propsWithDefaults;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_styled.StyledPillButton,
+    {
+      ...rest,
+      buttonType: "raw",
+      className: `${typeToClassName[type]} ${rest.className ?? ""}`,
+      type: "button",
+      children
+    }
+  );
+};
+DSPillButton.displayName = import_DSPillDefinitions.DSPillButtonName;
+const DSPillButtonWithSchema = (0, import_ds_props_helpers.describe)(DSPillButton).description("Pill button");
+DSPillButtonWithSchema.propTypes = import_react_desc_prop_types.DSPillButtonPropTypesSchema;
+//# sourceMappingURL=PillButton.js.map

package/dist/cjs/components/PillButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/PillButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { StyledPillButton } from './styled.js';\nimport { DSPillButtonName } from '../DSPillDefinitions.js';\nimport { type DSPillT, DSPillButtonDefaultProps, DSPillButtonPropTypesSchema } from '../react-desc-prop-types.js';\n\nconst typeToClassName = {\n  only: 'ds-pill-button-only',\n  left: 'ds-pill-button-left',\n  right: 'ds-pill-button-right',\n};\n\nconst DSPillButton: React.ComponentType<DSPillT.ButtonProps> = (props) => {\n  const { children, ...restProps } = props;\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSPillT.InternalButtonProps>(\n    restProps,\n    DSPillButtonDefaultProps,\n  );\n  useValidateTypescriptPropTypes(propsWithDefaults, DSPillButtonPropTypesSchema, DSPillButtonName);\n  const { type, ...rest } = propsWithDefaults;\n\n  return (\n    <StyledPillButton\n      {...rest}\n      buttonType=\"raw\"\n      className={`${typeToClassName[type]} ${rest.className ?? ''}`}\n      type=\"button\"\n    >\n      {children}\n    </StyledPillButton>\n  );\n};\n\nDSPillButton.displayName = DSPillButtonName;\nconst DSPillButtonWithSchema = describe(DSPillButton).description('Pill button');\nDSPillButtonWithSchema.propTypes = DSPillButtonPropTypesSchema;\n\nexport { DSPillButton, DSPillButtonWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBnB;AArBJ,8BAAuF;AACvF,oBAAiC;AACjC,+BAAiC;AACjC,mCAAoF;AAEpF,MAAM,kBAAkB;AAAA,EACtB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AACT;AAEA,MAAM,eAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,UAAU,GAAG,UAAU,IAAI;AACnC,QAAM,wBAAoB;AAAA,IACxB;AAAA,IACA;AAAA,EACF;AACA,8DAA+B,mBAAmB,0DAA6B,yCAAgB;AAC/F,QAAM,EAAE,MAAM,GAAG,KAAK,IAAI;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,YAAW;AAAA,MACX,WAAW,GAAG,gBAAgB,IAAI,KAAK,KAAK,aAAa;AAAA,MACzD,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,aAAa,cAAc;AAC3B,MAAM,6BAAyB,kCAAS,YAAY,EAAE,YAAY,aAAa;AAC/E,uBAAuB,YAAY;",
+  "names": []
+}

package/dist/cjs/components/PillGroup.js

@@ -0,0 +1,97 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var PillGroup_exports = {};
+__export(PillGroup_exports, {
+  DSPillGroupV2: () => DSPillGroupV2,
+  DSPillGroupV2Context: () => DSPillGroupV2Context,
+  DSPillGroupV2WithSchema: () => DSPillGroupV2WithSchema
+});
+module.exports = __toCommonJS(PillGroup_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_uid = require("uid");
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_styled = require("./styled.js");
+var import_DSPillDefinitions = require("../DSPillDefinitions.js");
+var import_lodash = require("lodash");
+var import_react_desc_prop_types = require("../react-desc-prop-types.js");
+const DSPillGroupV2Context = (0, import_react.createContext)({
+  onKeyboardRemove: () => null,
+  onKeyboardNavigation: () => null
+});
+const DSPillGroupV2 = (props) => {
+  const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.DSPillGroupDefaultProps);
+  (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.DSPillGroupPropTypes, import_DSPillDefinitions.DSPillGroupName);
+  const globalAttrs = (0, import_lodash.omit)((0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefaults), ["rows", "wrap"]);
+  const pillGroupUid = (0, import_react.useMemo)(() => `ds-pill-group-${(0, import_uid.uid)()}`, []);
+  const { children, width, innerRef } = propsWithDefaults;
+  const onKeyboardRemove = (0, import_react.useCallback)(
+    (pillUid) => {
+      const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)];
+      const pillIndex = elems.findIndex((elem) => elem.id === pillUid);
+      if (pillIndex > 0) {
+        elems[pillIndex - 1].focus();
+      } else if (pillIndex + 1 < elems.length) {
+        elems[pillIndex + 1].focus();
+      }
+    },
+    [pillGroupUid]
+  );
+  const onKeyboardNavigation = (0, import_react.useCallback)(
+    (pillUid, step, e) => {
+      const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)];
+      const pillIndex = elems.findIndex((elem) => elem.id === pillUid);
+      if (pillIndex >= 0) {
+        if (elems[pillIndex + step]) {
+          e.stopPropagation();
+          elems[pillIndex + step].focus();
+        }
+      }
+    },
+    [pillGroupUid]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DSPillGroupV2Context.Provider, { value: { onKeyboardRemove, onKeyboardNavigation }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_styled.StyledPillGroup,
+    {
+      ...globalAttrs,
+      width,
+      id: pillGroupUid,
+      cols: import_react.default.Children.map(children, () => "auto"),
+      gutter: "2px",
+      ref: innerRef,
+      children
+    }
+  ) });
+};
+DSPillGroupV2.propTypes = import_react_desc_prop_types.DSPillGroupPropTypes;
+DSPillGroupV2.displayName = import_DSPillDefinitions.DSPillGroupName;
+const DSPillGroupV2WithSchema = (0, import_ds_props_helpers.describe)(DSPillGroupV2);
+DSPillGroupV2WithSchema.propTypes = import_react_desc_prop_types.DSPillGroupPropTypes;
+//# sourceMappingURL=PillGroup.js.map

package/dist/cjs/components/PillGroup.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/PillGroup.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import type { WeakValidationMap } from 'react';\nimport React, { createContext, useCallback, useMemo } from 'react';\nimport { uid } from 'uid';\nimport {\n  describe,\n  useMemoMergePropsWithDefault,\n  useValidateTypescriptPropTypes,\n  useGetGlobalAttributes,\n} from '@elliemae/ds-props-helpers';\nimport { StyledPillGroup } from './styled.js';\nimport { DSPillGroupName } from '../DSPillDefinitions.js';\nimport { omit } from 'lodash';\nimport { DSPillGroupDefaultProps, type DSPillT, DSPillGroupPropTypes } from '../react-desc-prop-types.js';\n\nexport const DSPillGroupV2Context = createContext<{\n  onKeyboardRemove: (pillUid: string) => void;\n  onKeyboardNavigation: (pillUid: string, step: number, e: React.KeyboardEvent) => void;\n}>({\n  onKeyboardRemove: () => null,\n  onKeyboardNavigation: () => null,\n});\n\nconst DSPillGroupV2: React.ComponentType<DSPillT.GroupProps> = (props) => {\n  const propsWithDefaults = useMemoMergePropsWithDefault<DSPillT.InternalGroupProps>(props, DSPillGroupDefaultProps);\n  useValidateTypescriptPropTypes(propsWithDefaults, DSPillGroupPropTypes, DSPillGroupName);\n\n  const globalAttrs = omit(useGetGlobalAttributes(propsWithDefaults), ['rows', 'wrap']);\n  const pillGroupUid = useMemo(() => `ds-pill-group-${uid()}`, []);\n  const { children, width, innerRef } = propsWithDefaults;\n  const onKeyboardRemove = useCallback(\n    (pillUid: string) => {\n      const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)] as HTMLElement[];\n\n      const pillIndex = elems.findIndex((elem) => elem.id === pillUid);\n\n      if (pillIndex > 0) {\n        elems[pillIndex - 1].focus();\n      } else if (pillIndex + 1 < elems.length) {\n        elems[pillIndex + 1].focus();\n      }\n    },\n    [pillGroupUid],\n  );\n  const onKeyboardNavigation = useCallback(\n    (pillUid: string, step: number, e: React.KeyboardEvent) => {\n      const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)] as HTMLElement[];\n\n      const pillIndex = elems.findIndex((elem) => elem.id === pillUid);\n\n      if (pillIndex >= 0) {\n        if (elems[pillIndex + step]) {\n          e.stopPropagation();\n          elems[pillIndex + step].focus();\n        }\n      }\n    },\n    [pillGroupUid],\n  );\n\n  return (\n    <DSPillGroupV2Context.Provider value={{ onKeyboardRemove, onKeyboardNavigation }}>\n      <StyledPillGroup\n        {...globalAttrs}\n        width={width}\n        id={pillGroupUid}\n        cols={React.Children.map(children, () => 'auto') as string[]}\n        gutter=\"2px\"\n        ref={innerRef}\n      >\n        {children}\n      </StyledPillGroup>\n    </DSPillGroupV2Context.Provider>\n  );\n};\n\nDSPillGroupV2.propTypes = DSPillGroupPropTypes as WeakValidationMap<unknown>;\nDSPillGroupV2.displayName = DSPillGroupName;\nconst DSPillGroupV2WithSchema = describe(DSPillGroupV2);\nDSPillGroupV2WithSchema.propTypes = DSPillGroupPropTypes as WeakValidationMap<unknown>;\n\nexport { DSPillGroupV2, DSPillGroupV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6DjB;AA5DN,mBAA2D;AAC3D,iBAAoB;AACpB,8BAKO;AACP,oBAAgC;AAChC,+BAAgC;AAChC,oBAAqB;AACrB,mCAA4E;AAErE,MAAM,2BAAuB,4BAGjC;AAAA,EACD,kBAAkB,MAAM;AAAA,EACxB,sBAAsB,MAAM;AAC9B,CAAC;AAED,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,wBAAoB,sDAAyD,OAAO,oDAAuB;AACjH,8DAA+B,mBAAmB,mDAAsB,wCAAe;AAEvF,QAAM,kBAAc,wBAAK,gDAAuB,iBAAiB,GAAG,CAAC,QAAQ,MAAM,CAAC;AACpF,QAAM,mBAAe,sBAAQ,MAAM,qBAAiB,gBAAI,KAAK,CAAC,CAAC;AAC/D,QAAM,EAAE,UAAU,OAAO,SAAS,IAAI;AACtC,QAAM,uBAAmB;AAAA,IACvB,CAAC,YAAoB;AACnB,YAAM,QAAQ,CAAC,GAAG,SAAS,iBAAiB,IAAI,mCAAmC,CAAC;AAEpF,YAAM,YAAY,MAAM,UAAU,CAAC,SAAS,KAAK,OAAO,OAAO;AAE/D,UAAI,YAAY,GAAG;AACjB,cAAM,YAAY,CAAC,EAAE,MAAM;AAAA,MAC7B,WAAW,YAAY,IAAI,MAAM,QAAQ;AACvC,cAAM,YAAY,CAAC,EAAE,MAAM;AAAA,MAC7B;AAAA,IACF;AAAA,IACA,CAAC,YAAY;AAAA,EACf;AACA,QAAM,2BAAuB;AAAA,IAC3B,CAAC,SAAiB,MAAc,MAA2B;AACzD,YAAM,QAAQ,CAAC,GAAG,SAAS,iBAAiB,IAAI,mCAAmC,CAAC;AAEpF,YAAM,YAAY,MAAM,UAAU,CAAC,SAAS,KAAK,OAAO,OAAO;AAE/D,UAAI,aAAa,GAAG;AAClB,YAAI,MAAM,YAAY,IAAI,GAAG;AAC3B,YAAE,gBAAgB;AAClB,gBAAM,YAAY,IAAI,EAAE,MAAM;AAAA,QAChC;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,YAAY;AAAA,EACf;AAEA,SACE,4CAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,kBAAkB,qBAAqB,GAC7E;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,IAAI;AAAA,MACJ,MAAM,aAAAA,QAAM,SAAS,IAAI,UAAU,MAAM,MAAM;AAAA,MAC/C,QAAO;AAAA,MACP,KAAK;AAAA,MAEJ;AAAA;AAAA,EACH,GACF;AAEJ;AAEA,cAAc,YAAY;AAC1B,cAAc,cAAc;AAC5B,MAAM,8BAA0B,kCAAS,aAAa;AACtD,wBAAwB,YAAY;",
+  "names": ["React"]
+}

package/dist/cjs/components/index.js

@@ -0,0 +1,32 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var components_exports = {};
+module.exports = __toCommonJS(components_exports);
+var React = __toESM(require("react"));
+__reExport(components_exports, require("./Pill.js"), module.exports);
+__reExport(components_exports, require("./PillGroup.js"), module.exports);
+__reExport(components_exports, require("./PillButton.js"), module.exports);
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["export * from './Pill.js';\nexport * from './PillGroup.js';\nexport * from './PillButton.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAc,sBAAd;AACA,+BAAc,2BADd;AAEA,+BAAc,4BAFd;",
+  "names": []
+}

package/dist/cjs/components/styled.js

@@ -0,0 +1,246 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var styled_exports = {};
+__export(styled_exports, {
+  StyledDropdownPillWrapper: () => StyledDropdownPillWrapper,
+  StyledInputPillWrapper: () => StyledInputPillWrapper,
+  StyledLabelPillWrapper: () => StyledLabelPillWrapper,
+  StyledPillButton: () => StyledPillButton,
+  StyledPillGroup: () => StyledPillGroup,
+  StyledReadonlyPillWrapper: () => StyledReadonlyPillWrapper,
+  StyledRemovablePillWrapper: () => StyledRemovablePillWrapper,
+  StyledSpanWithTooltip: () => StyledSpanWithTooltip,
+  StyledValuePillWrapper: () => StyledValuePillWrapper
+});
+module.exports = __toCommonJS(styled_exports);
+var React = __toESM(require("react"));
+var import_ds_system = require("@elliemae/ds-system");
+var import_ds_grid = require("@elliemae/ds-grid");
+var import_ds_button_v2 = require("@elliemae/ds-button-v2");
+const borderOutside = ({
+  color,
+  size = 1,
+  zIndex = 0,
+  borderRadius = "12px"
+}) => import_ds_system.css`
+  :after {
+    content: ' ';
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    right: 0px;
+    bottom: 0px;
+    border: ${size}px solid ${({ disabled, theme }) => disabled ? theme.colors.neutral[400] : color};
+    border-top-left-radius: ${borderRadius};
+    border-top-right-radius: ${borderRadius};
+    border-bottom-left-radius: ${borderRadius};
+    border-bottom-right-radius: ${borderRadius};
+    pointer-events: none;
+    z-index: ${zIndex ? zIndex : ""};
+  }
+`;
+const commonPillWrapperCss = import_ds_system.css`
+  height: ${(props) => props?.pillSize === "m" ? "24px" : "18px"};
+
+  position: relative;
+
+  width: fit-content;
+
+  background-color: ${({ theme, disabled }) => disabled ? theme.colors.neutral["080"] : theme.colors.brand[200]};
+
+  outline: none;
+
+  white-space: nowrap;
+
+  padding: 0px 12px 0 12px;
+  border-radius: 12px;
+
+  font-size: 13px;
+  line-height: 1;
+  user-select: ${({ disabled }) => disabled ? "none" : "auto"};
+  cursor: ${({ disabled }) => disabled ? "not-allowed" : "default"};
+  color: ${({ theme, disabled }) => disabled ? theme.colors.neutral["400"] : theme.colors.brand["800"]};
+  ${(props) => borderOutside({ color: props.theme.colors.brand[300] })};
+`;
+const StyledLabelPillWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  ${commonPillWrapperCss}
+
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+  padding-left: ${(props) => props.hasIcon ? "0px !important" : "12px"};
+`;
+const StyledValuePillWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  ${commonPillWrapperCss}
+
+  font-weight: ${(props) => props.theme.fontWeights.regular};
+  padding-left: ${(props) => props.hasIcon ? "0px !important" : "12px"};
+`;
+const StyledInputPillWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  ${commonPillWrapperCss}
+
+  background: ${(props) => props.theme.colors.neutral["000"]};
+  padding: 0;
+
+  ${({ theme, hasError }) => {
+  if (hasError)
+    return borderOutside({ color: theme.colors.danger[900] });
+  return borderOutside({ color: theme.colors.brand[500] });
+}}
+
+  :focus-within {
+    ${(props) => props.inputHasFocus ? borderOutside({ color: props.theme.colors.brand[700], size: 2 }) : ""}
+  }
+
+  :active {
+    ${(props) => props.inputHasFocus ? borderOutside({ color: props.theme.colors.brand[500] }) : ""}
+  }
+
+  & .em-ds-input {
+    outline: none !important;
+    border: none !important;
+    box-shadow: none !important;
+    border-radius: 0 !important;
+    height: 100%;
+    background: transparent;
+    width: ${(props) => `${props.inputWidth + (props.value === "" ? 24 : 0)}px`};
+    padding: 0;
+    margin: 0 0 0 8px;
+  }
+
+  & .em-ds-input__tooltip-ref {
+    height: 100%;
+  }
+`;
+const StyledDropdownPillWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  ${commonPillWrapperCss}
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+
+  padding: 0 0 0 12px;
+`;
+const StyledReadonlyPillWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  ${commonPillWrapperCss}
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+  padding-right: ${(props) => props.hasIconRight ? "0 !important" : "12px"};
+  padding-left: ${(props) => props.hasIconLeft ? "0 !important" : "12px"};
+`;
+const StyledRemovablePillWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  ${commonPillWrapperCss}
+  font-weight: ${(props) => props.theme.fontWeights.regular};
+  padding: 0 0 0 12px;
+`;
+const StyledPillGroup = (0, import_ds_system.styled)(import_ds_grid.Grid)`
+  width: ${({ width }) => width};
+
+  // Pill edges
+  & .ds-pill-wrapper {
+    &:not(:first-of-type) {
+      &,
+      :after,
+      :before,
+      .ds-pill-tooltip-value:after {
+        border-top-left-radius: 0px;
+        border-bottom-left-radius: 0px;
+      }
+    }
+    &:not(:last-of-type) {
+      &,
+      :after,
+      :before,
+      .ds-pill-tooltip-value:after {
+        border-top-right-radius: 0px;
+        border-bottom-right-radius: 0px;
+      }
+    }
+  }
+
+  // Pill paddings to the left / right
+  & .ds-pill-wrapper-label,
+  & .ds-pill-wrapper-value,
+  & .ds-pill-wrapper-readonly {
+    &:not(:first-of-type) {
+      padding-left: 8px;
+    }
+    &:not(:last-of-type) {
+      padding-right: 8px;
+    }
+  }
+
+  & .ds-pill-wrapper-removable:not(:first-of-type) {
+    padding-left: 8px;
+  }
+
+  & .ds-pill-wrapper-dropdown:not(:first-of-type) {
+    padding-left: 8px;
+  }
+
+  & .ds-pill-wrapper {
+    :not(:first-of-type) {
+      .ds-pill-button-left {
+        border-radius: 0px;
+      }
+      .ds-pill-button-only {
+        border-top-left-radius: 0px;
+        border-bottom-left-radius: 0px;
+      }
+    }
+    :not(:last-of-type) {
+      .ds-pill-button-right {
+        border-radius: 0px;
+      }
+      .ds-pill-button-only {
+        border-top-right-radius: 0px;
+        border-bottom-right-radius: 0px;
+      }
+    }
+  }
+`;
+const StyledSpanWithTooltip = import_ds_system.styled.span`
+  outline: none;
+  :focus {
+    ${(props) => borderOutside({ color: props.theme.colors.brand[700], size: 2, zIndex: 3 })}
+  }
+`;
+const StyledPillButton = (0, import_ds_system.styled)(import_ds_button_v2.DSButtonV2)`
+  display: grid;
+  place-items: center;
+
+  position: relative;
+
+  padding: 0;
+  width: ${(props) => props.width};
+  height: ${(props) => props.height};
+
+  border-radius: 12px;
+
+  :focus {
+    ${(props) => borderOutside({ color: props.theme.colors.brand[700], size: 2, zIndex: 1, borderRadius: "inherit" })}
+  }
+
+  cursor: pointer;
+`;
+//# sourceMappingURL=styled.js.map

package/dist/cjs/components/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport { css, styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\n\ninterface InputPillWrapperProps {\n  value: string;\n  inputWidth: number;\n  inputHasFocus: boolean;\n  hasError: boolean;\n  pillSize: 'm' | 's';\n  disabled?: boolean;\n}\n\n// =============================================================================\n// Common CSS\n// =============================================================================\n\nconst borderOutside = ({\n  color,\n  size = 1,\n  zIndex = 0,\n  borderRadius = '12px',\n}: {\n  color: string;\n  size?: number;\n  zIndex?: number;\n  borderRadius?: string;\n}) => css<{ disabled?: boolean }>`\n  :after {\n    content: ' ';\n    position: absolute;\n    top: 0px;\n    left: 0px;\n    right: 0px;\n    bottom: 0px;\n    border: ${size}px solid ${({ disabled, theme }) => (disabled ? theme.colors.neutral[400] : color)};\n    border-top-left-radius: ${borderRadius};\n    border-top-right-radius: ${borderRadius};\n    border-bottom-left-radius: ${borderRadius};\n    border-bottom-right-radius: ${borderRadius};\n    pointer-events: none;\n    z-index: ${zIndex ? zIndex : ''};\n  }\n`;\n\nconst commonPillWrapperCss = css<{ pillSize: 'm' | 's'; disabled?: boolean }>`\n  height: ${(props) => (props?.pillSize === 'm' ? '24px' : '18px')};\n\n  position: relative;\n\n  width: fit-content;\n\n  background-color: ${({ theme, disabled }) => (disabled ? theme.colors.neutral['080'] : theme.colors.brand[200])};\n\n  outline: none;\n\n  white-space: nowrap;\n\n  padding: 0px 12px 0 12px;\n  border-radius: 12px;\n\n  font-size: 13px;\n  line-height: 1;\n  user-select: ${({ disabled }) => (disabled ? 'none' : 'auto')};\n  cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'default')};\n  color: ${({ theme, disabled }) => (disabled ? theme.colors.neutral['400'] : theme.colors.brand['800'])};\n  ${(props) => borderOutside({ color: props.theme.colors.brand[300] })};\n`;\n\n// =============================================================================\n// Pills wrappers\n// =============================================================================\n\nexport const StyledLabelPillWrapper = styled(Grid)<{ pillSize: 'm' | 's'; hasIcon: boolean }>`\n  ${commonPillWrapperCss}\n\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding-left: ${(props) => (props.hasIcon ? '0px !important' : '12px')};\n`;\n\nexport const StyledValuePillWrapper = styled(Grid)<{ pillSize: 'm' | 's'; hasIcon: boolean }>`\n  ${commonPillWrapperCss}\n\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n  padding-left: ${(props) => (props.hasIcon ? '0px !important' : '12px')};\n`;\n\nexport const StyledInputPillWrapper = styled(Grid)<InputPillWrapperProps>`\n  ${commonPillWrapperCss}\n\n  background: ${(props) => props.theme.colors.neutral['000']};\n  padding: 0;\n\n  ${({ theme, hasError }) => {\n    if (hasError) return borderOutside({ color: theme.colors.danger[900] });\n    return borderOutside({ color: theme.colors.brand[500] });\n  }}\n\n  :focus-within {\n    ${(props) => (props.inputHasFocus ? borderOutside({ color: props.theme.colors.brand[700], size: 2 }) : '')}\n  }\n\n  :active {\n    ${(props) => (props.inputHasFocus ? borderOutside({ color: props.theme.colors.brand[500] }) : '')}\n  }\n\n  & .em-ds-input {\n    outline: none !important;\n    border: none !important;\n    box-shadow: none !important;\n    border-radius: 0 !important;\n    height: 100%;\n    background: transparent;\n    width: ${(props) => `${props.inputWidth + (props.value === '' ? 24 : 0)}px`};\n    padding: 0;\n    margin: 0 0 0 8px;\n  }\n\n  & .em-ds-input__tooltip-ref {\n    height: 100%;\n  }\n`;\n\nexport const StyledDropdownPillWrapper = styled(Grid)<{ pillSize: 'm' | 's' }>`\n  ${commonPillWrapperCss}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n\n  padding: 0 0 0 12px;\n`;\n\nexport const StyledReadonlyPillWrapper = styled(Grid)<{\n  pillSize: 'm' | 's';\n  hasIconRight: boolean;\n  hasIconLeft: boolean;\n  disabled?: boolean;\n}>`\n  ${commonPillWrapperCss}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding-right: ${(props) => (props.hasIconRight ? '0 !important' : '12px')};\n  padding-left: ${(props) => (props.hasIconLeft ? '0 !important' : '12px')};\n`;\n\nexport const StyledRemovablePillWrapper = styled(Grid)<{ pillSize: 'm' | 's' }>`\n  ${commonPillWrapperCss}\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n  padding: 0 0 0 12px;\n`;\n\n// =============================================================================\n// Pill group\n// =============================================================================\n\nexport const StyledPillGroup = styled(Grid)`\n  width: ${({ width }) => width};\n\n  // Pill edges\n  & .ds-pill-wrapper {\n    &:not(:first-of-type) {\n      &,\n      :after,\n      :before,\n      .ds-pill-tooltip-value:after {\n        border-top-left-radius: 0px;\n        border-bottom-left-radius: 0px;\n      }\n    }\n    &:not(:last-of-type) {\n      &,\n      :after,\n      :before,\n      .ds-pill-tooltip-value:after {\n        border-top-right-radius: 0px;\n        border-bottom-right-radius: 0px;\n      }\n    }\n  }\n\n  // Pill paddings to the left / right\n  & .ds-pill-wrapper-label,\n  & .ds-pill-wrapper-value,\n  & .ds-pill-wrapper-readonly {\n    &:not(:first-of-type) {\n      padding-left: 8px;\n    }\n    &:not(:last-of-type) {\n      padding-right: 8px;\n    }\n  }\n\n  & .ds-pill-wrapper-removable:not(:first-of-type) {\n    padding-left: 8px;\n  }\n\n  & .ds-pill-wrapper-dropdown:not(:first-of-type) {\n    padding-left: 8px;\n  }\n\n  & .ds-pill-wrapper {\n    :not(:first-of-type) {\n      .ds-pill-button-left {\n        border-radius: 0px;\n      }\n      .ds-pill-button-only {\n        border-top-left-radius: 0px;\n        border-bottom-left-radius: 0px;\n      }\n    }\n    :not(:last-of-type) {\n      .ds-pill-button-right {\n        border-radius: 0px;\n      }\n      .ds-pill-button-only {\n        border-top-right-radius: 0px;\n        border-bottom-right-radius: 0px;\n      }\n    }\n  }\n`;\n\n// =============================================================================\n// Extra stuff\n// =============================================================================\n\nexport const StyledSpanWithTooltip = styled.span`\n  outline: none;\n  :focus {\n    ${(props) => borderOutside({ color: props.theme.colors.brand[700], size: 2, zIndex: 3 })}\n  }\n`;\n\nexport const StyledPillButton = styled(DSButtonV2)<{ width: string; height: string }>`\n  display: grid;\n  place-items: center;\n\n  position: relative;\n\n  padding: 0;\n  width: ${(props) => props.width};\n  height: ${(props) => props.height};\n\n  border-radius: 12px;\n\n  :focus {\n    ${(props) => borderOutside({ color: props.theme.colors.brand[700], size: 2, zIndex: 1, borderRadius: 'inherit' })}\n  }\n\n  cursor: pointer;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
+  "names": []
+}