@elliemae/ds-form-toggle 3.70.0-next.42 → 3.70.0-next.44

package/dist/cjs/ControlledToggle.js

@@ -1,127 +0,0 @@
-"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 ControlledToggle_exports = {};
-__export(ControlledToggle_exports, {
-  DSControlledToggle: () => DSControlledToggle,
-  DSControlledToggleWithSchema: () => DSControlledToggleWithSchema
-});
-module.exports = __toCommonJS(ControlledToggle_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_useDSControlledToggle = require("./config/useDSControlledToggle.js");
-var import_constants = require("./constants/index.js");
-var import_react_desc_prop_types = require("./react-desc-prop-types.js");
-var import_styles = require("./styles.js");
-const DSControlledToggle = (props) => {
-  const { propsWithDefault, xstyledProps, width, handleRefOnLabelWidth, handleRefOffLabelWidth, buttonProps } = (0, import_useDSControlledToggle.useDSControlledToggle)(props);
-  const {
-    wcagViolationLabelOn,
-    wcagViolationLabelOff,
-    checked,
-    size,
-    containerProps,
-    disabled,
-    applyAriaDisabled,
-    readOnly
-  } = propsWithDefault;
-  const { getOwnerProps, getOwnerPropsArguments } = (0, import_ds_props_helpers.useOwnerProps)(propsWithDefault);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_styles.StyledContainer,
-    {
-      $size: size,
-      "data-testid": import_constants.CONTROLLED_TOGGLE_DATA_TESTID.CONTROLLED_CONTAINER,
-      ...containerProps,
-      ...xstyledProps,
-      disabled,
-      getOwnerProps,
-      getOwnerPropsArguments,
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-        import_styles.StyledButton,
-        {
-          ...readOnly ? { "aria-readonly": "true" } : {},
-          ...buttonProps,
-          getOwnerProps,
-          getOwnerPropsArguments,
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              import_styles.StyledRadiusShape,
-              {
-                $size: size,
-                $width: width,
-                getOwnerProps,
-                getOwnerPropsArguments,
-                children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-                  import_styles.StyledButtonContentWrapper,
-                  {
-                    $checked: checked,
-                    $size: size,
-                    $readOnly: readOnly,
-                    $disabled: disabled,
-                    $applyAriaDisabled: applyAriaDisabled,
-                    getOwnerProps,
-                    getOwnerPropsArguments,
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                        import_styles.StyledCircle,
-                        {
-                          $size: size,
-                          $readOnly: readOnly,
-                          $applyAriaDisabled: applyAriaDisabled,
-                          getOwnerProps,
-                          getOwnerPropsArguments
-                        }
-                      ),
-                      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                        import_styles.StyledTextWrapper,
-                        {
-                          $size: size,
-                          $disabled: disabled,
-                          getOwnerProps,
-                          getOwnerPropsArguments,
-                          children: checked ? wcagViolationLabelOn ?? "ON" : wcagViolationLabelOff ?? "OFF"
-                        }
-                      )
-                    ]
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.SetLabelWidth, { $size: size, innerRef: handleRefOnLabelWidth, "aria-hidden": "true", children: wcagViolationLabelOn ?? "ON" }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.SetLabelWidth, { $size: size, innerRef: handleRefOffLabelWidth, "aria-hidden": "true", children: wcagViolationLabelOff ?? "OFF" })
-          ]
-        }
-      )
-    }
-  );
-};
-DSControlledToggle.displayName = import_constants.DSControlledToggleName;
-const DSControlledToggleWithSchema = (0, import_ds_props_helpers.describe)(DSControlledToggle);
-DSControlledToggleWithSchema.propTypes = import_react_desc_prop_types.DSControlledTogglePropTypesSchema;
-//# sourceMappingURL=ControlledToggle.js.map

package/dist/cjs/ControlledToggle.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/ControlledToggle.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { describe, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport React from 'react';\nimport { useDSControlledToggle } from './config/useDSControlledToggle.js';\nimport { CONTROLLED_TOGGLE_DATA_TESTID, DSControlledToggleName } from './constants/index.js';\nimport { DSControlledTogglePropTypesSchema, type DSControlledToggleT } from './react-desc-prop-types.js';\nimport {\n  SetLabelWidth,\n  StyledButton,\n  StyledButtonContentWrapper,\n  StyledCircle,\n  StyledContainer,\n  StyledRadiusShape,\n  StyledTextWrapper,\n} from './styles.js';\n\nconst DSControlledToggle: React.ComponentType<DSControlledToggleT.Props> = (props) => {\n  const { propsWithDefault, xstyledProps, width, handleRefOnLabelWidth, handleRefOffLabelWidth, buttonProps } =\n    useDSControlledToggle(props);\n  const {\n    wcagViolationLabelOn,\n    wcagViolationLabelOff,\n    checked,\n    size,\n    containerProps,\n    disabled,\n    applyAriaDisabled,\n    readOnly,\n  } = propsWithDefault;\n  const { getOwnerProps, getOwnerPropsArguments } = useOwnerProps(propsWithDefault);\n\n  return (\n    <StyledContainer\n      $size={size}\n      data-testid={CONTROLLED_TOGGLE_DATA_TESTID.CONTROLLED_CONTAINER}\n      {...containerProps}\n      {...xstyledProps}\n      disabled={disabled}\n      getOwnerProps={getOwnerProps}\n      getOwnerPropsArguments={getOwnerPropsArguments}\n    >\n      <StyledButton\n        // as per morning meeting, juan said \"readOnly\" in toggle should receive aria-readonly, aria-readonly is valid for switch role, the html readonly attribute is not\n        {...(readOnly ? { 'aria-readonly': 'true' } : {})}\n        {...buttonProps}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      >\n        <StyledRadiusShape\n          $size={size}\n          $width={width}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        >\n          <StyledButtonContentWrapper\n            $checked={checked}\n            $size={size}\n            $readOnly={readOnly}\n            $disabled={disabled}\n            $applyAriaDisabled={applyAriaDisabled}\n            getOwnerProps={getOwnerProps}\n            getOwnerPropsArguments={getOwnerPropsArguments}\n          >\n            <StyledCircle\n              $size={size}\n              $readOnly={readOnly}\n              $applyAriaDisabled={applyAriaDisabled}\n              getOwnerProps={getOwnerProps}\n              getOwnerPropsArguments={getOwnerPropsArguments}\n            />\n            <StyledTextWrapper\n              $size={size}\n              $disabled={disabled}\n              getOwnerProps={getOwnerProps}\n              getOwnerPropsArguments={getOwnerPropsArguments}\n            >\n              {checked ? (wcagViolationLabelOn ?? 'ON') : (wcagViolationLabelOff ?? 'OFF')}\n            </StyledTextWrapper>\n          </StyledButtonContentWrapper>\n        </StyledRadiusShape>\n        <SetLabelWidth $size={size} innerRef={handleRefOnLabelWidth} aria-hidden=\"true\">\n          {wcagViolationLabelOn ?? 'ON'}\n        </SetLabelWidth>\n        <SetLabelWidth $size={size} innerRef={handleRefOffLabelWidth} aria-hidden=\"true\">\n          {wcagViolationLabelOff ?? 'OFF'}\n        </SetLabelWidth>\n      </StyledButton>\n    </StyledContainer>\n  );\n};\n\nDSControlledToggle.displayName = DSControlledToggleName;\nconst DSControlledToggleWithSchema = describe(DSControlledToggle);\nDSControlledToggleWithSchema.propTypes = DSControlledTogglePropTypesSchema;\n\nexport { DSControlledToggle, DSControlledToggleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqDb;AArDV,8BAAwC;AAExC,mCAAsC;AACtC,uBAAsE;AACtE,mCAA4E;AAC5E,oBAQO;AAEP,MAAM,qBAAqE,CAAC,UAAU;AACpF,QAAM,EAAE,kBAAkB,cAAc,OAAO,uBAAuB,wBAAwB,YAAY,QACxG,oDAAsB,KAAK;AAC7B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,eAAe,uBAAuB,QAAI,uCAAc,gBAAgB;AAEhF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,eAAa,+CAA8B;AAAA,MAC1C,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UAEE,GAAI,WAAW,EAAE,iBAAiB,OAAO,IAAI,CAAC;AAAA,UAC9C,GAAG;AAAA,UACJ;AAAA,UACA;AAAA,UAEA;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR;AAAA,gBACA;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,UAAU;AAAA,oBACV,OAAO;AAAA,oBACP,WAAW;AAAA,oBACX,WAAW;AAAA,oBACX,oBAAoB;AAAA,oBACpB;AAAA,oBACA;AAAA,oBAEA;AAAA;AAAA,wBAAC;AAAA;AAAA,0BACC,OAAO;AAAA,0BACP,WAAW;AAAA,0BACX,oBAAoB;AAAA,0BACpB;AAAA,0BACA;AAAA;AAAA,sBACF;AAAA,sBACA;AAAA,wBAAC;AAAA;AAAA,0BACC,OAAO;AAAA,0BACP,WAAW;AAAA,0BACX;AAAA,0BACA;AAAA,0BAEC,oBAAW,wBAAwB,OAAS,yBAAyB;AAAA;AAAA,sBACxE;AAAA;AAAA;AAAA,gBACF;AAAA;AAAA,YACF;AAAA,YACA,4CAAC,+BAAc,OAAO,MAAM,UAAU,uBAAuB,eAAY,QACtE,kCAAwB,MAC3B;AAAA,YACA,4CAAC,+BAAc,OAAO,MAAM,UAAU,wBAAwB,eAAY,QACvE,mCAAyB,OAC5B;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,mBAAmB,cAAc;AACjC,MAAM,mCAA+B,kCAAS,kBAAkB;AAChE,6BAA6B,YAAY;",
-  "names": []
-}

package/dist/cjs/styles.js

@@ -1,154 +0,0 @@
-"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, {
-  SetLabelWidth: () => SetLabelWidth,
-  StyledButton: () => StyledButton,
-  StyledButtonContentWrapper: () => StyledButtonContentWrapper,
-  StyledCircle: () => StyledCircle,
-  StyledContainer: () => StyledContainer,
-  StyledRadiusShape: () => StyledRadiusShape,
-  StyledTextWrapper: () => StyledTextWrapper
-});
-module.exports = __toCommonJS(styles_exports);
-var React = __toESM(require("react"));
-var import_ds_system = require("@elliemae/ds-system");
-var import_ds_button_v2 = require("@elliemae/ds-button-v2");
-var import_constants = require("./constants/index.js");
-var import_styleHelpers = require("./utils/styleHelpers.js");
-const focusBorders = import_ds_system.css`
-  &:focus-within {
-    &:after {
-      content: '';
-      top: -3px;
-      right: -3px;
-      bottom: -3px;
-      left: -3px;
-      border: 2px solid ${({ theme }) => theme.colors.brand["700"]};
-      border-radius: 20px;
-      position: absolute;
-    }
-  }
-`;
-const hoverStyled = import_ds_system.css`
-  background-color: ${({ $checked, theme }) => {
-  if ($checked) return theme.colors.brand["800"];
-  return theme.colors.neutral["600"];
-}};
-
-  border-color: ${({ $checked, theme }) => {
-  if ($checked) return theme.colors.brand["800"];
-  return theme.colors.neutral["700"];
-}};
-`;
-const StyledContainer = (0, import_ds_system.styled)("div", {
-  name: import_constants.DSControlledToggleName,
-  slot: import_constants.CONTROLLED_TOGGLE_SLOTS.CONTROLLED_CONTAINER
-})`
-  display: inline-flex;
-  width: fit-content;
-  justify-content: center;
-  align-items: center;
-  height: ${({ $size }) => import_styleHelpers.containerHeight[$size]};
-  border-radius: ${({ $size }) => import_styleHelpers.borderRadius[$size]};
-  outline: none;
-  position: relative;
-  z-index: 0;
-  border: 2px solid transparent;
-  ${({ disabled }) => !disabled && focusBorders};
-  ${import_ds_system.xStyledCommonProps}
-`;
-const StyledRadiusShape = (0, import_ds_system.styled)("div", {
-  name: import_constants.DSControlledToggleName,
-  slot: import_constants.CONTROLLED_TOGGLE_SLOTS.CONTAINER_WITH_RADIUS_SHAPE
-})`
-  width: ${({ $width, $size }) => $width ? `calc(${$width}px + ${import_styleHelpers.margin[$size]})` : "auto"};
-  height: ${({ $size }) => import_styleHelpers.labelHeight[$size]};
-  z-index: 2;
-  outline: none;
-  border-radius: ${({ $size }) => import_styleHelpers.labelHeight[$size]};
-`;
-const StyledButtonContentWrapper = (0, import_ds_system.styled)("div", {
-  name: import_constants.DSControlledToggleName,
-  slot: import_constants.CONTROLLED_TOGGLE_SLOTS.BUTTON_CONTENT_WRAPPER
-})`
-  display: flex;
-  margin: 0;
-  padding: 0;
-  align-items: center;
-  height: 100%;
-  flex-direction: ${({ $checked }) => $checked ? "row-reverse" : "row"};
-  border-radius: ${({ $size }) => `calc(${import_styleHelpers.labelHeight[$size]} - 4px)`};
-  border: ${(props) => props.$size === "s" ? `1px solid ${(0, import_styleHelpers.getInterpolatedBorderDsToggleColorByProps)(props)}` : `
-    2px solid ${(0, import_styleHelpers.getInterpolatedBorderDsToggleColorByProps)(props)}
-    `};
-  transition: background-color 0.2s;
-  background-color: ${import_styleHelpers.getInterpolatedBgDsToggleColorByProps};
-  &:hover {
-    cursor: ${({ $disabled, $applyAriaDisabled, $readOnly }) => (0, import_styleHelpers.handleCursors)($disabled, $applyAriaDisabled, $readOnly)};
-    ${({ $disabled, $applyAriaDisabled, $readOnly }) => !$disabled && !$applyAriaDisabled && !$readOnly && hoverStyled}
-  }
-`;
-const StyledCircle = (0, import_ds_system.styled)("div", {
-  name: import_constants.DSControlledToggleName,
-  slot: import_constants.CONTROLLED_TOGGLE_SLOTS.CIRCLE
-})`
-  height: ${({ $size }) => import_styleHelpers.circleValues[$size]};
-  width: ${({ $size }) => import_styleHelpers.circleValues[$size]};
-  border-radius: 50%;
-  background-color: ${({ theme, $readOnly, $applyAriaDisabled }) => $readOnly || $applyAriaDisabled ? theme.colors.neutral[100] : theme.colors.neutral["000"]};
-`;
-const StyledTextWrapper = (0, import_ds_system.styled)("div", {
-  name: import_constants.DSControlledToggleName,
-  slot: import_constants.CONTROLLED_TOGGLE_SLOTS.TEXT_WRAPPER
-})`
-  flex-grow: 1;
-  line-height: ${({ theme, $size }) => (0, import_styleHelpers.handleFontSize)($size, theme)};
-  font-size: ${({ theme, $size }) => (0, import_styleHelpers.handleFontSize)($size, theme)};
-  font-weight: ${({ theme }) => theme.fontWeights.semibold};
-  color: ${({ theme, $disabled }) => $disabled ? "#5c6574" : theme.colors.neutral["000"]};
-`;
-const StyledButton = (0, import_ds_system.styled)(import_ds_button_v2.DSButtonV3, {
-  name: import_constants.DSControlledToggleName,
-  slot: import_constants.CONTROLLED_TOGGLE_SLOTS.TOGGLE_CHECKBOX
-})`
-  margin: 0;
-  padding: 0;
-  z-index: 20;
-  border-radius: 20px;
-`;
-const SetLabelWidth = import_ds_system.styled.div`
-  font-size: ${({ theme, $size }) => (0, import_styleHelpers.handleFontSize)($size, theme)};
-  font-weight: ${({ theme }) => theme.fontWeights.semibold};
-  width: auto;
-  position: absolute;
-  white-space: nowrap;
-  visibility: hidden;
-`;
-//# sourceMappingURL=styles.js.map

package/dist/cjs/styles.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/styles.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport type { DSControlledToggleT } from './react-desc-prop-types.js';\nimport { DSControlledToggleName, CONTROLLED_TOGGLE_SLOTS } from './constants/index.js';\nimport {\n  containerHeight,\n  borderRadius,\n  labelHeight,\n  getInterpolatedBorderDsToggleColorByProps,\n  getInterpolatedBgDsToggleColorByProps,\n  circleValues,\n  handleFontSize,\n  margin,\n  handleCursors,\n} from './utils/styleHelpers.js';\n\nconst focusBorders = css`\n  &:focus-within {\n    &:after {\n      content: '';\n      top: -3px;\n      right: -3px;\n      bottom: -3px;\n      left: -3px;\n      border: 2px solid ${({ theme }) => theme.colors.brand['700']};\n      border-radius: 20px;\n      position: absolute;\n    }\n  }\n`;\n\nconst hoverStyled = css<{ $checked: boolean }>`\n  background-color: ${({ $checked, theme }) => {\n    if ($checked) return theme.colors.brand['800'];\n    return theme.colors.neutral['600'];\n  }};\n\n  border-color: ${({ $checked, theme }) => {\n    if ($checked) return theme.colors.brand['800'];\n    return theme.colors.neutral['700'];\n  }};\n`;\n\ninterface StyledContainerT {\n  $size: DSControlledToggleT.ToggleSize;\n  disabled: boolean;\n}\nexport const StyledContainer = styled('div', {\n  name: DSControlledToggleName,\n  slot: CONTROLLED_TOGGLE_SLOTS.CONTROLLED_CONTAINER,\n})<StyledContainerT>`\n  display: inline-flex;\n  width: fit-content;\n  justify-content: center;\n  align-items: center;\n  height: ${({ $size }) => containerHeight[$size]};\n  border-radius: ${({ $size }) => borderRadius[$size]};\n  outline: none;\n  position: relative;\n  z-index: 0;\n  border: 2px solid transparent;\n  ${({ disabled }) => !disabled && focusBorders};\n  ${xStyledCommonProps}\n`;\ninterface StyledRadiusShapeT {\n  $width: number;\n  $size: DSControlledToggleT.ToggleSize;\n}\nexport const StyledRadiusShape = styled('div', {\n  name: DSControlledToggleName,\n  slot: CONTROLLED_TOGGLE_SLOTS.CONTAINER_WITH_RADIUS_SHAPE,\n})<StyledRadiusShapeT>`\n  width: ${({ $width, $size }) => ($width ? `calc(${$width}px + ${margin[$size]})` : 'auto')};\n  height: ${({ $size }) => labelHeight[$size]};\n  z-index: 2;\n  outline: none;\n  border-radius: ${({ $size }) => labelHeight[$size]};\n`;\n\ninterface StyledButtonContentWrapperT {\n  $checked: boolean;\n  $size: DSControlledToggleT.ToggleSize;\n  $disabled: boolean;\n  $applyAriaDisabled: boolean;\n  $readOnly: boolean;\n}\nexport const StyledButtonContentWrapper = styled('div', {\n  name: DSControlledToggleName,\n  slot: CONTROLLED_TOGGLE_SLOTS.BUTTON_CONTENT_WRAPPER,\n})<StyledButtonContentWrapperT>`\n  display: flex;\n  margin: 0;\n  padding: 0;\n  align-items: center;\n  height: 100%;\n  flex-direction: ${({ $checked }) => ($checked ? 'row-reverse' : 'row')};\n  border-radius: ${({ $size }) => `calc(${labelHeight[$size]} - 4px)`};\n  border: ${(props) =>\n    props.$size === 's'\n      ? `1px solid ${getInterpolatedBorderDsToggleColorByProps(props)}`\n      : `\n    2px solid ${getInterpolatedBorderDsToggleColorByProps(props)}\n    `};\n  transition: background-color 0.2s;\n  background-color: ${getInterpolatedBgDsToggleColorByProps};\n  &:hover {\n    cursor: ${({ $disabled, $applyAriaDisabled, $readOnly }) =>\n      handleCursors($disabled, $applyAriaDisabled, $readOnly)};\n    ${({ $disabled, $applyAriaDisabled, $readOnly }) => !$disabled && !$applyAriaDisabled && !$readOnly && hoverStyled}\n  }\n`;\n\ninterface StyledCircleT {\n  $size: DSControlledToggleT.ToggleSize;\n  $readOnly: boolean;\n  $applyAriaDisabled: boolean;\n}\nexport const StyledCircle = styled('div', {\n  name: DSControlledToggleName,\n  slot: CONTROLLED_TOGGLE_SLOTS.CIRCLE,\n})<StyledCircleT>`\n  height: ${({ $size }) => circleValues[$size]};\n  width: ${({ $size }) => circleValues[$size]};\n  border-radius: 50%;\n  background-color: ${({ theme, $readOnly, $applyAriaDisabled }) =>\n    $readOnly || $applyAriaDisabled ? theme.colors.neutral[100] : theme.colors.neutral['000']};\n`;\n\ninterface StyledTextWrapperT {\n  $size: DSControlledToggleT.ToggleSize;\n  $disabled: boolean;\n}\nexport const StyledTextWrapper = styled('div', {\n  name: DSControlledToggleName,\n  slot: CONTROLLED_TOGGLE_SLOTS.TEXT_WRAPPER,\n})<StyledTextWrapperT>`\n  flex-grow: 1;\n  line-height: ${({ theme, $size }) => handleFontSize($size, theme)};\n  font-size: ${({ theme, $size }) => handleFontSize($size, theme)};\n  font-weight: ${({ theme }) => theme.fontWeights.semibold};\n  color: ${({ theme, $disabled }) => ($disabled ? '#5c6574' : theme.colors.neutral['000'])};\n`;\n\nexport const StyledButton = styled(DSButtonV3, {\n  name: DSControlledToggleName,\n  slot: CONTROLLED_TOGGLE_SLOTS.TOGGLE_CHECKBOX,\n})`\n  margin: 0;\n  padding: 0;\n  z-index: 20;\n  border-radius: 20px;\n`;\n\ninterface SetLabelWidthT {\n  $size: DSControlledToggleT.ToggleSize;\n}\n/**\n * This should not be required, we are doing this to keep the wcagViolationLabelOn/wcagViolationLabelOff working\n *   this calculates the width of the widest custom label and sets the width of both labels to that width to avoid layout shift on toggle\n *\n * ---\n *\n * this can be safely removed in favor of a sensible default min-width for the accessible ON/OFF labels when we can actually kill the wcagViolationLabelOn/wcagViolationLabelOff props\n */\nexport const SetLabelWidth = styled.div<SetLabelWidthT>`\n  font-size: ${({ theme, $size }) => handleFontSize($size, theme)};\n  font-weight: ${({ theme }) => theme.fontWeights.semibold};\n  width: auto;\n  position: absolute;\n  white-space: nowrap;\n  visibility: hidden;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist/cjs/utils/styleHelpers.js

@@ -1,116 +0,0 @@
-"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 styleHelpers_exports = {};
-__export(styleHelpers_exports, {
-  borderRadius: () => borderRadius,
-  circleValues: () => circleValues,
-  containerHeight: () => containerHeight,
-  getInterpolatedBgDsToggleColorByProps: () => getInterpolatedBgDsToggleColorByProps,
-  getInterpolatedBorderDsToggleColorByProps: () => getInterpolatedBorderDsToggleColorByProps,
-  handleCursors: () => handleCursors,
-  handleFontSize: () => handleFontSize,
-  labelHeight: () => labelHeight,
-  margin: () => margin
-});
-module.exports = __toCommonJS(styleHelpers_exports);
-var React = __toESM(require("react"));
-var import_ds_system = require("@elliemae/ds-system");
-const getStyleState = ({
-  $checked,
-  $disabled,
-  $applyAriaDisabled,
-  $readOnly
-}) => {
-  if ($disabled) return "disabled";
-  if ($applyAriaDisabled) return "applyAriaDisabled";
-  if ($readOnly) return "readOnly";
-  if ($checked) return "checked";
-  return "unchecked";
-};
-const circleValues = {
-  s: "14px",
-  m: "20px",
-  l: "28px"
-};
-const margin = {
-  s: "26px",
-  m: "34px",
-  l: "42px"
-};
-const containerHeight = {
-  s: "20px",
-  m: "28px",
-  l: "36px"
-};
-const labelHeight = {
-  s: "16px",
-  m: "24px",
-  l: "32px"
-};
-const borderRadius = {
-  s: "16px",
-  m: "20px",
-  l: "22px"
-};
-const handleFontSize = (size, { fontSizes }) => {
-  switch (size) {
-    case "s":
-      return fontSizes.microText[200];
-    case "l":
-      return "20px";
-    case "m":
-    default:
-      return "15px";
-  }
-};
-const bgColorsMap = {
-  disabled: "neutral-100",
-  applyAriaDisabled: "neutral-500",
-  readOnly: "neutral-500",
-  checked: "brand-600",
-  unchecked: "neutral-500"
-};
-const getInterpolatedBgDSToggleColor = (styleState, props) => import_ds_system.th.color(bgColorsMap[styleState])(props);
-const getInterpolatedBgDsToggleColorByProps = (props) => getInterpolatedBgDSToggleColor(getStyleState(props), props);
-const borderColorsMap = {
-  disabled: "neutral-300",
-  applyAriaDisabled: "neutral-500",
-  readOnly: "neutral-500",
-  checked: "brand-700",
-  unchecked: "neutral-600"
-};
-const getInterpolatedBorderDSToggleColor = (styleState, props) => import_ds_system.th.color(borderColorsMap[styleState])(props);
-const getInterpolatedBorderDsToggleColorByProps = (props) => getInterpolatedBorderDSToggleColor(getStyleState(props), props);
-const handleCursors = (disabled, applyAriaDisabled, readOnly) => {
-  if (disabled) return "not-allowed";
-  if (applyAriaDisabled) return "default";
-  if (readOnly) return "default";
-  return "pointer";
-};
-//# sourceMappingURL=styleHelpers.js.map

package/dist/cjs/utils/styleHelpers.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/utils/styleHelpers.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { th, type PropsWithTheme } from '@elliemae/ds-system';\nimport type { DSControlledToggleT } from '../react-desc-prop-types.js';\n\ntype StyleStateT = 'disabled' | 'applyAriaDisabled' | 'readOnly' | 'checked' | 'unchecked';\n\nconst getStyleState = ({\n  $checked,\n  $disabled,\n  $applyAriaDisabled,\n  $readOnly,\n}: PropsWithTheme<{\n  $checked: boolean;\n  $disabled: boolean;\n  $applyAriaDisabled: boolean;\n  $readOnly: boolean;\n}>): StyleStateT => {\n  if ($disabled) return 'disabled';\n  if ($applyAriaDisabled) return 'applyAriaDisabled';\n  if ($readOnly) return 'readOnly';\n  if ($checked) return 'checked';\n  return 'unchecked';\n};\n\nexport const circleValues = {\n  s: '14px',\n  m: '20px',\n  l: '28px',\n};\n\nexport const margin = {\n  s: '26px',\n  m: '34px',\n  l: '42px',\n};\n\nexport const containerHeight = {\n  s: '20px',\n  m: '28px',\n  l: '36px',\n};\n\nexport const labelHeight = {\n  s: '16px',\n  m: '24px',\n  l: '32px',\n};\n\nexport const borderRadius = {\n  s: '16px',\n  m: '20px',\n  l: '22px',\n};\n\nexport const handleFontSize = (\n  size: DSControlledToggleT.ToggleSize,\n  { fontSizes }: PropsWithTheme['theme'],\n): string => {\n  switch (size) {\n    case 's':\n      return fontSizes.microText[200];\n    case 'l':\n      return '20px';\n    case 'm':\n    default:\n      return '15px';\n  }\n};\n\nconst bgColorsMap = {\n  disabled: 'neutral-100',\n  applyAriaDisabled: 'neutral-500',\n  readOnly: 'neutral-500',\n  checked: 'brand-600',\n  unchecked: 'neutral-500',\n} as const;\n\nconst getInterpolatedBgDSToggleColor = (styleState: StyleStateT, props: PropsWithTheme) =>\n  th.color(bgColorsMap[styleState])(props);\n\nexport const getInterpolatedBgDsToggleColorByProps = (\n  props: PropsWithTheme<{\n    $checked: boolean;\n    $disabled: boolean;\n    $applyAriaDisabled: boolean;\n    $readOnly: boolean;\n  }>,\n) => getInterpolatedBgDSToggleColor(getStyleState(props), props);\n\nconst borderColorsMap = {\n  disabled: 'neutral-300',\n  applyAriaDisabled: 'neutral-500',\n  readOnly: 'neutral-500',\n  checked: 'brand-700',\n  unchecked: 'neutral-600',\n} as const;\n\nconst getInterpolatedBorderDSToggleColor = (styleState: StyleStateT, props: PropsWithTheme) =>\n  th.color(borderColorsMap[styleState])(props);\n\nexport const getInterpolatedBorderDsToggleColorByProps = (\n  props: PropsWithTheme<{\n    $checked: boolean;\n    $disabled: boolean;\n    $applyAriaDisabled: boolean;\n    $readOnly: boolean;\n  }>,\n) => getInterpolatedBorderDSToggleColor(getStyleState(props), props);\n\nexport const handleCursors = (disabled: boolean, applyAriaDisabled: boolean, readOnly: boolean): string => {\n  if (disabled) return 'not-allowed';\n  if (applyAriaDisabled) return 'default';\n  if (readOnly) return 'default';\n  return 'pointer';\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAKxC,MAAM,gBAAgB,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAKoB;AAClB,MAAI,UAAW,QAAO;AACtB,MAAI,mBAAoB,QAAO;AAC/B,MAAI,UAAW,QAAO;AACtB,MAAI,SAAU,QAAO;AACrB,SAAO;AACT;AAEO,MAAM,eAAe;AAAA,EAC1B,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,SAAS;AAAA,EACpB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,kBAAkB;AAAA,EAC7B,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,cAAc;AAAA,EACzB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,eAAe;AAAA,EAC1B,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,iBAAiB,CAC5B,MACA,EAAE,UAAU,MACD;AACX,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,aAAO,UAAU,UAAU,GAAG;AAAA,IAChC,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,MAAM,cAAc;AAAA,EAClB,UAAU;AAAA,EACV,mBAAmB;AAAA,EACnB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,WAAW;AACb;AAEA,MAAM,iCAAiC,CAAC,YAAyB,UAC/D,oBAAG,MAAM,YAAY,UAAU,CAAC,EAAE,KAAK;AAElC,MAAM,wCAAwC,CACnD,UAMG,+BAA+B,cAAc,KAAK,GAAG,KAAK;AAE/D,MAAM,kBAAkB;AAAA,EACtB,UAAU;AAAA,EACV,mBAAmB;AAAA,EACnB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,WAAW;AACb;AAEA,MAAM,qCAAqC,CAAC,YAAyB,UACnE,oBAAG,MAAM,gBAAgB,UAAU,CAAC,EAAE,KAAK;AAEtC,MAAM,4CAA4C,CACvD,UAMG,mCAAmC,cAAc,KAAK,GAAG,KAAK;AAE5D,MAAM,gBAAgB,CAAC,UAAmB,mBAA4B,aAA8B;AACzG,MAAI,SAAU,QAAO;AACrB,MAAI,kBAAmB,QAAO;AAC9B,MAAI,SAAU,QAAO;AACrB,SAAO;AACT;",
-  "names": []
-}

package/dist/esm/ControlledToggle.js

@@ -1,105 +0,0 @@
-import * as React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { describe, useOwnerProps } from "@elliemae/ds-props-helpers";
-import { useDSControlledToggle } from "./config/useDSControlledToggle.js";
-import { CONTROLLED_TOGGLE_DATA_TESTID, DSControlledToggleName } from "./constants/index.js";
-import { DSControlledTogglePropTypesSchema } from "./react-desc-prop-types.js";
-import {
-  SetLabelWidth,
-  StyledButton,
-  StyledButtonContentWrapper,
-  StyledCircle,
-  StyledContainer,
-  StyledRadiusShape,
-  StyledTextWrapper
-} from "./styles.js";
-const DSControlledToggle = (props) => {
-  const { propsWithDefault, xstyledProps, width, handleRefOnLabelWidth, handleRefOffLabelWidth, buttonProps } = useDSControlledToggle(props);
-  const {
-    wcagViolationLabelOn,
-    wcagViolationLabelOff,
-    checked,
-    size,
-    containerProps,
-    disabled,
-    applyAriaDisabled,
-    readOnly
-  } = propsWithDefault;
-  const { getOwnerProps, getOwnerPropsArguments } = useOwnerProps(propsWithDefault);
-  return /* @__PURE__ */ jsx(
-    StyledContainer,
-    {
-      $size: size,
-      "data-testid": CONTROLLED_TOGGLE_DATA_TESTID.CONTROLLED_CONTAINER,
-      ...containerProps,
-      ...xstyledProps,
-      disabled,
-      getOwnerProps,
-      getOwnerPropsArguments,
-      children: /* @__PURE__ */ jsxs(
-        StyledButton,
-        {
-          ...readOnly ? { "aria-readonly": "true" } : {},
-          ...buttonProps,
-          getOwnerProps,
-          getOwnerPropsArguments,
-          children: [
-            /* @__PURE__ */ jsx(
-              StyledRadiusShape,
-              {
-                $size: size,
-                $width: width,
-                getOwnerProps,
-                getOwnerPropsArguments,
-                children: /* @__PURE__ */ jsxs(
-                  StyledButtonContentWrapper,
-                  {
-                    $checked: checked,
-                    $size: size,
-                    $readOnly: readOnly,
-                    $disabled: disabled,
-                    $applyAriaDisabled: applyAriaDisabled,
-                    getOwnerProps,
-                    getOwnerPropsArguments,
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        StyledCircle,
-                        {
-                          $size: size,
-                          $readOnly: readOnly,
-                          $applyAriaDisabled: applyAriaDisabled,
-                          getOwnerProps,
-                          getOwnerPropsArguments
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        StyledTextWrapper,
-                        {
-                          $size: size,
-                          $disabled: disabled,
-                          getOwnerProps,
-                          getOwnerPropsArguments,
-                          children: checked ? wcagViolationLabelOn ?? "ON" : wcagViolationLabelOff ?? "OFF"
-                        }
-                      )
-                    ]
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsx(SetLabelWidth, { $size: size, innerRef: handleRefOnLabelWidth, "aria-hidden": "true", children: wcagViolationLabelOn ?? "ON" }),
-            /* @__PURE__ */ jsx(SetLabelWidth, { $size: size, innerRef: handleRefOffLabelWidth, "aria-hidden": "true", children: wcagViolationLabelOff ?? "OFF" })
-          ]
-        }
-      )
-    }
-  );
-};
-DSControlledToggle.displayName = DSControlledToggleName;
-const DSControlledToggleWithSchema = describe(DSControlledToggle);
-DSControlledToggleWithSchema.propTypes = DSControlledTogglePropTypesSchema;
-export {
-  DSControlledToggle,
-  DSControlledToggleWithSchema
-};
-//# sourceMappingURL=ControlledToggle.js.map

package/dist/esm/ControlledToggle.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/ControlledToggle.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { describe, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport React from 'react';\nimport { useDSControlledToggle } from './config/useDSControlledToggle.js';\nimport { CONTROLLED_TOGGLE_DATA_TESTID, DSControlledToggleName } from './constants/index.js';\nimport { DSControlledTogglePropTypesSchema, type DSControlledToggleT } from './react-desc-prop-types.js';\nimport {\n  SetLabelWidth,\n  StyledButton,\n  StyledButtonContentWrapper,\n  StyledCircle,\n  StyledContainer,\n  StyledRadiusShape,\n  StyledTextWrapper,\n} from './styles.js';\n\nconst DSControlledToggle: React.ComponentType<DSControlledToggleT.Props> = (props) => {\n  const { propsWithDefault, xstyledProps, width, handleRefOnLabelWidth, handleRefOffLabelWidth, buttonProps } =\n    useDSControlledToggle(props);\n  const {\n    wcagViolationLabelOn,\n    wcagViolationLabelOff,\n    checked,\n    size,\n    containerProps,\n    disabled,\n    applyAriaDisabled,\n    readOnly,\n  } = propsWithDefault;\n  const { getOwnerProps, getOwnerPropsArguments } = useOwnerProps(propsWithDefault);\n\n  return (\n    <StyledContainer\n      $size={size}\n      data-testid={CONTROLLED_TOGGLE_DATA_TESTID.CONTROLLED_CONTAINER}\n      {...containerProps}\n      {...xstyledProps}\n      disabled={disabled}\n      getOwnerProps={getOwnerProps}\n      getOwnerPropsArguments={getOwnerPropsArguments}\n    >\n      <StyledButton\n        // as per morning meeting, juan said \"readOnly\" in toggle should receive aria-readonly, aria-readonly is valid for switch role, the html readonly attribute is not\n        {...(readOnly ? { 'aria-readonly': 'true' } : {})}\n        {...buttonProps}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      >\n        <StyledRadiusShape\n          $size={size}\n          $width={width}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        >\n          <StyledButtonContentWrapper\n            $checked={checked}\n            $size={size}\n            $readOnly={readOnly}\n            $disabled={disabled}\n            $applyAriaDisabled={applyAriaDisabled}\n            getOwnerProps={getOwnerProps}\n            getOwnerPropsArguments={getOwnerPropsArguments}\n          >\n            <StyledCircle\n              $size={size}\n              $readOnly={readOnly}\n              $applyAriaDisabled={applyAriaDisabled}\n              getOwnerProps={getOwnerProps}\n              getOwnerPropsArguments={getOwnerPropsArguments}\n            />\n            <StyledTextWrapper\n              $size={size}\n              $disabled={disabled}\n              getOwnerProps={getOwnerProps}\n              getOwnerPropsArguments={getOwnerPropsArguments}\n            >\n              {checked ? (wcagViolationLabelOn ?? 'ON') : (wcagViolationLabelOff ?? 'OFF')}\n            </StyledTextWrapper>\n          </StyledButtonContentWrapper>\n        </StyledRadiusShape>\n        <SetLabelWidth $size={size} innerRef={handleRefOnLabelWidth} aria-hidden=\"true\">\n          {wcagViolationLabelOn ?? 'ON'}\n        </SetLabelWidth>\n        <SetLabelWidth $size={size} innerRef={handleRefOffLabelWidth} aria-hidden=\"true\">\n          {wcagViolationLabelOff ?? 'OFF'}\n        </SetLabelWidth>\n      </StyledButton>\n    </StyledContainer>\n  );\n};\n\nDSControlledToggle.displayName = DSControlledToggleName;\nconst DSControlledToggleWithSchema = describe(DSControlledToggle);\nDSControlledToggleWithSchema.propTypes = DSControlledTogglePropTypesSchema;\n\nexport { DSControlledToggle, DSControlledToggleWithSchema };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACqDb,SASE,KATF;AArDV,SAAS,UAAU,qBAAqB;AAExC,SAAS,6BAA6B;AACtC,SAAS,+BAA+B,8BAA8B;AACtE,SAAS,yCAAmE;AAC5E;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,qBAAqE,CAAC,UAAU;AACpF,QAAM,EAAE,kBAAkB,cAAc,OAAO,uBAAuB,wBAAwB,YAAY,IACxG,sBAAsB,KAAK;AAC7B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,eAAe,uBAAuB,IAAI,cAAc,gBAAgB;AAEhF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,eAAa,8BAA8B;AAAA,MAC1C,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UAEE,GAAI,WAAW,EAAE,iBAAiB,OAAO,IAAI,CAAC;AAAA,UAC9C,GAAG;AAAA,UACJ;AAAA,UACA;AAAA,UAEA;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR;AAAA,gBACA;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,UAAU;AAAA,oBACV,OAAO;AAAA,oBACP,WAAW;AAAA,oBACX,WAAW;AAAA,oBACX,oBAAoB;AAAA,oBACpB;AAAA,oBACA;AAAA,oBAEA;AAAA;AAAA,wBAAC;AAAA;AAAA,0BACC,OAAO;AAAA,0BACP,WAAW;AAAA,0BACX,oBAAoB;AAAA,0BACpB;AAAA,0BACA;AAAA;AAAA,sBACF;AAAA,sBACA;AAAA,wBAAC;AAAA;AAAA,0BACC,OAAO;AAAA,0BACP,WAAW;AAAA,0BACX;AAAA,0BACA;AAAA,0BAEC,oBAAW,wBAAwB,OAAS,yBAAyB;AAAA;AAAA,sBACxE;AAAA;AAAA;AAAA,gBACF;AAAA;AAAA,YACF;AAAA,YACA,oBAAC,iBAAc,OAAO,MAAM,UAAU,uBAAuB,eAAY,QACtE,kCAAwB,MAC3B;AAAA,YACA,oBAAC,iBAAc,OAAO,MAAM,UAAU,wBAAwB,eAAY,QACvE,mCAAyB,OAC5B;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,mBAAmB,cAAc;AACjC,MAAM,+BAA+B,SAAS,kBAAkB;AAChE,6BAA6B,YAAY;",
-  "names": []
-}