@janbox/storefront-ui 1.0.0

package/dist/lib/button/button.cjs

@@ -0,0 +1,235 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const react = require("react");
+const react$1 = require("@floating-ui/react");
+const lodashEs = require("lodash-es");
+const reactRouter = require("react-router");
+const helpers = require("./helpers.cjs");
+const index = require("../../hooks/use-ripple-effect/index.cjs");
+const utils_index = require("../../utils/index.cjs");
+const loadingWaiting = require("../../assets/svg/loading-waiting.svg.cjs");
+const theme_screens = require("../../theme/screens.cjs");
+const theme_palette = require("../../theme/palette.cjs");
+const emotionHelpers = require("../../utils/emotion-helpers.cjs");
+const icon = require("../icon/icon.cjs");
+const stylesheet = require("../../utils/stylesheet.cjs");
+const Button = ({ children, ref, ..._props }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const buttonRef = react.useRef(null);
+  const { className } = index.useRippleEffect(buttonRef);
+  const mergedRef = react$1.useMergeRefs([ref, buttonRef]);
+  const {
+    color,
+    variant,
+    anchor,
+    translation,
+    prefix,
+    suffix,
+    isLoading,
+    disabled,
+    startIcon,
+    endIcon,
+    dangerouslySetInnerHTML,
+    ...rest
+  } = helpers.getButtonProps(_props);
+  const navigate = reactRouter.useNavigate();
+  const {
+    dark,
+    light,
+    main,
+    contrastText,
+    placeholder: placeholderColor,
+    ariaDisabledSurface,
+    ariaDisabledText
+  } = utils_index.getColorShadesByVariant(color);
+  const createStyle = (screen) => {
+    const { css: css2 } = rest[screen] ?? {};
+    return {
+      ...css2
+    };
+  };
+  const css = [
+    {
+      display: "flex",
+      maxWidth: "100%",
+      width: "fit-content",
+      position: "relative",
+      justifyContent: "center",
+      alignItems: "center",
+      whiteSpace: "nowrap",
+      "& > *:not([data-loading])": {
+        visibility: isLoading ? "hidden" : void 0
+      },
+      pointerEvents: isLoading ? "none" : void 0
+    },
+    variant === "contained" && {
+      backgroundColor: isLoading ? placeholderColor : main,
+      color: contrastText,
+      ":hover": {
+        backgroundColor: dark
+      },
+      ":disabled": {
+        backgroundColor: theme_palette.getColorVar("neutral.300"),
+        color: theme_palette.getColorVar("neutral.500")
+      },
+      "&[aria-disabled=true]": {
+        backgroundColor: ariaDisabledSurface,
+        pointerEvents: "none"
+      }
+    },
+    variant === "outlined" && {
+      backgroundColor: theme_palette.getColorVar("surface.default"),
+      color: isLoading ? placeholderColor : main,
+      borderWidth: 1,
+      borderStyle: "solid",
+      borderColor: isLoading ? placeholderColor : main,
+      ":hover": {
+        backgroundColor: light
+      },
+      ":disabled": {
+        color: theme_palette.getColorVar("neutral.500"),
+        backgroundColor: theme_palette.getColorVar("neutral.300"),
+        borderColor: theme_palette.getColorVar("neutral.300")
+      },
+      "&[aria-disabled=true]": {
+        color: ariaDisabledText,
+        pointerEvents: "none",
+        borderColor: "currentcolor"
+      }
+    },
+    variant === "text" && {
+      backgroundColor: "transparent",
+      color: isLoading ? placeholderColor : main,
+      ":hover": {
+        backgroundColor: light
+      },
+      ":disabled": {
+        color: theme_palette.getColorVar("neutral.500"),
+        backgroundColor: theme_palette.getColorVar("neutral.300")
+      },
+      "&[aria-disabled=true]": {
+        color: ariaDisabledText
+      }
+    },
+    rest["aria-disabled"] && {
+      pointerEvents: "none"
+    },
+    createStyle("xs"),
+    {
+      [theme_screens.mediaQuery("sm")]: createStyle("sm"),
+      [theme_screens.mediaQuery("md")]: createStyle("md"),
+      [theme_screens.mediaQuery("lg")]: createStyle("lg")
+    }
+  ];
+  const onClick = (e) => {
+    var _a2;
+    (_a2 = rest.onClick) == null ? void 0 : _a2.call(rest, e);
+    if (e.defaultPrevented) {
+      return;
+    }
+    if (lodashEs.isNil(anchor == null ? void 0 : anchor.to)) {
+      return;
+    }
+    const { to, target, ...otherOptions } = anchor;
+    const href = lodashEs.isString(to) ? to : reactRouter.createPath(to);
+    if (target === "_blank") {
+      window.open(href, target);
+    } else {
+      try {
+        const url = new URL(href);
+        window.location.href = url.toString();
+      } catch (error) {
+        navigate(href, otherOptions);
+      }
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      css,
+      disabled,
+      ...utils_index.omitResponsiveProps(rest),
+      onClick,
+      className: stylesheet.cn(rest.className, className),
+      ref: mergedRef,
+      children: [
+        prefix,
+        !!startIcon && /* @__PURE__ */ jsxRuntime.jsx(
+          icon.Icon,
+          {
+            ...startIcon,
+            css: {
+              flexShrink: 0
+            },
+            xs: {
+              size: utils_index.getSizeVariantState((_a = rest.xs) == null ? void 0 : _a.size).iconSize,
+              ...startIcon.xs
+            },
+            sm: {
+              size: utils_index.getSizeVariantState((_b = rest.sm) == null ? void 0 : _b.size).iconSize,
+              ...startIcon.sm
+            },
+            md: {
+              size: utils_index.getSizeVariantState((_c = rest.md) == null ? void 0 : _c.size).iconSize,
+              ...startIcon.md
+            },
+            lg: {
+              size: utils_index.getSizeVariantState((_d = rest.lg) == null ? void 0 : _d.size).iconSize,
+              ...startIcon.lg
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(react.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: react.isValidElement(children) ? children : /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            dangerouslySetInnerHTML,
+            css: emotionHelpers.truncate,
+            children
+          }
+        ) }) }),
+        !!endIcon && /* @__PURE__ */ jsxRuntime.jsx(
+          icon.Icon,
+          {
+            ...endIcon,
+            css: {
+              flexShrink: 0
+            },
+            xs: {
+              size: utils_index.getSizeVariantState((_e = rest.xs) == null ? void 0 : _e.size).iconSize,
+              ...endIcon.xs
+            },
+            sm: {
+              size: utils_index.getSizeVariantState((_f = rest.sm) == null ? void 0 : _f.size).iconSize,
+              ...endIcon.sm
+            },
+            md: {
+              size: utils_index.getSizeVariantState((_g = rest.md) == null ? void 0 : _g.size).iconSize,
+              ...endIcon.md
+            },
+            lg: {
+              size: utils_index.getSizeVariantState((_h = rest.lg) == null ? void 0 : _h.size).iconSize,
+              ...endIcon.lg
+            }
+          }
+        ),
+        suffix,
+        isLoading && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "data-loading": true,
+            css: {
+              position: "absolute",
+              inset: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            },
+            children: /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { css: emotionHelpers.animateSpin, source: loadingWaiting })
+          }
+        )
+      ]
+    }
+  );
+};
+exports.Button = Button;

package/dist/lib/button/button.d.ts

@@ -0,0 +1,3 @@
+import { ButtonProps } from './types';
+export declare const Button: ({ children, ref, ..._props }: ButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=button.d.ts.map

package/dist/lib/button/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/lib/button/button.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AActC,eAAO,MAAM,MAAM,iCAAkC,WAAW,qDA0O/D,CAAC"}

package/dist/lib/button/button.js

@@ -0,0 +1,235 @@
+import { jsxs, jsx, Fragment as Fragment$1 } from "@emotion/react/jsx-runtime";
+import { useRef, Fragment, isValidElement } from "react";
+import { useMergeRefs } from "@floating-ui/react";
+import { isNil, isString } from "lodash-es";
+import { useNavigate, createPath } from "react-router";
+import { getButtonProps } from "./helpers.js";
+import { useRippleEffect } from "../../hooks/use-ripple-effect/index.js";
+import { getColorShadesByVariant, getSizeVariantState, omitResponsiveProps } from "../../utils/index.js";
+import LoadingIcon from "../../assets/svg/loading-waiting.svg.js";
+import { mediaQuery } from "../../theme/screens.js";
+import { getColorVar } from "../../theme/palette.js";
+import { truncate, animateSpin } from "../../utils/emotion-helpers.js";
+import { Icon } from "../icon/icon.js";
+import { cn } from "../../utils/stylesheet.js";
+const Button = ({ children, ref, ..._props }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const buttonRef = useRef(null);
+  const { className } = useRippleEffect(buttonRef);
+  const mergedRef = useMergeRefs([ref, buttonRef]);
+  const {
+    color,
+    variant,
+    anchor,
+    translation,
+    prefix,
+    suffix,
+    isLoading,
+    disabled,
+    startIcon,
+    endIcon,
+    dangerouslySetInnerHTML,
+    ...rest
+  } = getButtonProps(_props);
+  const navigate = useNavigate();
+  const {
+    dark,
+    light,
+    main,
+    contrastText,
+    placeholder: placeholderColor,
+    ariaDisabledSurface,
+    ariaDisabledText
+  } = getColorShadesByVariant(color);
+  const createStyle = (screen) => {
+    const { css: css2 } = rest[screen] ?? {};
+    return {
+      ...css2
+    };
+  };
+  const css = [
+    {
+      display: "flex",
+      maxWidth: "100%",
+      width: "fit-content",
+      position: "relative",
+      justifyContent: "center",
+      alignItems: "center",
+      whiteSpace: "nowrap",
+      "& > *:not([data-loading])": {
+        visibility: isLoading ? "hidden" : void 0
+      },
+      pointerEvents: isLoading ? "none" : void 0
+    },
+    variant === "contained" && {
+      backgroundColor: isLoading ? placeholderColor : main,
+      color: contrastText,
+      ":hover": {
+        backgroundColor: dark
+      },
+      ":disabled": {
+        backgroundColor: getColorVar("neutral.300"),
+        color: getColorVar("neutral.500")
+      },
+      "&[aria-disabled=true]": {
+        backgroundColor: ariaDisabledSurface,
+        pointerEvents: "none"
+      }
+    },
+    variant === "outlined" && {
+      backgroundColor: getColorVar("surface.default"),
+      color: isLoading ? placeholderColor : main,
+      borderWidth: 1,
+      borderStyle: "solid",
+      borderColor: isLoading ? placeholderColor : main,
+      ":hover": {
+        backgroundColor: light
+      },
+      ":disabled": {
+        color: getColorVar("neutral.500"),
+        backgroundColor: getColorVar("neutral.300"),
+        borderColor: getColorVar("neutral.300")
+      },
+      "&[aria-disabled=true]": {
+        color: ariaDisabledText,
+        pointerEvents: "none",
+        borderColor: "currentcolor"
+      }
+    },
+    variant === "text" && {
+      backgroundColor: "transparent",
+      color: isLoading ? placeholderColor : main,
+      ":hover": {
+        backgroundColor: light
+      },
+      ":disabled": {
+        color: getColorVar("neutral.500"),
+        backgroundColor: getColorVar("neutral.300")
+      },
+      "&[aria-disabled=true]": {
+        color: ariaDisabledText
+      }
+    },
+    rest["aria-disabled"] && {
+      pointerEvents: "none"
+    },
+    createStyle("xs"),
+    {
+      [mediaQuery("sm")]: createStyle("sm"),
+      [mediaQuery("md")]: createStyle("md"),
+      [mediaQuery("lg")]: createStyle("lg")
+    }
+  ];
+  const onClick = (e) => {
+    var _a2;
+    (_a2 = rest.onClick) == null ? void 0 : _a2.call(rest, e);
+    if (e.defaultPrevented) {
+      return;
+    }
+    if (isNil(anchor == null ? void 0 : anchor.to)) {
+      return;
+    }
+    const { to, target, ...otherOptions } = anchor;
+    const href = isString(to) ? to : createPath(to);
+    if (target === "_blank") {
+      window.open(href, target);
+    } else {
+      try {
+        const url = new URL(href);
+        window.location.href = url.toString();
+      } catch (error) {
+        navigate(href, otherOptions);
+      }
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      css,
+      disabled,
+      ...omitResponsiveProps(rest),
+      onClick,
+      className: cn(rest.className, className),
+      ref: mergedRef,
+      children: [
+        prefix,
+        !!startIcon && /* @__PURE__ */ jsx(
+          Icon,
+          {
+            ...startIcon,
+            css: {
+              flexShrink: 0
+            },
+            xs: {
+              size: getSizeVariantState((_a = rest.xs) == null ? void 0 : _a.size).iconSize,
+              ...startIcon.xs
+            },
+            sm: {
+              size: getSizeVariantState((_b = rest.sm) == null ? void 0 : _b.size).iconSize,
+              ...startIcon.sm
+            },
+            md: {
+              size: getSizeVariantState((_c = rest.md) == null ? void 0 : _c.size).iconSize,
+              ...startIcon.md
+            },
+            lg: {
+              size: getSizeVariantState((_d = rest.lg) == null ? void 0 : _d.size).iconSize,
+              ...startIcon.lg
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Fragment$1, { children: isValidElement(children) ? children : /* @__PURE__ */ jsx(
+          "span",
+          {
+            dangerouslySetInnerHTML,
+            css: truncate,
+            children
+          }
+        ) }) }),
+        !!endIcon && /* @__PURE__ */ jsx(
+          Icon,
+          {
+            ...endIcon,
+            css: {
+              flexShrink: 0
+            },
+            xs: {
+              size: getSizeVariantState((_e = rest.xs) == null ? void 0 : _e.size).iconSize,
+              ...endIcon.xs
+            },
+            sm: {
+              size: getSizeVariantState((_f = rest.sm) == null ? void 0 : _f.size).iconSize,
+              ...endIcon.sm
+            },
+            md: {
+              size: getSizeVariantState((_g = rest.md) == null ? void 0 : _g.size).iconSize,
+              ...endIcon.md
+            },
+            lg: {
+              size: getSizeVariantState((_h = rest.lg) == null ? void 0 : _h.size).iconSize,
+              ...endIcon.lg
+            }
+          }
+        ),
+        suffix,
+        isLoading && /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-loading": true,
+            css: {
+              position: "absolute",
+              inset: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            },
+            children: /* @__PURE__ */ jsx(Icon, { css: animateSpin, source: LoadingIcon })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  Button
+};

package/dist/lib/button/helpers.cjs

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const theme_screens = require("../../theme/screens.cjs");
+require("../../theme/palette.cjs");
+const theme_typography = require("../../theme/typography.cjs");
+const utils_index = require("../../utils/index.cjs");
+const defaultProps = {
+  xs: {
+    css: {
+      borderTopLeftRadius: 8,
+      borderBottomLeftRadius: 8,
+      borderTopRightRadius: 8,
+      borderBottomRightRadius: 8,
+      columnGap: 8
+    },
+    size: "md"
+  },
+  variant: "contained",
+  color: "primary",
+  type: "button"
+};
+const getButtonResponsiveCssBySize = (size) => {
+  const { inputSize, inputPaddingX } = utils_index.getSizeVariantState(size);
+  switch (size) {
+    case "sm":
+      return {
+        paddingLeft: inputPaddingX,
+        paddingRight: inputPaddingX,
+        minHeight: inputSize,
+        fontWeight: 400,
+        fontSize: theme_typography.getTypographyVar("sm").fontSize,
+        lineHeight: theme_typography.getTypographyVar("sm").lineHeight
+      };
+    case "md":
+      return {
+        paddingLeft: inputPaddingX,
+        paddingRight: inputPaddingX,
+        minHeight: inputSize,
+        fontWeight: 500,
+        fontSize: theme_typography.getTypographyVar("sm").fontSize,
+        lineHeight: theme_typography.getTypographyVar("sm").lineHeight
+      };
+    case "lg":
+      return {
+        paddingLeft: inputPaddingX,
+        paddingRight: inputPaddingX,
+        minHeight: inputSize,
+        fontWeight: 600,
+        fontSize: theme_typography.getTypographyVar("base").fontSize,
+        lineHeight: theme_typography.getTypographyVar("base").lineHeight
+      };
+    default:
+      return {};
+  }
+};
+const getButtonProps = (extended) => {
+  return utils_index.mergeComponentProps(
+    defaultProps,
+    extended,
+    ...theme_screens.screens.map((screen) => {
+      return (current) => {
+        var _a;
+        const size = (_a = current[screen]) == null ? void 0 : _a.size;
+        const propsBySize = {};
+        propsBySize[screen] = {
+          css: getButtonResponsiveCssBySize(size)
+        };
+        return propsBySize;
+      };
+    }),
+    extended
+  );
+};
+exports.getButtonProps = getButtonProps;

package/dist/lib/button/helpers.d.ts

@@ -0,0 +1,3 @@
+import { ButtonProps } from './types';
+export declare const getButtonProps: (extended: ButtonProps) => ButtonProps;
+//# sourceMappingURL=helpers.d.ts.map

package/dist/lib/button/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/lib/button/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAyB,MAAM,SAAS,CAAC;AA0D7D,eAAO,MAAM,cAAc,aAAc,WAAW,gBAkBnD,CAAC"}

package/dist/lib/button/helpers.js

@@ -0,0 +1,74 @@
+import { screens } from "../../theme/screens.js";
+import "../../theme/palette.js";
+import { getTypographyVar } from "../../theme/typography.js";
+import { mergeComponentProps, getSizeVariantState } from "../../utils/index.js";
+const defaultProps = {
+  xs: {
+    css: {
+      borderTopLeftRadius: 8,
+      borderBottomLeftRadius: 8,
+      borderTopRightRadius: 8,
+      borderBottomRightRadius: 8,
+      columnGap: 8
+    },
+    size: "md"
+  },
+  variant: "contained",
+  color: "primary",
+  type: "button"
+};
+const getButtonResponsiveCssBySize = (size) => {
+  const { inputSize, inputPaddingX } = getSizeVariantState(size);
+  switch (size) {
+    case "sm":
+      return {
+        paddingLeft: inputPaddingX,
+        paddingRight: inputPaddingX,
+        minHeight: inputSize,
+        fontWeight: 400,
+        fontSize: getTypographyVar("sm").fontSize,
+        lineHeight: getTypographyVar("sm").lineHeight
+      };
+    case "md":
+      return {
+        paddingLeft: inputPaddingX,
+        paddingRight: inputPaddingX,
+        minHeight: inputSize,
+        fontWeight: 500,
+        fontSize: getTypographyVar("sm").fontSize,
+        lineHeight: getTypographyVar("sm").lineHeight
+      };
+    case "lg":
+      return {
+        paddingLeft: inputPaddingX,
+        paddingRight: inputPaddingX,
+        minHeight: inputSize,
+        fontWeight: 600,
+        fontSize: getTypographyVar("base").fontSize,
+        lineHeight: getTypographyVar("base").lineHeight
+      };
+    default:
+      return {};
+  }
+};
+const getButtonProps = (extended) => {
+  return mergeComponentProps(
+    defaultProps,
+    extended,
+    ...screens.map((screen) => {
+      return (current) => {
+        var _a;
+        const size = (_a = current[screen]) == null ? void 0 : _a.size;
+        const propsBySize = {};
+        propsBySize[screen] = {
+          css: getButtonResponsiveCssBySize(size)
+        };
+        return propsBySize;
+      };
+    }),
+    extended
+  );
+};
+export {
+  getButtonProps
+};

package/dist/lib/button/index.d.ts

@@ -0,0 +1,4 @@
+export * from './button';
+export * from './types';
+export * from './helpers';
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC"}

package/dist/lib/button/types.d.ts

@@ -0,0 +1,26 @@
+import { JSX } from 'react';
+import { RouterNavigateOptions } from 'react-router';
+import { IconProps } from '../icon';
+import { LinkProps } from '../link';
+import { ButtonVariant, ColorVariant, ContentTranslation, PropsWithCSS, ResponsiveDesign, SizeVariant, ShallowMerge } from '../../types';
+export type ButtonSizeVariant = Exclude<SizeVariant, "xs">;
+export type ButtonResponsiveProps = PropsWithCSS<{
+    size?: ButtonSizeVariant;
+}>;
+type ButtonExtendedProps = ResponsiveDesign<ButtonResponsiveProps> & {
+    anchor?: RouterNavigateOptions & {
+        to?: LinkProps["to"];
+        target?: LinkProps["target"];
+    };
+    color?: ColorVariant;
+    variant?: ButtonVariant;
+    translation?: ContentTranslation;
+    prefix?: React.ReactNode;
+    suffix?: React.ReactNode;
+    isLoading?: boolean;
+    startIcon?: IconProps;
+    endIcon?: IconProps;
+};
+export type ButtonProps = ShallowMerge<JSX.IntrinsicElements["button"], ButtonExtendedProps>;
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/lib/button/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAErD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,OAAO,EACL,aAAa,EACb,YAAY,EACZ,kBAAkB,EAClB,YAAY,EACZ,gBAAgB,EAChB,WAAW,EACX,YAAY,EACb,MAAM,aAAa,CAAC;AAErB,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;AAE3D,MAAM,MAAM,qBAAqB,GAAG,YAAY,CAAC;IAC/C,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC,CAAC;AAEH,KAAK,mBAAmB,GAAG,gBAAgB,CAAC,qBAAqB,CAAC,GAAG;IACnE,MAAM,CAAC,EAAE,qBAAqB,GAAG;QAC/B,EAAE,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC;QACrB,MAAM,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;KAC9B,CAAC;IAEF,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,YAAY,CACpC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAC/B,mBAAmB,CACpB,CAAC"}