@elliemae/ds-tab-button 3.60.0-next.20

package/dist/cjs/DSTabButton.js

@@ -0,0 +1,106 @@
+"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 DSTabButton_exports = {};
+__export(DSTabButton_exports, {
+  DSTabButton: () => DSTabButton,
+  DSTabButtonWithSchema: () => DSTabButtonWithSchema
+});
+module.exports = __toCommonJS(DSTabButton_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_react_desc_prop_types = require("./react-desc-prop-types.js");
+var import_useTabButton = require("./config/useTabButton.js");
+var import_constants = require("./constants/index.js");
+var import_styles = require("./styles.js");
+const DSTabButton = (props) => {
+  const { propsWithDefault, xstyledProps } = (0, import_useTabButton.useTabButton)(props);
+  const {
+    onClick,
+    onKeyDown,
+    disabled = false,
+    children,
+    isSelected,
+    variant,
+    label,
+    notificationBadge,
+    required,
+    applyAriaDisabled,
+    ...rest
+  } = propsWithDefault;
+  const hasChildren = !!children;
+  const isDisabled = disabled || applyAriaDisabled;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_styles.StyledTabButton,
+    {
+      ...rest,
+      type: "button",
+      "aria-disabled": isDisabled,
+      tabType: variant,
+      disabled,
+      onClick: !isDisabled ? onClick : void 0,
+      onKeyDown: isDisabled ? (e) => {
+        if (e.key === "Enter" || e.key === " ") return;
+        onKeyDown?.(e);
+      } : onKeyDown,
+      ...xstyledProps,
+      getOwnerProps: () => propsWithDefault,
+      getOwnerPropsArguments: () => ({}),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_styles.StyledTypography,
+          {
+            $isSelected: isSelected,
+            $isDisabled: isDisabled,
+            $tabType: variant,
+            variant: "b2",
+            component: "span",
+            getOwnerProps: () => propsWithDefault,
+            getOwnerPropsArguments: () => ({}),
+            children: label
+          }
+        ),
+        notificationBadge || required ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledChildrenWrapper, { getOwnerProps: () => propsWithDefault, getOwnerPropsArguments: () => ({}), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_styles.StyledNotificationBadge,
+          {
+            "aria-hidden": "true",
+            getOwnerProps: () => propsWithDefault,
+            getOwnerPropsArguments: () => ({})
+          }
+        ) }) : null,
+        required ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.ScreenReaderOnly, { getOwnerProps: () => propsWithDefault, getOwnerPropsArguments: () => ({}), children: "Required" }) : null,
+        hasChildren && !notificationBadge ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledChildrenWrapper, { getOwnerProps: () => propsWithDefault, getOwnerPropsArguments: () => ({}), children }) : null
+      ]
+    }
+  );
+};
+DSTabButton.displayName = import_constants.DSTabButtonName;
+const DSTabButtonWithSchema = (0, import_ds_props_helpers.describe)(DSTabButton);
+DSTabButtonWithSchema.propTypes = import_react_desc_prop_types.DSTabButtonPropTypesSchema;
+//# sourceMappingURL=DSTabButton.js.map

package/dist/cjs/DSTabButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/DSTabButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { type DSTabButtonT, DSTabButtonPropTypesSchema } from './react-desc-prop-types.js';\nimport { useTabButton } from './config/useTabButton.js';\nimport { DSTabButtonName } from './constants/index.js';\nimport {\n  StyledChildrenWrapper,\n  StyledNotificationBadge,\n  StyledTabButton,\n  StyledTypography,\n  ScreenReaderOnly,\n} from './styles.js';\n\nconst DSTabButton: React.ComponentType<DSTabButtonT.Props> = (props) => {\n  const { propsWithDefault, xstyledProps } = useTabButton(props);\n\n  const {\n    onClick,\n    onKeyDown,\n    disabled = false,\n    children,\n    isSelected,\n    variant,\n    label,\n    notificationBadge,\n    required,\n    applyAriaDisabled,\n    ...rest\n  } = propsWithDefault;\n  const hasChildren = !!children;\n  const isDisabled = disabled || applyAriaDisabled;\n\n  return (\n    <StyledTabButton\n      {...rest}\n      type=\"button\"\n      aria-disabled={isDisabled}\n      tabType={variant}\n      disabled={disabled}\n      onClick={!isDisabled ? onClick : undefined}\n      onKeyDown={\n        isDisabled\n          ? (e: React.KeyboardEvent<HTMLElement>) => {\n              if (e.key === 'Enter' || e.key === ' ') return;\n              onKeyDown?.(e);\n            }\n          : onKeyDown\n      }\n      {...xstyledProps}\n      getOwnerProps={() => propsWithDefault}\n      getOwnerPropsArguments={() => ({})}\n    >\n      <StyledTypography\n        $isSelected={isSelected}\n        $isDisabled={isDisabled}\n        $tabType={variant}\n        variant=\"b2\"\n        component=\"span\"\n        getOwnerProps={() => propsWithDefault}\n        getOwnerPropsArguments={() => ({})}\n      >\n        {label}\n      </StyledTypography>\n      {notificationBadge || required ? (\n        <StyledChildrenWrapper getOwnerProps={() => propsWithDefault} getOwnerPropsArguments={() => ({})}>\n          <StyledNotificationBadge\n            aria-hidden=\"true\"\n            getOwnerProps={() => propsWithDefault}\n            getOwnerPropsArguments={() => ({})}\n          />\n        </StyledChildrenWrapper>\n      ) : null}\n      {required ? (\n        <ScreenReaderOnly getOwnerProps={() => propsWithDefault} getOwnerPropsArguments={() => ({})}>\n          Required\n        </ScreenReaderOnly>\n      ) : null}\n      {hasChildren && !notificationBadge ? (\n        <StyledChildrenWrapper getOwnerProps={() => propsWithDefault} getOwnerPropsArguments={() => ({})}>\n          {children}\n        </StyledChildrenWrapper>\n      ) : null}\n    </StyledTabButton>\n  );\n};\n\nDSTabButton.displayName = DSTabButtonName;\nconst DSTabButtonWithSchema = describe(DSTabButton);\nDSTabButtonWithSchema.propTypes = DSTabButtonPropTypesSchema;\n\nexport { DSTabButton, DSTabButtonWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiCnB;AAhCJ,8BAAyB;AACzB,mCAA8D;AAC9D,0BAA6B;AAC7B,uBAAgC;AAChC,oBAMO;AAEP,MAAM,cAAuD,CAAC,UAAU;AACtE,QAAM,EAAE,kBAAkB,aAAa,QAAI,kCAAa,KAAK;AAE7D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,cAAc,CAAC,CAAC;AACtB,QAAM,aAAa,YAAY;AAE/B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,iBAAe;AAAA,MACf,SAAS;AAAA,MACT;AAAA,MACA,SAAS,CAAC,aAAa,UAAU;AAAA,MACjC,WACE,aACI,CAAC,MAAwC;AACvC,YAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,IAAK;AACxC,oBAAY,CAAC;AAAA,MACf,IACA;AAAA,MAEL,GAAG;AAAA,MACJ,eAAe,MAAM;AAAA,MACrB,wBAAwB,OAAO,CAAC;AAAA,MAEhC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,aAAa;AAAA,YACb,aAAa;AAAA,YACb,UAAU;AAAA,YACV,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,eAAe,MAAM;AAAA,YACrB,wBAAwB,OAAO,CAAC;AAAA,YAE/B;AAAA;AAAA,QACH;AAAA,QACC,qBAAqB,WACpB,4CAAC,uCAAsB,eAAe,MAAM,kBAAkB,wBAAwB,OAAO,CAAC,IAC5F;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,eAAe,MAAM;AAAA,YACrB,wBAAwB,OAAO,CAAC;AAAA;AAAA,QAClC,GACF,IACE;AAAA,QACH,WACC,4CAAC,kCAAiB,eAAe,MAAM,kBAAkB,wBAAwB,OAAO,CAAC,IAAI,sBAE7F,IACE;AAAA,QACH,eAAe,CAAC,oBACf,4CAAC,uCAAsB,eAAe,MAAM,kBAAkB,wBAAwB,OAAO,CAAC,IAC3F,UACH,IACE;AAAA;AAAA;AAAA,EACN;AAEJ;AAEA,YAAY,cAAc;AAC1B,MAAM,4BAAwB,kCAAS,WAAW;AAClD,sBAAsB,YAAY;",
+  "names": []
+}

package/dist/cjs/config/useTabButton.js

@@ -0,0 +1,60 @@
+"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 useTabButton_exports = {};
+__export(useTabButton_exports, {
+  useTabButton: () => useTabButton
+});
+module.exports = __toCommonJS(useTabButton_exports);
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_uid = require("uid");
+var import_react_desc_prop_types = require("../react-desc-prop-types.js");
+var import_useValidateProps = require("./useValidateProps.js");
+const useTabButton = (propsFromUser) => {
+  const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(propsFromUser, import_react_desc_prop_types.defaultProps);
+  (0, import_useValidateProps.useValidateProps)(propsWithDefault, import_react_desc_prop_types.DSTabButtonPropTypes);
+  const xstyledProps = (0, import_ds_props_helpers.useGetXstyledProps)(propsWithDefault);
+  const instanceUid = import_react.default.useMemo(() => `ds-tab-button-${(0, import_uid.uid)(5)}`, []);
+  return import_react.default.useMemo(
+    () => ({
+      propsWithDefault,
+      xstyledProps,
+      instanceUid
+      // ...eventHandlers,
+    }),
+    [
+      propsWithDefault,
+      xstyledProps,
+      instanceUid
+      // eventHandlers,
+    ]
+  );
+};
+//# sourceMappingURL=useTabButton.js.map

package/dist/cjs/config/useTabButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/config/useTabButton.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { uid } from 'uid';\nimport { type DSTabButtonT, DSTabButtonPropTypes, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport interface TabButtonCTX {\n  propsWithDefault: DSTabButtonT.InternalProps;\n  xstyledProps: ReturnType<typeof useGetXstyledProps>;\n  instanceUid: string;\n}\n\nexport const useTabButton = (propsFromUser: DSTabButtonT.Props) => {\n  // =============================================================================\n  // MERGE WITH DEFAULT AND VALIDATE PROPS\n  // =============================================================================\n  const propsWithDefault = useMemoMergePropsWithDefault<DSTabButtonT.InternalProps>(propsFromUser, defaultProps);\n  useValidateProps(propsWithDefault, DSTabButtonPropTypes);\n  // =============================================================================\n  // XSTYLED PROPS\n  // =============================================================================\n  const xstyledProps = useGetXstyledProps(propsWithDefault);\n  // =============================================================================\n  // AD HOC PER COMPONENT LOGIC\n  // =============================================================================\n  // custom code goes here, this is an example\n  const instanceUid = React.useMemo(() => `ds-tab-button-${uid(5)}`, []);\n  // =============================================================================\n  // HELPERS HOOKS CONFIGS\n  // =============================================================================\n  // const eventHandlers = useEventHandlers({ propsWithDefault, instanceUid }); // <-- complex logic should be made atomics this way\n\n  return React.useMemo(\n    () => ({\n      propsWithDefault,\n      xstyledProps,\n      instanceUid,\n      // ...eventHandlers,\n    }),\n    [\n      propsWithDefault,\n      xstyledProps,\n      instanceUid,\n      // eventHandlers,\n    ],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,8BAAiE;AACjE,iBAAoB;AACpB,mCAAsE;AACtE,8BAAiC;AAQ1B,MAAM,eAAe,CAAC,kBAAsC;AAIjE,QAAM,uBAAmB,sDAAyD,eAAe,yCAAY;AAC7G,gDAAiB,kBAAkB,iDAAoB;AAIvD,QAAM,mBAAe,4CAAmB,gBAAgB;AAKxD,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM,qBAAiB,gBAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAMrE,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,EACF;AACF;",
+  "names": ["React"]
+}

package/dist/cjs/config/useValidateProps.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 useValidateProps_exports = {};
+__export(useValidateProps_exports, {
+  useValidateProps: () => useValidateProps
+});
+module.exports = __toCommonJS(useValidateProps_exports);
+var React = __toESM(require("react"));
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_constants = require("../constants/index.js");
+const useValidateProps = (props, propTypes) => {
+  (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(props, propTypes, import_constants.DSTabButtonName);
+};
+//# sourceMappingURL=useValidateProps.js.map

package/dist/cjs/config/useValidateProps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/config/useValidateProps.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type DSTabButtonT } from '../react-desc-prop-types.js';\nimport { DSTabButtonName } from '../constants/index.js';\n\nexport const useValidateProps = (props: DSTabButtonT.InternalProps, propTypes: ValidationMap<unknown>): void => {\n  // we validate the \"required if\" via 'isRequiredIf from our custom PropTypes\n  useValidateTypescriptPropTypes(props, propTypes, DSTabButtonName);\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA+C;AAG/C,uBAAgC;AAEzB,MAAM,mBAAmB,CAAC,OAAmC,cAA4C;AAE9G,8DAA+B,OAAO,WAAW,gCAAe;AAClE;",
+  "names": []
+}

package/dist/cjs/constants/index.js

@@ -0,0 +1,56 @@
+"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 constants_exports = {};
+__export(constants_exports, {
+  DSTabButtonName: () => DSTabButtonName,
+  TAB_BUTTON_DATA_TESTID: () => TAB_BUTTON_DATA_TESTID,
+  TAB_BUTTON_SLOTS: () => TAB_BUTTON_SLOTS,
+  TAB_TYPES: () => TAB_TYPES,
+  TAB_TYPES_VALUES_AS_ARRAY: () => TAB_TYPES_VALUES_AS_ARRAY
+});
+module.exports = __toCommonJS(constants_exports);
+var React = __toESM(require("react"));
+var import_ds_system = require("@elliemae/ds-system");
+const DSTabButtonName = "DSTabbutton";
+const TAB_TYPES = {
+  PRIMARY: "primary",
+  PRIMARY_SMALL: "primary-small",
+  SECONDARY: "secondary"
+};
+const TAB_TYPES_VALUES_AS_ARRAY = Object.values(TAB_TYPES);
+const TAB_BUTTON_SLOTS = {
+  ROOT: "root",
+  LABEL: "label",
+  REQUIRED_MARK: "required-mark",
+  CHILDREN_WRAPPER: "children-wrapper"
+};
+const TAB_BUTTON_DATA_TESTID = {
+  ...(0, import_ds_system.slotObjectToDataTestIds)(DSTabButtonName, TAB_BUTTON_SLOTS)
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/constants/index.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSTabButtonName = 'DSTabbutton';\n\nexport const TAB_TYPES = {\n  PRIMARY: 'primary',\n  PRIMARY_SMALL: 'primary-small',\n  SECONDARY: 'secondary',\n} as const;\n\nexport const TAB_TYPES_VALUES_AS_ARRAY = Object.values(TAB_TYPES);\n\nexport const TAB_BUTTON_SLOTS = {\n  ROOT: 'root',\n  LABEL: 'label',\n  REQUIRED_MARK: 'required-mark',\n  CHILDREN_WRAPPER: 'children-wrapper',\n} as const;\n\nexport const TAB_BUTTON_DATA_TESTID = {\n  ...slotObjectToDataTestIds(DSTabButtonName, TAB_BUTTON_SLOTS),\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,kBAAkB;AAExB,MAAM,YAAY;AAAA,EACvB,SAAS;AAAA,EACT,eAAe;AAAA,EACf,WAAW;AACb;AAEO,MAAM,4BAA4B,OAAO,OAAO,SAAS;AAEzD,MAAM,mBAAmB;AAAA,EAC9B,MAAM;AAAA,EACN,OAAO;AAAA,EACP,eAAe;AAAA,EACf,kBAAkB;AACpB;AAEO,MAAM,yBAAyB;AAAA,EACpC,OAAG,0CAAwB,iBAAiB,gBAAgB;AAC9D;",
+  "names": []
+}

package/dist/cjs/index.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 index_exports = {};
+__export(index_exports, {
+  DSTabButton: () => import_DSTabButton.DSTabButton,
+  DSTabButtonWithSchema: () => import_DSTabButton.DSTabButtonWithSchema,
+  TAB_BUTTON_DATA_TESTID: () => import_constants.TAB_BUTTON_DATA_TESTID,
+  TAB_BUTTON_SLOTS: () => import_constants.TAB_BUTTON_SLOTS
+});
+module.exports = __toCommonJS(index_exports);
+var React = __toESM(require("react"));
+var import_DSTabButton = require("./DSTabButton.js");
+var import_constants = require("./constants/index.js");
+//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/index.ts", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["// this is a workaround to typescript error TS2742\n// https://github.com/microsoft/TypeScript/issues/47663\nimport type {} from '@xstyled/system';\nexport { DSTabButton, DSTabButtonWithSchema } from './DSTabButton.js';\nexport { type DSTabButtonT } from './react-desc-prop-types.js';\nexport { TAB_BUTTON_SLOTS, TAB_BUTTON_DATA_TESTID } from './constants/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,yBAAmD;AAEnD,uBAAyD;",
+  "names": []
+}

package/dist/cjs/package.json

@@ -0,0 +1,10 @@
+{
+  "type": "commonjs",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "publishConfig": {
+    "access": "public"
+  }
+}

package/dist/cjs/react-desc-prop-types.js

@@ -0,0 +1,57 @@
+"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 react_desc_prop_types_exports = {};
+__export(react_desc_prop_types_exports, {
+  DSTabButtonPropTypes: () => DSTabButtonPropTypes,
+  DSTabButtonPropTypesSchema: () => DSTabButtonPropTypesSchema,
+  defaultProps: () => defaultProps
+});
+module.exports = __toCommonJS(react_desc_prop_types_exports);
+var React = __toESM(require("react"));
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_constants = require("./constants/index.js");
+const defaultProps = {
+  variant: import_constants.TAB_TYPES.PRIMARY,
+  isSelected: false,
+  notificationBadge: false,
+  required: false
+};
+const DSTabButtonPropTypes = {
+  ...(0, import_ds_props_helpers.getPropsPerSlotPropTypes)(import_constants.DSTabButtonName, import_constants.TAB_BUTTON_SLOTS),
+  ...import_ds_props_helpers.globalAttributesPropTypes,
+  ...import_ds_props_helpers.xstyledPropTypes,
+  label: import_ds_props_helpers.PropTypes.string.description("The label of the tab button."),
+  variant: import_ds_props_helpers.PropTypes.oneOf(["primary", "secondary", "primary-small"]).description("The variant of the tab button.").defaultValue("primary"),
+  isSelected: import_ds_props_helpers.PropTypes.bool.description("Indicates if the tab button is currently selected.").defaultValue(false),
+  notificationBadge: import_ds_props_helpers.PropTypes.bool.description("Indicates if the tab button has a notification badge.").defaultValue(false),
+  required: import_ds_props_helpers.PropTypes.bool.description("Indicates if the tab button is required.").defaultValue(false),
+  applyAriaDisabled: import_ds_props_helpers.PropTypes.bool.description("Indicates if the tab button should apply aria-disabled.").defaultValue(false)
+};
+const DSTabButtonPropTypesSchema = DSTabButtonPropTypes;
+//# sourceMappingURL=react-desc-prop-types.js.map

package/dist/cjs/react-desc-prop-types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react-desc-prop-types.ts", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport {\n  PropTypes,\n  getPropsPerSlotPropTypes,\n  globalAttributesPropTypes,\n  xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSTabButtonName, TAB_BUTTON_SLOTS, TAB_TYPES } from './constants/index.js';\n\nexport declare namespace DSTabButtonT {\n  export type TabButtonVariant = (typeof TAB_TYPES)[keyof typeof TAB_TYPES];\n  export interface RequiredProps {\n    label: string;\n  }\n\n  export interface DefaultProps {\n    variant: TabButtonVariant;\n    isSelected: boolean;\n    notificationBadge?: boolean;\n    required?: boolean;\n    applyAriaDisabled?: boolean;\n  }\n\n  export interface OptionalProps\n    extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSTabButtonName, typeof TAB_BUTTON_SLOTS> {\n    className?: string;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps | keyof RequiredProps>,\n      XstyledProps,\n      RequiredProps {}\n\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps | keyof RequiredProps>,\n      XstyledProps,\n      RequiredProps {}\n}\n\nexport const defaultProps: DSTabButtonT.DefaultProps = {\n  variant: TAB_TYPES.PRIMARY,\n  isSelected: false,\n  notificationBadge: false,\n  required: false,\n};\n\nexport const DSTabButtonPropTypes: DSPropTypesSchema<DSTabButtonT.Props> = {\n  ...getPropsPerSlotPropTypes(DSTabButtonName, TAB_BUTTON_SLOTS),\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  label: PropTypes.string.description('The label of the tab button.'),\n  variant: PropTypes.oneOf(['primary', 'secondary', 'primary-small'])\n    .description('The variant of the tab button.')\n    .defaultValue('primary'),\n  isSelected: PropTypes.bool.description('Indicates if the tab button is currently selected.').defaultValue(false),\n  notificationBadge: PropTypes.bool\n    .description('Indicates if the tab button has a notification badge.')\n    .defaultValue(false),\n  required: PropTypes.bool.description('Indicates if the tab button is required.').defaultValue(false),\n  applyAriaDisabled: PropTypes.bool\n    .description('Indicates if the tab button should apply aria-disabled.')\n    .defaultValue(false),\n};\n\nexport const DSTabButtonPropTypesSchema = DSTabButtonPropTypes as unknown as ValidationMap<DSTabButtonT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAKO;AAEP,uBAA6D;AAoCtD,MAAM,eAA0C;AAAA,EACrD,SAAS,2BAAU;AAAA,EACnB,YAAY;AAAA,EACZ,mBAAmB;AAAA,EACnB,UAAU;AACZ;AAEO,MAAM,uBAA8D;AAAA,EACzE,OAAG,kDAAyB,kCAAiB,iCAAgB;AAAA,EAC7D,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAO,kCAAU,OAAO,YAAY,8BAA8B;AAAA,EAClE,SAAS,kCAAU,MAAM,CAAC,WAAW,aAAa,eAAe,CAAC,EAC/D,YAAY,gCAAgC,EAC5C,aAAa,SAAS;AAAA,EACzB,YAAY,kCAAU,KAAK,YAAY,oDAAoD,EAAE,aAAa,KAAK;AAAA,EAC/G,mBAAmB,kCAAU,KAC1B,YAAY,uDAAuD,EACnE,aAAa,KAAK;AAAA,EACrB,UAAU,kCAAU,KAAK,YAAY,0CAA0C,EAAE,aAAa,KAAK;AAAA,EACnG,mBAAmB,kCAAU,KAC1B,YAAY,yDAAyD,EACrE,aAAa,KAAK;AACvB;AAEO,MAAM,6BAA6B;",
+  "names": []
+}

package/dist/cjs/styles.js

@@ -0,0 +1,186 @@
+"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 styles_exports = {};
+__export(styles_exports, {
+  ScreenReaderOnly: () => ScreenReaderOnly,
+  StyledChildrenWrapper: () => StyledChildrenWrapper,
+  StyledNotificationBadge: () => StyledNotificationBadge,
+  StyledTabButton: () => StyledTabButton,
+  StyledTypography: () => StyledTypography
+});
+module.exports = __toCommonJS(styles_exports);
+var React = __toESM(require("react"));
+var import_ds_system = require("@elliemae/ds-system");
+var import_ds_typography = require("@elliemae/ds-typography");
+var import_constants = require("./constants/index.js");
+const borderAroundFocus = import_ds_system.css`
+  &:after {
+    pointer-events: none;
+    display: block;
+    position: absolute;
+    content: '';
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 3;
+    border-radius: 2px;
+    border: 2px solid ${({ theme }) => theme.colors.brand[700]};
+  }
+`;
+const borderAroundFocusUnderline = import_ds_system.css`
+  &:before {
+    position: absolute;
+    content: '';
+    left: -16px;
+    right: 0;
+    top: calc(100% - 2px);
+    transform: none;
+    width: calc(100% + 32px);
+    height: 2px;
+    z-index: 10;
+    background: linear-gradient(
+      to right,
+      transparent 0px,
+      transparent 12px,
+      white 12px,
+      white 16px,
+      transparent 16px,
+      transparent calc(100% - 16px),
+      white calc(100% - 16px),
+      white calc(100% - 12px),
+      transparent calc(100% - 12px),
+      transparent 100%
+    );
+  }
+`;
+const unlineLabelSelected = import_ds_system.css`
+  &:before {
+    pointer-events: none;
+    display: block;
+    content: '';
+    position: absolute;
+    height: 3px;
+    width: calc(100% + var(--border-width) * 2);
+    left: calc(var(--border-width) * -1);
+    bottom: 0;
+    top: initial;
+    z-index: 6;
+    background: ${({ theme }) => theme.colors.brand[700]};
+    border-left: var(--border-width) solid ${({ theme }) => theme.colors.neutral["000"]};
+    border-right: var(--border-width) solid ${({ theme }) => theme.colors.neutral["000"]};
+  }
+`;
+const baseButtonStyles = import_ds_system.css`
+  --border-width: 2px;
+  --height-padding: ${({ tabType }) => tabType === import_constants.TAB_TYPES.PRIMARY_SMALL || tabType === import_constants.TAB_TYPES.SECONDARY ? "2px" : "7px"};
+  --width-padding: 16px;
+  --width-padding-calc: calc(var(--width-padding) * 2);
+
+  position: relative;
+  background-color: transparent;
+  border: none;
+  cursor: pointer;
+  padding: 0 var(--width-padding);
+  margin: 0;
+  transition: 100ms cubic-bezier(0, 0, 0.42, 1);
+  text-transform: ${({ tabType }) => {
+  if (tabType === import_constants.TAB_TYPES.SECONDARY) return "capitalize";
+  return "uppercase";
+}};
+  width: fit-content;
+  display: flex;
+  gap: ${({ notificationBadge }) => notificationBadge ? "2px" : "8px"};
+  white-space: nowrap;
+  color: ${({ theme }) => theme.colors.neutral[700]};
+  ${({ tabType }) => tabType === import_constants.TAB_TYPES.PRIMARY ? `min-height: 32px;` : `min-height: 22px;`}
+
+  &[aria-disabled='true'] {
+    color: ${({ theme }) => theme.colors.neutral[500]};
+    cursor: not-allowed;
+  }
+
+  &:hover:not(disabled) {
+    color: ${({ theme }) => theme.colors.brand[600]};
+  }
+
+  &:focus {
+    outline: none;
+    ${borderAroundFocus}
+    ${({ isActive, tabType }) => tabType !== import_constants.TAB_TYPES.SECONDARY && isActive ? borderAroundFocusUnderline : ``}
+  }
+`;
+const StyledNotificationBadge = (0, import_ds_system.styled)("span", {
+  name: import_constants.DSTabButtonName,
+  slot: import_constants.TAB_BUTTON_SLOTS.REQUIRED_MARK
+})`
+  width: 0.46rem;
+  height: 0.46rem;
+  background-color: ${({ theme }) => theme.colors.danger[900]};
+  border-radius: 50%;
+  display: inline-block;
+  position: absolute;
+  top: 0;
+  right: 0;
+`;
+const StyledTabButton = (0, import_ds_system.styled)("button", {
+  name: import_constants.DSTabButtonName,
+  slot: import_constants.TAB_BUTTON_SLOTS.ROOT
+})`
+  ${baseButtonStyles}
+`;
+const StyledTypography = (0, import_ds_system.styled)(import_ds_typography.DSTypography, {
+  name: import_constants.DSTabButtonName,
+  slot: import_constants.TAB_BUTTON_SLOTS.LABEL
+})`
+  padding: var(--height-padding) 0;
+  position: relative;
+  z-index: 4;
+  white-space: nowrap;
+  ${({ $isSelected, $tabType }) => $isSelected && $tabType !== import_constants.TAB_TYPES.SECONDARY && unlineLabelSelected}
+  ${({ $isSelected }) => $isSelected && `font-weight: 600;`}
+  ${({ $isDisabled, theme }) => $isDisabled && `color: ${theme.colors.neutral[600]};`}
+`;
+const StyledChildrenWrapper = (0, import_ds_system.styled)("span", {
+  name: import_constants.DSTabButtonName,
+  slot: import_constants.TAB_BUTTON_SLOTS.CHILDREN_WRAPPER
+})`
+  margin: var(--height-padding) 0;
+  position: relative;
+`;
+const ScreenReaderOnly = import_ds_system.styled.span`
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+`;
+//# sourceMappingURL=styles.js.map