@simplybusiness/mobius 3.10.0 → 3.11.1

package/src/components/Icon/IconStyle.tsx

@@ -0,0 +1,404 @@
+const styleText = `
+svg:not(:root).svg-inline--mobius-icon, svg:not(:host).svg-inline--mobius-icon {
+  overflow: visible;
+  box-sizing: content-box;
+}
+
+.svg-inline--mobius-icon {
+  display: var(--mobius-icon-display, inline-block);
+  height: 1em;
+  overflow: visible;
+  vertical-align: -0.125em;
+}
+.svg-inline--mobius-icon.mobius-icon-2xs {
+  vertical-align: 0.1em;
+}
+.svg-inline--mobius-icon.mobius-icon-xs {
+  vertical-align: 0em;
+}
+.svg-inline--mobius-icon.mobius-icon-sm {
+  vertical-align: -0.0714285705em;
+}
+.svg-inline--mobius-icon.mobius-icon-lg {
+  vertical-align: -0.2em;
+}
+.svg-inline--mobius-icon.mobius-icon-xl {
+  vertical-align: -0.25em;
+}
+.svg-inline--mobius-icon.mobius-icon-2xl {
+  vertical-align: -0.3125em;
+}
+.svg-inline--mobius-icon.mobius-icon-pull-left {
+  margin-right: var(--mobius-icon-pull-margin, 0.3em);
+  width: auto;
+}
+.svg-inline--mobius-icon.mobius-icon-pull-right {
+  margin-left: var(--mobius-icon-pull-margin, 0.3em);
+  width: auto;
+}
+.svg-inline--mobius-icon.mobius-icon-li {
+  width: var(--mobius-icon-li-width, 2em);
+  top: 0.25em;
+}
+.svg-inline--mobius-icon.mobius-icon-fw {
+  width: var(--mobius-icon-fw-width, 1.25em);
+}
+
+.mobius-icon-layers svg.svg-inline--mobius-icon {
+  bottom: 0;
+  left: 0;
+  margin: auto;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+.mobius-icon-layers-counter, .mobius-icon-layers-text {
+  display: inline-block;
+  position: absolute;
+  text-align: center;
+}
+
+.mobius-icon-layers {
+  display: inline-block;
+  height: 1em;
+  position: relative;
+  text-align: center;
+  vertical-align: -0.125em;
+  width: 1em;
+}
+.mobius-icon-layers svg.svg-inline--mobius-icon {
+  transform-origin: center center;
+}
+
+.mobius-icon-layers-text {
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  transform-origin: center center;
+}
+
+.mobius-icon-layers-counter {
+  background-color: var(--mobius-icon-counter-background-color, #ff253a);
+  border-radius: var(--mobius-icon-counter-border-radius, 1em);
+  box-sizing: border-box;
+  color: var(--mobius-icon-inverse, #fff);
+  line-height: var(--mobius-icon-counter-line-height, 1);
+  max-width: var(--mobius-icon-counter-max-width, 5em);
+  min-width: var(--mobius-icon-counter-min-width, 1.5em);
+  overflow: hidden;
+  padding: var(--mobius-icon-counter-padding, 0.25em 0.5em);
+  right: var(--mobius-icon-right, 0);
+  text-overflow: ellipsis;
+  top: var(--mobius-icon-top, 0);
+  transform: scale(var(--mobius-icon-counter-scale, 0.25));
+  transform-origin: top right;
+}
+
+.mobius-icon-layers-bottom-right {
+  bottom: var(--mobius-icon-bottom, 0);
+  right: var(--mobius-icon-right, 0);
+  top: auto;
+  transform: scale(var(--mobius-icon-layers-scale, 0.25));
+  transform-origin: bottom right;
+}
+
+.mobius-icon-layers-bottom-left {
+  bottom: var(--mobius-icon-bottom, 0);
+  left: var(--mobius-icon-left, 0);
+  right: auto;
+  top: auto;
+  transform: scale(var(--mobius-icon-layers-scale, 0.25));
+  transform-origin: bottom left;
+}
+
+.mobius-icon-layers-top-right {
+  top: var(--mobius-icon-top, 0);
+  right: var(--mobius-icon-right, 0);
+  transform: scale(var(--mobius-icon-layers-scale, 0.25));
+  transform-origin: top right;
+}
+
+.mobius-icon-layers-top-left {
+  left: var(--mobius-icon-left, 0);
+  right: auto;
+  top: var(--mobius-icon-top, 0);
+  transform: scale(var(--mobius-icon-layers-scale, 0.25));
+  transform-origin: top left;
+}
+
+.mobius-icon-1x {
+  font-size: 1em;
+}
+
+.mobius-icon-2x {
+  font-size: 2em;
+}
+
+.mobius-icon-3x {
+  font-size: 3em;
+}
+
+.mobius-icon-4x {
+  font-size: 4em;
+}
+
+.mobius-icon-5x {
+  font-size: 5em;
+}
+
+.mobius-icon-6x {
+  font-size: 6em;
+}
+
+.mobius-icon-7x {
+  font-size: 7em;
+}
+
+.mobius-icon-8x {
+  font-size: 8em;
+}
+
+.mobius-icon-9x {
+  font-size: 9em;
+}
+
+.mobius-icon-10x {
+  font-size: 10em;
+}
+
+.mobius-icon-2xs {
+  font-size: 0.625em;
+  line-height: 0.1em;
+  vertical-align: 0.225em;
+}
+
+.mobius-icon-xs {
+  font-size: 0.75em;
+  line-height: 0.0833333337em;
+  vertical-align: 0.125em;
+}
+
+.mobius-icon-sm {
+  font-size: 0.875em;
+  line-height: 0.0714285718em;
+  vertical-align: 0.0535714295em;
+}
+
+.mobius-icon-lg {
+  font-size: 1.25em;
+  line-height: 0.05em;
+  vertical-align: -0.075em;
+}
+
+.mobius-icon-xl {
+  font-size: 1.5em;
+  line-height: 0.0416666682em;
+  vertical-align: -0.125em;
+}
+
+.mobius-icon-2xl {
+  font-size: 2em;
+  line-height: 0.03125em;
+  vertical-align: -0.1875em;
+}
+
+.mobius-icon-fw {
+  text-align: center;
+  width: 1.25em;
+}
+
+.mobius-icon-ul {
+  list-style-type: none;
+  margin-left: var(--mobius-icon-li-margin, 2.5em);
+  padding-left: 0;
+}
+.mobius-icon-ul > li {
+  position: relative;
+}
+
+.mobius-icon-li {
+  left: calc(var(--mobius-icon-li-width, 2em) * -1);
+  position: absolute;
+  text-align: center;
+  width: var(--mobius-icon-li-width, 2em);
+  line-height: inherit;
+}
+
+.mobius-icon-border {
+  border-color: var(--mobius-icon-border-color, #eee);
+  border-radius: var(--mobius-icon-border-radius, 0.1em);
+  border-style: var(--mobius-icon-border-style, solid);
+  border-width: var(--mobius-icon-border-width, 0.08em);
+  padding: var(--mobius-icon-border-padding, 0.2em 0.25em 0.15em);
+}
+
+.mobius-icon-pull-left {
+  float: left;
+  margin-right: var(--mobius-icon-pull-margin, 0.3em);
+}
+
+.mobius-icon-pull-right {
+  float: right;
+  margin-left: var(--mobius-icon-pull-margin, 0.3em);
+}
+
+.mobius-icon-spin {
+  animation-name: mobius-icon-spin;
+  animation-delay: var(--mobius-icon-animation-delay, 0s);
+  animation-direction: var(--mobius-icon-animation-direction, normal);
+  animation-duration: var(--mobius-icon-animation-duration, 2s);
+  animation-iteration-count: var(--mobius-icon-animation-iteration-count, infinite);
+  animation-timing-function: var(--mobius-icon-animation-timing, linear);
+}
+
+.mobius-icon-spin-reverse {
+  --mobius-icon-animation-direction: reverse;
+}
+
+@media (prefers-reduced-motion: reduce) {
+.mobius-icon-spin {
+    animation-delay: -1ms;
+    animation-duration: 1ms;
+    animation-iteration-count: 1;
+    transition-delay: 0s;
+    transition-duration: 0s;
+  }
+}
+@keyframes mobius-icon-spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+.mobius-icon-rotate-90 {
+  transform: rotate(90deg);
+}
+
+.mobius-icon-rotate-180 {
+  transform: rotate(180deg);
+}
+
+.mobius-icon-rotate-270 {
+  transform: rotate(270deg);
+}
+
+.mobius-icon-flip-horizontal {
+  transform: scale(-1, 1);
+}
+
+.mobius-icon-flip-vertical {
+  transform: scale(1, -1);
+}
+
+.mobius-icon-flip-both,
+.mobius-icon-flip-horizontal.mobius-icon-flip-vertical {
+  transform: scale(-1, -1);
+}
+
+.mobius-icon-rotate-by {
+  transform: rotate(var(--mobius-icon-rotate-angle, none));
+}
+
+.mobius-icon-stack {
+  display: inline-block;
+  vertical-align: middle;
+  height: 2em;
+  position: relative;
+  width: 2.5em;
+}
+
+.mobius-icon-stack-1x,
+.mobius-icon-stack-2x {
+  bottom: 0;
+  left: 0;
+  margin: auto;
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: var(--mobius-icon-stack-z-index, auto);
+}
+
+.svg-inline--mobius-icon.mobius-icon-stack-1x {
+  height: 1em;
+  width: 1.25em;
+}
+.svg-inline--mobius-icon.mobius-icon-stack-2x {
+  height: 2em;
+  width: 2.5em;
+}
+
+.mobius-icon-inverse {
+  color: var(--mobius-icon-inverse, #fff);
+}
+
+.sr-only,
+.mobius-icon-sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border-width: 0;
+}
+
+.sr-only-focusable:not(:focus),
+.mobius-icon-sr-only-focusable:not(:focus) {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border-width: 0;
+}
+
+.svg-inline--mobius-icon .mobius-icon-primary {
+  fill: var(--mobius-icon-primary-color, currentColor);
+  opacity: var(--mobius-icon-primary-opacity, 1);
+}
+
+.svg-inline--mobius-icon .mobius-icon-secondary {
+  fill: var(--mobius-icon-secondary-color, currentColor);
+  opacity: var(--mobius-icon-secondary-opacity, 0.4);
+}
+
+.svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-primary {
+  opacity: var(--mobius-icon-secondary-opacity, 0.4);
+}
+
+.svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-secondary {
+  opacity: var(--mobius-icon-primary-opacity, 1);
+}
+
+.svg-inline--mobius-icon mask .mobius-icon-primary,
+.svg-inline--mobius-icon mask .mobius-icon-secondary {
+  fill: black;
+}
+
+.fad.mobius-icon-inverse,
+.mobius-icon-duotone.mobius-icon-inverse {
+  color: var(--mobius-icon-inverse, #fff);
+}
+`;
+
+let appliedStyles = false;
+
+export function applyStyles() {
+  if (appliedStyles) {
+    return;
+  }
+  appliedStyles = true;
+
+  const style = document.createElement("style");
+  style.setAttribute("data-id", "icon-style");
+  style.innerText = styleText;
+  document.head.append(style);
+}

package/src/components/Icon/types.ts

@@ -1,32 +1,37 @@
-import { IconName } from "@simplybusiness/icons";
-import { Ref, RefAttributes } from "react";
+import { Ref } from "react";
 import { IconDefinition } from "../../types/icon";
 
-export interface BaseIconProps extends RefAttributes<SVGSVGElement> {
-  /** Custom class name for setting specific CSS */
-  className?: string;
-  /** Spin the icon */
-  spin?: boolean;
-  fontSize?: string;
-  color?: string;
-}
+export type IconSizeProp =
+  | "2xs"
+  | "xs"
+  | "sm"
+  | "lg"
+  | "xl"
+  | "2xl"
+  | "1x"
+  | "2x"
+  | "3x"
+  | "4x"
+  | "5x"
+  | "6x"
+  | "7x"
+  | "8x"
+  | "9x"
+  | "10x";
 
-export interface IconProps
-  extends BaseIconProps,
-    Partial<IconFromNameProps>,
-    Partial<IconFromObjectProps> {}
+export interface IconProps {
+  icon?: IconDefinition;
 
-export interface IconFromNameProps
-  extends BaseIconProps,
-    RefAttributes<SVGSVGElement> {
-  name: IconName;
-}
+  name?: string;
 
-export interface IconFromObjectProps
-  extends BaseIconProps,
-    RefAttributes<SVGSVGElement> {
-  /** Icon type */
-  icon: IconDefinition;
+  className?: string;
+  size?: IconSizeProp;
+  color?: string;
+  fixedWidth?: boolean;
+
+  // Animations
+  spin?: boolean;
+  spinReverse?: boolean;
 }
 
 export type IconRef = Ref<SVGSVGElement>;

package/src/components/NumberField/__snapshots__/NumberField.test.tsx.snap

@@ -37,7 +37,8 @@ exports[`NumberField should match snapshot 1`] = `
       >
         <svg
           aria-hidden="true"
-          class="mobius mobius/Icon"
+          class="mobius mobius/Icon svg-inline--mobius-icon"
+          data-icon="chevron-up"
           focusable="false"
           role="img"
           viewBox="0 0 512 512"
@@ -58,7 +59,8 @@ exports[`NumberField should match snapshot 1`] = `
       >
         <svg
           aria-hidden="true"
-          class="mobius mobius/Icon"
+          class="mobius mobius/Icon svg-inline--mobius-icon"
+          data-icon="chevron-down"
           focusable="false"
           role="img"
           viewBox="0 0 512 512"

package/src/components/Radio/RadioButton.stories.tsx

@@ -113,13 +113,13 @@ export const IconButtons: Meta<typeof RadioGroup> = {
   render: (args: RadioGroupProps) => (
     <RadioGroup {...args}>
       <RadioButton value="sole_trader" label="Sole Trader">
-        <Icon name="user" fontSize="28px" />
+        <Icon name="user" />
       </RadioButton>
       <RadioButton value="partnership" label="Partnership">
-        <Icon name="star" fontSize="28px" />
+        <Icon name="star" />
       </RadioButton>
       <RadioButton value="company" label="Ltd Company">
-        <Icon name="menu" fontSize="28px" />
+        <Icon name="menu" />
       </RadioButton>
     </RadioGroup>
   ),
@@ -134,13 +134,13 @@ export const CircularButtons: Meta<typeof RadioGroup> = {
   render: (args: RadioGroupProps) => (
     <RadioGroup {...args}>
       <RadioButton value="sole_trader" label="Sole Trader">
-        <Icon name="user" fontSize="28px" />
+        <Icon name="user" />
       </RadioButton>
       <RadioButton value="partnership" label="Partnership">
-        <Icon name="star" fontSize="28px" />
+        <Icon name="star" />
       </RadioButton>
       <RadioButton value="company" label="Ltd Company">
-        <Icon name="menu" fontSize="28px" />
+        <Icon name="menu" />
       </RadioButton>
     </RadioGroup>
   ),

package/src/components/Slider/Thumb.tsx

@@ -2,12 +2,12 @@
 
 import { RefObject, useRef } from "react";
 import { useFocusRing } from "@react-aria/focus";
-import { VisuallyHidden } from "@react-aria/visually-hidden";
 import { mergeProps } from "@react-aria/utils";
 import { useSliderThumb } from "@react-aria/slider";
 import { SliderThumbProps as SpectrumSliderThumbProps } from "@react-types/slider";
 import { SliderState } from "@react-stately/slider";
 import clsx from "clsx";
+import { VisuallyHidden } from "../VisuallyHidden";
 
 export interface SliderThumbProps extends SpectrumSliderThumbProps {
   state: SliderState;

package/src/components/VisuallyHidden/VisuallyHidden.mdx

@@ -29,8 +29,7 @@ import { VisuallyHidden } from "@simplybusiness/mobius";
 import { useVisuallyHidden } from "@simplybusiness/mobius";
 
 function MyComponent() {
-  const { visuallyHiddenProps } = useVisuallyHidden();
-  return <div {...visuallyHiddenProps}>This is hidden from sight</div>;
+  return <VisuallyHidden>This is hidden from sight</VisuallyHidden>;
 }
 ```
 

package/src/components/VisuallyHidden/VisuallyHidden.tsx

@@ -0,0 +1,37 @@
+import type { JSXElementConstructor, ReactNode } from "react";
+
+export interface VisuallyHiddenProps {
+  /** The content to visually hide. */
+  children?: ReactNode;
+
+  className?: string;
+
+  /**
+   * The element type for the container. Defaults to 'div'
+   */
+  elementType?: string | JSXElementConstructor<any>;
+}
+
+export function VisuallyHidden(props: VisuallyHiddenProps) {
+  const { className, children, elementType: Component = "div" } = props;
+
+  return (
+    <Component
+      className={className}
+      style={{
+        border: 0,
+        clip: "rect(0 0 0 0)",
+        clipPath: "inset(50%)",
+        height: "1px",
+        margin: "-1px",
+        overflow: "hidden",
+        padding: 0,
+        position: "absolute",
+        width: "1px",
+        whiteSpace: "nowrap",
+      }}
+    >
+      {children}
+    </Component>
+  );
+}

package/src/components/VisuallyHidden/index.tsx

@@ -1,7 +1 @@
-"use client";
-
-export {
-  VisuallyHidden,
-  useVisuallyHidden,
-  type VisuallyHiddenProps,
-} from "@react-aria/visually-hidden";
+export * from "./VisuallyHidden";

package/src/components/index.tsx

@@ -1,7 +1,3 @@
-import * as Chopin from "./Chopin";
-
-export { Chopin };
-
 export * from "./Accordion";
 export * from "./Alert";
 export * from "./Box";
@@ -9,8 +5,6 @@ export * from "./Breadcrumbs";
 export * from "./Button";
 export * from "./Checkbox";
 export * from "./Container";
-export * from "./DataTable";
-export * from "./DatePicker";
 export * from "./Divider";
 export * from "./DropdownMenu";
 export * from "./ErrorMessage";
@@ -31,10 +25,10 @@ export * from "./Option";
 export * from "./PasswordField";
 export * from "./Progress";
 export * from "./Radio";
+export * from "./SVG";
 export * from "./Segment";
 export * from "./Select";
 export * from "./Slider";
-export * from "./SVG";
 export * from "./Table";
 export * from "./Text";
 export * from "./TextArea";

package/src/hooks/index.tsx

@@ -1,4 +1,3 @@
+export * from "./useBodyScrollLock";
 export * from "./useBreakpoint";
-export * from "./useHideColumns";
 export * from "./useButton";
-export * from "./useBodyScrollLock";

package/dist/cjs/components/Chopin/Actions/Actions.d.ts

@@ -1,17 +0,0 @@
-import { Ref } from "react";
-import { DOMProps } from "@react-types/shared";
-import { ButtonProps } from "../../Button";
-import { ForwardedRefComponent } from "../../../types/components";
-import { type LinkButtonProps } from "../../LinkButton";
-export type ActionsElementType = HTMLDivElement;
-export interface ActionsProps extends DOMProps {
-    /** Custom class name for setting specific CSS */
-    className?: string;
-    backButton?: LinkButtonProps | ButtonProps;
-    nextButton?: LinkButtonProps | ButtonProps;
-    backLabel?: string;
-    nextLabel?: string;
-}
-export type ActionsRef = Ref<ActionsElementType>;
-declare const Actions: ForwardedRefComponent<ActionsProps, ActionsElementType>;
-export { Actions };

package/dist/cjs/components/Chopin/Actions/Actions.js

@@ -1,35 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Actions = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const clsx_1 = __importDefault(require("clsx"));
-const Flex_1 = require("../../Flex");
-const LinkOrButton_1 = require("./LinkOrButton");
-const Actions = (0, react_1.forwardRef)((props, ref) => {
-    const { className, backButton, nextButton, backLabel, nextLabel } = props, rest = __rest(props, ["className", "backButton", "nextButton", "backLabel", "nextLabel"]);
-    const classes = (0, clsx_1.default)("chopin", "chopin/Actions", className);
-    const nextButtonClasses = (0, clsx_1.default)("chopin/ActionsNext", {
-        "--single-action": !backLabel,
-    });
-    const backButtonProps = Object.assign(Object.assign({}, backButton), { className: "chopin/ActionsBack", variant: "ghost", icon: "leftArrow", size: "large" });
-    const nextButtonProps = Object.assign(Object.assign({}, nextButton), { className: nextButtonClasses, size: "large" });
-    return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, Object.assign({ ref: ref, className: classes, justifyContent: "center" }, rest, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, Object.assign({ className: "chopin/ActionsContainer", justifyContent: "space-between", alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)(LinkOrButton_1.LinkOrButton, Object.assign({ href: backButton === null || backButton === void 0 ? void 0 : backButton.href }, backButtonProps, { children: backLabel })), (0, jsx_runtime_1.jsx)(LinkOrButton_1.LinkOrButton, Object.assign({ href: nextButton === null || nextButton === void 0 ? void 0 : nextButton.href }, nextButtonProps, { children: nextLabel }))] })) })));
-});
-exports.Actions = Actions;
-Actions.displayName = "Actions";
-//# sourceMappingURL=Actions.js.map

package/dist/cjs/components/Chopin/Actions/Actions.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Actions/Actions.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,iCAAwC;AAExC,gDAAwB;AAGxB,qCAAkC;AAGlC,iDAA8C;AAe9C,MAAM,OAAO,GACX,IAAA,kBAAU,EAAC,CAAC,KAAmB,EAAE,GAAe,EAAE,EAAE;IAClD,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,KAC7D,KAAK,EAD6D,IAAI,UACtE,KAAK,EADD,mEAAoE,CACnE,CAAC;IAER,MAAM,OAAO,GAAG,IAAA,cAAI,EAAC,QAAQ,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAC5D,MAAM,iBAAiB,GAAG,IAAA,cAAI,EAAC,oBAAoB,EAAE;QACnD,iBAAiB,EAAE,CAAC,SAAS;KAC9B,CAAC,CAAC;IAEH,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAkB,EAC3B,IAAI,EAAE,WAAuB,EAC7B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,MAAM,eAAe,mCAChB,UAAU,KACb,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,OAAe,GACtB,CAAC;IAEF,OAAO,CACL,uBAAC,WAAI,kBAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAC,QAAQ,IAAK,IAAI,cAClE,wBAAC,WAAI,kBACH,SAAS,EAAC,yBAAyB,EACnC,cAAc,EAAC,eAAe,EAC9B,UAAU,EAAC,QAAQ,iBAEnB,uBAAC,2BAAY,kBAAC,IAAI,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,IAAM,eAAe,cACtD,SAAS,IACG,EACf,uBAAC,2BAAY,kBAAC,IAAI,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,IAAM,eAAe,cACtD,SAAS,IACG,KACV,IACF,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAGI,0BAAO;AADhB,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC"}