@clickhouse/click-ui 0.6.2-rc3 → 0.7.0

package/dist/esm/components/GenericMenu/GenericMenu.css

@@ -0,0 +1,176 @@
+/* stylelint-disable custom-property-pattern -- design tokens use camelCase (e.g. genericMenu) */
+
+.generic-menu-panel__y8D6y {
+  display: flex;
+  overflow: hidden;
+  align-items: flex-start;
+  border: 1px solid var(--click-genericMenu-panel-color-stroke-default);
+  border-radius: var(--click-genericMenu-panel-radii-all);
+  background: var(--click-genericMenu-panel-color-background-default);
+  outline: none;
+  box-shadow: var(--click-genericMenu-panel-shadow-default);
+  pointer-events: auto;
+}
+
+.generic-menu-panel_type_popover__DWcS4 {
+  max-width: var(--radix-popover-content-available-width);
+  max-height: var(--radix-popover-content-available-height);
+}
+
+.generic-menu-panel_type_dropdown-menu__ezKZT {
+  max-width: var(--radix-dropdown-menu-content-available-width);
+  max-height: var(--radix-dropdown-menu-content-available-height);
+}
+
+.generic-menu-panel_type_context-menu__nu-Kt {
+  max-width: var(--radix-context-menu-content-available-width);
+  max-height: var(--radix-context-menu-content-available-height);
+}
+
+.generic-menu-panel_show-arrow__hHyfA[data-side='bottom'] {
+  margin-top: -1px;
+}
+
+.generic-menu-panel_show-arrow__hHyfA[data-side='top'] {
+  margin-bottom: 1px;
+}
+
+.generic-menu-panel_show-arrow__hHyfA[data-side='left'] {
+  margin-right: -1px;
+}
+
+.generic-menu-panel_show-arrow__hHyfA[data-side='right'] {
+  margin-left: -1px;
+}
+
+.generic-popover-menu-panel__TbbW1 {
+  display: flex;
+  z-index: 1;
+  padding: var(--click-popover-space-y) var(--click-popover-space-x);
+  overflow: hidden;
+  flex-direction: column;
+  align-items: flex-start;
+  border: 1px solid var(--click-popover-color-panel-stroke-default);
+  border-radius: var(--click-popover-radii-all);
+  background: var(--click-popover-color-panel-background-default);
+  outline: none;
+  box-shadow: var(--click-popover-shadow-default);
+}
+
+.generic-popover-menu-panel_type_popover__eALQC {
+  max-width: var(--radix-popover-content-available-width);
+  max-height: var(--radix-popover-content-available-height);
+}
+
+.generic-popover-menu-panel_type_hover-card__t0Wzp {
+  max-width: var(--radix-hover-card-content-available-width);
+  max-height: var(--radix-hover-card-content-available-height);
+}
+
+.generic-popover-menu-panel_show-arrow__dDH0c {
+  margin: -1px 0;
+}
+
+.arrow__MVfZZ {
+  fill: var(--click-genericMenu-panel-color-background-default);
+  filter: drop-shadow(rgb(0 0 0 / 10%) 0 4px 6px);
+  stroke: var(--click-genericMenu-panel-color-stroke-default);
+}
+
+.generic-menu-item__ApV25 {
+  display: flex;
+  position: relative;
+  /* stylelint-disable plugin/no-unsupported-browser-features, declaration-property-value-no-unknown -- the original rule used this same
+   width fallback chain (100% → -moz-available → -webkit-fill-available →
+   fill-available → stretch) so the item fills the available inline space. */
+  width: 100%;
+  width: -moz-available;
+  width: -webkit-fill-available;
+  width: fill-available;
+  width: stretch;
+  /* stylelint-enable plugin/no-unsupported-browser-features, declaration-property-value-no-unknown */
+  padding: var(--click-genericMenu-item-space-y) var(--click-genericMenu-item-space-x);
+  overflow: hidden;
+  justify-content: flex-start;
+  align-items: center;
+  gap: var(--click-genericMenu-item-space-gap);
+  background: var(--gmi-background-default);
+  color: var(--gmi-text-default);
+  font: var(--click-genericMenu-item-typography-label-default);
+  white-space: nowrap;
+  cursor: default;
+  text-overflow: ellipsis;
+}
+
+.generic-menu-item_type_default__hWnNu {
+  --gmi-text-default: var(--click-genericMenu-item-color-default-text-default);
+  --gmi-text-hover: var(--click-genericMenu-item-color-default-text-hover);
+  --gmi-text-active: var(--click-genericMenu-item-color-default-text-active);
+  --gmi-text-disabled: var(--click-genericMenu-item-color-default-text-disabled);
+  --gmi-background-default: var(--click-genericMenu-item-color-default-background-default);
+  --gmi-background-hover: var(--click-genericMenu-item-color-default-background-hover);
+  --gmi-background-active: var(--click-genericMenu-item-color-default-background-active);
+}
+
+.generic-menu-item_type_danger__sqWb0 {
+  --gmi-text-default: var(--click-genericMenu-item-color-danger-text-default);
+  --gmi-text-hover: var(--click-genericMenu-item-color-danger-text-hover);
+  --gmi-text-active: var(--click-genericMenu-item-color-danger-text-active);
+  --gmi-text-disabled: var(--click-genericMenu-item-color-danger-text-disabled);
+  --gmi-background-default: var(--click-genericMenu-item-color-danger-background-default);
+  --gmi-background-hover: var(--click-genericMenu-item-color-danger-background-hover);
+  --gmi-background-active: var(--click-genericMenu-item-color-danger-background-active);
+}
+
+.generic-menu-item__ApV25:focus {
+  outline: none;
+}
+
+.generic-menu-item__ApV25[data-highlighted] {
+  background: var(--gmi-background-hover);
+  color: var(--gmi-text-hover);
+  font: var(--click-genericMenu-item-typography-label-hover);
+  cursor: pointer;
+}
+
+[data-input-modality='keyboard'] .generic-menu-item__ApV25[data-highlighted] {
+  outline: 2px solid var(--click-global-color-accent-default);
+  outline-offset: -2px;
+}
+
+.generic-menu-item__ApV25[data-state='open'] {
+  background: var(--gmi-background-hover);
+  color: var(--gmi-text-hover);
+  font: var(--click-genericMenu-item-typography-label-hover);
+  cursor: pointer;
+}
+
+.generic-menu-item__ApV25[data-state='checked'],
+.generic-menu-item__ApV25[data-selected='true'] {
+  background: var(--gmi-background-active);
+  color: var(--gmi-text-active);
+  font: var(--click-genericMenu-item-typography-label-active);
+}
+
+.generic-menu-item__ApV25[data-disabled] {
+  color: var(--gmi-text-disabled);
+  font: var(--click-genericMenu-item-typography-label-disabled);
+  pointer-events: none;
+}
+
+.generic-menu-item__ApV25:visited {
+  color: var(--gmi-text-default);
+}
+
+.generic-menu-item__ApV25:visited a {
+  color: var(--gmi-text-default);
+}
+
+.generic-menu-item__ApV25:hover .dropdown-arrow__e2s6p,
+.generic-menu-item__ApV25[data-state='open'] .dropdown-arrow__e2s6p {
+  left: 0.5rem;
+}
+
+.generic-menu-item__ApV25[hidden] {
+  display: none;
+}

package/dist/esm/components/GenericMenu/GenericMenu.module.css.js

@@ -0,0 +1,18 @@
+const arrow = "arrow__MVfZZ";
+const styles = {
+	"generic-menu-panel": "generic-menu-panel__y8D6y",
+	"generic-menu-panel_type_popover": "generic-menu-panel_type_popover__DWcS4",
+	"generic-menu-panel_type_dropdown-menu": "generic-menu-panel_type_dropdown-menu__ezKZT",
+	"generic-menu-panel_type_context-menu": "generic-menu-panel_type_context-menu__nu-Kt",
+	"generic-menu-panel_show-arrow": "generic-menu-panel_show-arrow__hHyfA",
+	"generic-popover-menu-panel": "generic-popover-menu-panel__TbbW1",
+	"generic-popover-menu-panel_type_popover": "generic-popover-menu-panel_type_popover__eALQC",
+	"generic-popover-menu-panel_type_hover-card": "generic-popover-menu-panel_type_hover-card__t0Wzp",
+	"generic-popover-menu-panel_show-arrow": "generic-popover-menu-panel_show-arrow__dDH0c",
+	arrow: arrow,
+	"generic-menu-item": "generic-menu-item__ApV25",
+	"generic-menu-item_type_default": "generic-menu-item_type_default__hWnNu",
+	"generic-menu-item_type_danger": "generic-menu-item_type_danger__sqWb0"};
+
+export { arrow, styles as default };
+//# sourceMappingURL=GenericMenu.module.css.js.map

package/dist/esm/components/GenericMenu/GenericMenu.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericMenu.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/GenericMenu/index.js

@@ -1,107 +1,101 @@
-import { styled } from 'styled-components';
+import "./GenericMenu.css";
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { cn } from '../../lib/cva.js';
+import styles from './GenericMenu.module.css.js';
+import { cva } from 'class-variance-authority';
 
-const GenericMenuPanel = styled.div.withConfig({
-  componentId: "sc-isr9rp-0"
-})(["outline:none;max-width:var(--radix-", "-content-available-width);max-height:var(--radix-", "-content-available-height);overflow:hidden;display:flex;align-items:flex-start;pointer-events:auto;", ";", ";"], ({
-  $type
-}) => $type, ({
-  $type
-}) => $type, ({
-  theme
-}) => `
-    border: 1px solid ${theme.click.genericMenu.panel.color.stroke.default};
-    background: ${theme.click.genericMenu.panel.color.background.default};
-    box-shadow: ${theme.click.genericMenu.panel.shadow.default};
-    border-radius: ${theme.click.genericMenu.panel.radii.all};
-  `, ({
-  $showArrow
-}) => $showArrow ? `
-      &[data-side="bottom"] {
-        margin-top: -1px;
-      }
-      &[data-side="top"] {
-        margin-bottom: 1px;
-      }
-      &[data-side="left"] {
-        margin-right: -1px;
-      }
-      }
-      &[data-side="right"] {
-        margin-left: -1px;
-      }
-  ` : "");
-const GenericPopoverMenuPanel = styled.div.withConfig({
-  componentId: "sc-isr9rp-1"
-})(["outline:none;max-width:var(--radix-", "-content-available-width);max-height:var(--radix-", "-content-available-height);overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;z-index:1;", " ", ";"], ({
-  $type
-}) => $type, ({
-  $type
-}) => $type, ({
-  theme
-}) => `
-    border: 1px solid ${theme.click.popover.color.panel.stroke.default};
-    background: ${theme.click.popover.color.panel.background.default};
-    padding: ${theme.click.popover.space.y} ${theme.click.popover.space.x};
-    border-radius: ${theme.click.popover.radii.all};
-    box-shadow: ${theme.click.popover.shadow.default};
-  `, ({
-  $showArrow
-}) => $showArrow ? "margin: -1px 0;" : "");
-const Arrow = styled.svg.withConfig({
-  componentId: "sc-isr9rp-2"
-})(["filter:drop-shadow(rgba(0,0,0,0.1) 0px 4px 6px);", ";"], ({
-  theme
-}) => `
-    fill: ${theme.click.genericMenu.panel.color.background.default};
-    stroke: ${theme.click.genericMenu.panel.color.stroke.default};
-  `);
-const GenericMenuItem = styled.div.withConfig({
-  componentId: "sc-isr9rp-3"
-})(["display:flex;width:100%;width:-moz-available;width:-webkit-fill-available;width:fill-available;width:stretch;align-items:center;justify-content:flex-start;cursor:default;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;&:focus{outline:none;}", ";position:relative;&:hover .dropdown-arrow,&[data-state='open'] .dropdown-arrow{left:0.5rem;}&[hidden]{display:none;}"], ({
-  theme,
-  $type = "default"
-}) => {
-  const colorKey = $type === "danger" ? "danger" : "default";
-  return `
-    padding: ${theme.click.genericMenu.item.space.y} ${theme.click.genericMenu.item.space.x};
-    gap: ${theme.click.genericMenu.item.space.gap};
-    font: ${theme.click.genericMenu.item.typography.label.default};
-    background: ${theme.click.genericMenu.item.color[colorKey].background.default};
-    color: ${theme.click.genericMenu.item.color[colorKey].text.default};
-    &[data-highlighted] {
-      font: ${theme.click.genericMenu.item.typography.label.hover};
-      background: ${theme.click.genericMenu.item.color[colorKey].background.hover};
-      color:${theme.click.genericMenu.item.color[colorKey].text.hover};
-      cursor: pointer;
+const panelVariants = cva(styles["generic-menu-panel"], {
+  variants: {
+    type: {
+      popover: styles["generic-menu-panel_type_popover"],
+      "dropdown-menu": styles["generic-menu-panel_type_dropdown-menu"],
+      "context-menu": styles["generic-menu-panel_type_context-menu"]
+    },
+    showArrow: {
+      true: styles["generic-menu-panel_show-arrow"],
+      false: ""
     }
-    [data-input-modality="keyboard"] &[data-highlighted] {
-      outline: 2px solid ${theme.click.global.color.accent.default};
-      outline-offset: -2px;
-    }
-    &[data-state="open"] {
-      background:${theme.click.genericMenu.item.color[colorKey].background.hover};
-      color:${theme.click.genericMenu.item.color[colorKey].text.hover};
-      font: ${theme.click.genericMenu.item.typography.label.hover};
-      cursor: pointer;
-    }
-    &[data-state="checked"], &[data-selected="true"]  {
-      background:${theme.click.genericMenu.item.color[colorKey].background.active};
-      color:${theme.click.genericMenu.item.color[colorKey].text.active};
-      font: ${theme.click.genericMenu.item.typography.label.active};
-    }
-    &[data-disabled] {
-      color:${theme.click.genericMenu.item.color[colorKey].text.disabled};
-      font: ${theme.click.genericMenu.item.typography.label.disabled};
-      pointer-events: none;
+  },
+  defaultVariants: {
+    showArrow: false
+  }
+});
+const _GenericMenuPanel = ({
+  as,
+  type,
+  showArrow,
+  className,
+  ...props
+}, ref) => {
+  const Component = as ?? "div";
+  return /* @__PURE__ */ jsx(Component, { ref, ...props, className: cn(panelVariants({
+    type,
+    showArrow
+  }), className) });
+};
+const GenericMenuPanel = forwardRef(_GenericMenuPanel);
+const popoverPanelVariants = cva(styles["generic-popover-menu-panel"], {
+  variants: {
+    type: {
+      popover: styles["generic-popover-menu-panel_type_popover"],
+      "hover-card": styles["generic-popover-menu-panel_type_hover-card"]
+    },
+    showArrow: {
+      true: styles["generic-popover-menu-panel_show-arrow"],
+      false: ""
     }
-    &:visited {
-      color: ${theme.click.genericMenu.item.color[colorKey].text.default};
-      a {
-        color: ${theme.click.genericMenu.item.color[colorKey].text.default};
-      }
+  },
+  defaultVariants: {
+    showArrow: false
+  }
+});
+const _GenericPopoverMenuPanel = ({
+  as,
+  type,
+  showArrow,
+  className,
+  ...props
+}, ref) => {
+  const Component = as ?? "div";
+  return /* @__PURE__ */ jsx(Component, { ref, ...props, className: cn(popoverPanelVariants({
+    type,
+    showArrow
+  }), className) });
+};
+const GenericPopoverMenuPanel = forwardRef(_GenericPopoverMenuPanel);
+const _Arrow = ({
+  as,
+  className,
+  ...props
+}, ref) => {
+  const Component = as ?? "svg";
+  return /* @__PURE__ */ jsx(Component, { ref, ...props, className: cn(styles.arrow, className) });
+};
+const Arrow = forwardRef(_Arrow);
+const itemVariants = cva(styles["generic-menu-item"], {
+  variants: {
+    type: {
+      default: styles["generic-menu-item_type_default"],
+      danger: styles["generic-menu-item_type_danger"]
     }
-  `;
+  },
+  defaultVariants: {
+    type: "default"
+  }
 });
+const _GenericMenuItem = ({
+  as,
+  type = "default",
+  className,
+  ...props
+}, ref) => {
+  const Component = as ?? "div";
+  return /* @__PURE__ */ jsx(Component, { ref, ...props, className: cn(itemVariants({
+    type
+  }), className) });
+};
+const GenericMenuItem = forwardRef(_GenericMenuItem);
 
 export { Arrow, GenericMenuItem, GenericMenuPanel, GenericPopoverMenuPanel };
 //# sourceMappingURL=index.js.map

package/dist/esm/components/GenericMenu/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/GenericMenu/GenericMenu.tsx"],"sourcesContent":["import { styled } from 'styled-components';\n\nexport const GenericMenuPanel = styled.div<{\n  $type: 'popover' | 'dropdown-menu' | 'context-menu';\n  $showArrow?: boolean;\n}>`\n  outline: none;\n  max-width: var(--radix-${({ $type }) => $type}-content-available-width);\n  max-height: var(--radix-${({ $type }) => $type}-content-available-height);\n  overflow: hidden;\n  display: flex;\n  align-items: flex-start;\n  pointer-events: auto;\n\n  ${({ theme }) => `\n    border: 1px solid ${theme.click.genericMenu.panel.color.stroke.default};\n    background: ${theme.click.genericMenu.panel.color.background.default};\n    box-shadow: ${theme.click.genericMenu.panel.shadow.default};\n    border-radius: ${theme.click.genericMenu.panel.radii.all};\n  `};\n  ${({ $showArrow }) =>\n    $showArrow\n      ? `\n      &[data-side=\"bottom\"] {\n        margin-top: -1px;\n      }\n      &[data-side=\"top\"] {\n        margin-bottom: 1px;\n      }\n      &[data-side=\"left\"] {\n        margin-right: -1px;\n      }\n      }\n      &[data-side=\"right\"] {\n        margin-left: -1px;\n      }\n  `\n      : ''};\n`;\n\nexport const GenericPopoverMenuPanel = styled.div<{\n  $type: 'popover' | 'hover-card';\n  $showArrow?: boolean;\n}>`\n  outline: none;\n  max-width: var(--radix-${({ $type }) => $type}-content-available-width);\n  max-height: var(--radix-${({ $type }) => $type}-content-available-height);\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  z-index: 1;\n\n  ${({ theme }) => `\n    border: 1px solid ${theme.click.popover.color.panel.stroke.default};\n    background: ${theme.click.popover.color.panel.background.default};\n    padding: ${theme.click.popover.space.y} ${theme.click.popover.space.x};\n    border-radius: ${theme.click.popover.radii.all};\n    box-shadow: ${theme.click.popover.shadow.default};\n  `}\n  ${({ $showArrow }) => ($showArrow ? 'margin: -1px 0;' : '')};\n`;\n\nexport const Arrow = styled.svg`\n  filter: drop-shadow(rgba(0, 0, 0, 0.1) 0px 4px 6px);\n  ${({ theme }) => `\n    fill: ${theme.click.genericMenu.panel.color.background.default};\n    stroke: ${theme.click.genericMenu.panel.color.stroke.default};\n  `};\n`;\n\nexport const GenericMenuItem = styled.div<{ $type?: 'default' | 'danger' }>`\n  display: flex;\n  width: 100%;\n  width: -moz-available;\n  width: -webkit-fill-available;\n  width: fill-available;\n  width: stretch;\n  align-items: center;\n  justify-content: flex-start;\n  cursor: default;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  &:focus {\n    outline: none;\n  }\n\n  ${({ theme, $type = 'default' }) => {\n    const colorKey = $type === 'danger' ? 'danger' : 'default';\n    return `\n    padding: ${theme.click.genericMenu.item.space.y} ${theme.click.genericMenu.item.space.x};\n    gap: ${theme.click.genericMenu.item.space.gap};\n    font: ${theme.click.genericMenu.item.typography.label.default};\n    background: ${theme.click.genericMenu.item.color[colorKey].background.default};\n    color: ${theme.click.genericMenu.item.color[colorKey].text.default};\n    &[data-highlighted] {\n      font: ${theme.click.genericMenu.item.typography.label.hover};\n      background: ${theme.click.genericMenu.item.color[colorKey].background.hover};\n      color:${theme.click.genericMenu.item.color[colorKey].text.hover};\n      cursor: pointer;\n    }\n    [data-input-modality=\"keyboard\"] &[data-highlighted] {\n      outline: 2px solid ${theme.click.global.color.accent.default};\n      outline-offset: -2px;\n    }\n    &[data-state=\"open\"] {\n      background:${theme.click.genericMenu.item.color[colorKey].background.hover};\n      color:${theme.click.genericMenu.item.color[colorKey].text.hover};\n      font: ${theme.click.genericMenu.item.typography.label.hover};\n      cursor: pointer;\n    }\n    &[data-state=\"checked\"], &[data-selected=\"true\"]  {\n      background:${theme.click.genericMenu.item.color[colorKey].background.active};\n      color:${theme.click.genericMenu.item.color[colorKey].text.active};\n      font: ${theme.click.genericMenu.item.typography.label.active};\n    }\n    &[data-disabled] {\n      color:${theme.click.genericMenu.item.color[colorKey].text.disabled};\n      font: ${theme.click.genericMenu.item.typography.label.disabled};\n      pointer-events: none;\n    }\n    &:visited {\n      color: ${theme.click.genericMenu.item.color[colorKey].text.default};\n      a {\n        color: ${theme.click.genericMenu.item.color[colorKey].text.default};\n      }\n    }\n  `;\n  }};\n  position: relative;\n  &:hover .dropdown-arrow,\n  &[data-state='open'] .dropdown-arrow {\n    left: 0.5rem;\n  }\n  &[hidden] {\n    display: none;\n  }\n`;\n"],"names":["GenericMenuPanel","styled","div","withConfig","componentId","$type","theme","click","genericMenu","panel","color","stroke","default","background","shadow","radii","all","$showArrow","GenericPopoverMenuPanel","popover","space","y","x","Arrow","svg","GenericMenuItem","colorKey","item","gap","typography","label","text","hover","global","accent","active","disabled"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/GenericMenu/GenericMenu.tsx"],"sourcesContent":["import { ComponentPropsWithRef, ElementType, ReactNode, forwardRef } from 'react';\nimport { cn, cva } from '@/lib/cva';\nimport styles from './GenericMenu.module.css';\n\nconst panelVariants = cva(styles['generic-menu-panel'], {\n  variants: {\n    type: {\n      popover: styles['generic-menu-panel_type_popover'],\n      'dropdown-menu': styles['generic-menu-panel_type_dropdown-menu'],\n      'context-menu': styles['generic-menu-panel_type_context-menu'],\n    },\n    showArrow: {\n      true: styles['generic-menu-panel_show-arrow'],\n      false: '',\n    },\n  },\n  defaultVariants: {\n    showArrow: false,\n  },\n});\n\ntype GenericMenuPanelOwnProps = {\n  type: 'popover' | 'dropdown-menu' | 'context-menu';\n  showArrow?: boolean;\n};\n\ntype GenericMenuPanelComponent = <T extends ElementType = 'div'>(\n  props: Omit<ComponentPropsWithRef<T>, keyof GenericMenuPanelOwnProps | 'as'> &\n    GenericMenuPanelOwnProps & { as?: T }\n) => ReactNode;\n\nconst _GenericMenuPanel = <T extends ElementType = 'div'>(\n  {\n    as,\n    type,\n    showArrow,\n    className,\n    ...props\n  }: Omit<ComponentPropsWithRef<T>, keyof GenericMenuPanelOwnProps | 'as'> &\n    GenericMenuPanelOwnProps & { as?: T },\n  ref: ComponentPropsWithRef<T>['ref']\n) => {\n  const Component = as ?? 'div';\n  return (\n    <Component\n      ref={ref}\n      {...props}\n      className={cn(panelVariants({ type, showArrow }), className)}\n    />\n  );\n};\n\nexport const GenericMenuPanel: GenericMenuPanelComponent = forwardRef(_GenericMenuPanel);\n\nconst popoverPanelVariants = cva(styles['generic-popover-menu-panel'], {\n  variants: {\n    type: {\n      popover: styles['generic-popover-menu-panel_type_popover'],\n      'hover-card': styles['generic-popover-menu-panel_type_hover-card'],\n    },\n    showArrow: {\n      true: styles['generic-popover-menu-panel_show-arrow'],\n      false: '',\n    },\n  },\n  defaultVariants: {\n    showArrow: false,\n  },\n});\n\ntype GenericPopoverMenuPanelOwnProps = {\n  type: 'popover' | 'hover-card';\n  showArrow?: boolean;\n};\n\ntype GenericPopoverMenuPanelComponent = <T extends ElementType = 'div'>(\n  props: Omit<ComponentPropsWithRef<T>, keyof GenericPopoverMenuPanelOwnProps | 'as'> &\n    GenericPopoverMenuPanelOwnProps & { as?: T }\n) => ReactNode;\n\nconst _GenericPopoverMenuPanel = <T extends ElementType = 'div'>(\n  {\n    as,\n    type,\n    showArrow,\n    className,\n    ...props\n  }: Omit<ComponentPropsWithRef<T>, keyof GenericPopoverMenuPanelOwnProps | 'as'> &\n    GenericPopoverMenuPanelOwnProps & { as?: T },\n  ref: ComponentPropsWithRef<T>['ref']\n) => {\n  const Component = as ?? 'div';\n  return (\n    <Component\n      ref={ref}\n      {...props}\n      className={cn(popoverPanelVariants({ type, showArrow }), className)}\n    />\n  );\n};\n\nexport const GenericPopoverMenuPanel: GenericPopoverMenuPanelComponent = forwardRef(\n  _GenericPopoverMenuPanel\n);\n\ntype ArrowComponent = <T extends ElementType = 'svg'>(\n  props: Omit<ComponentPropsWithRef<T>, 'as'> & { as?: T }\n) => ReactNode;\n\nconst _Arrow = <T extends ElementType = 'svg'>(\n  { as, className, ...props }: Omit<ComponentPropsWithRef<T>, 'as'> & { as?: T },\n  ref: ComponentPropsWithRef<T>['ref']\n) => {\n  const Component = as ?? 'svg';\n  return (\n    <Component\n      ref={ref}\n      {...props}\n      className={cn(styles.arrow, className)}\n    />\n  );\n};\n\nexport const Arrow: ArrowComponent = forwardRef(_Arrow);\n\nconst itemVariants = cva(styles['generic-menu-item'], {\n  variants: {\n    type: {\n      default: styles['generic-menu-item_type_default'],\n      danger: styles['generic-menu-item_type_danger'],\n    },\n  },\n  defaultVariants: {\n    type: 'default',\n  },\n});\n\ntype GenericMenuItemOwnProps = {\n  type?: 'default' | 'danger';\n};\n\ntype GenericMenuItemComponent = <T extends ElementType = 'div'>(\n  props: Omit<ComponentPropsWithRef<T>, keyof GenericMenuItemOwnProps | 'as'> &\n    GenericMenuItemOwnProps & { as?: T }\n) => ReactNode;\n\nconst _GenericMenuItem = <T extends ElementType = 'div'>(\n  {\n    as,\n    type = 'default',\n    className,\n    ...props\n  }: Omit<ComponentPropsWithRef<T>, keyof GenericMenuItemOwnProps | 'as'> &\n    GenericMenuItemOwnProps & { as?: T },\n  ref: ComponentPropsWithRef<T>['ref']\n) => {\n  const Component = as ?? 'div';\n  return (\n    <Component\n      ref={ref}\n      {...props}\n      className={cn(itemVariants({ type }), className)}\n    />\n  );\n};\n\nexport const GenericMenuItem: GenericMenuItemComponent = forwardRef(_GenericMenuItem);\n"],"names":["panelVariants","cva","styles","variants","type","popover","showArrow","true","false","defaultVariants","_GenericMenuPanel","as","className","props","ref","Component","cn","GenericMenuPanel","forwardRef","popoverPanelVariants","_GenericPopoverMenuPanel","GenericPopoverMenuPanel","_Arrow","arrow","Arrow","itemVariants","default","danger","_GenericMenuItem","GenericMenuItem"],"mappings":"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"}

package/dist/esm/components/HoverCard/index.js

@@ -30,7 +30,7 @@ const HoverCardContent = ({
   ...props
 }) => {
   const portalContainer = useResolvedPortalContainer(container);
-  return /* @__PURE__ */ jsx(RadixHoverCard.Portal, { forceMount, container: portalContainer, children: /* @__PURE__ */ jsxs(GenericPopoverMenuPanel, { as: RadixHoverCard.Content, $type: "hover-card", $showArrow: showArrow, ...props, children: [
+  return /* @__PURE__ */ jsx(RadixHoverCard.Portal, { forceMount, container: portalContainer, children: /* @__PURE__ */ jsxs(GenericPopoverMenuPanel, { as: RadixHoverCard.Content, type: "hover-card", showArrow, ...props, children: [
     showArrow && /* @__PURE__ */ jsx(Arrow, { asChild: true, as: RadixHoverCard.Arrow, width: 15, height: 10, children: /* @__PURE__ */ jsx(Popover_Arrow, {}) }),
     children
   ] }) });

package/dist/esm/components/HoverCard/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/HoverCard/HoverCard.tsx"],"sourcesContent":["import * as RadixHoverCard from '@radix-ui/react-hover-card';\nimport { ReactNode } from 'react';\nimport { Arrow, GenericPopoverMenuPanel } from '@/components/GenericMenu';\nimport { cn } from '@/lib/cva';\nimport Popover_Arrow from '@/components/Assets/Icons/Popover-Arrow';\nimport { useResolvedPortalContainer } from '@/providers/PortalContext';\nimport styles from './HoverCard.module.css';\n\nexport interface HoverCardContentProps extends RadixHoverCard.HoverCardContentProps {\n  showArrow?: boolean;\n  forceMount?: true;\n  container?: HTMLElement | null;\n  children: ReactNode;\n}\n\nexport const HoverCard = ({ children, ...props }: RadixHoverCard.HoverCardProps) => {\n  return <RadixHoverCard.Root {...props}>{children}</RadixHoverCard.Root>;\n};\n\nconst HoverCardTrigger = ({\n  children,\n  className,\n  ...props\n}: RadixHoverCard.HoverCardTriggerProps) => {\n  return (\n    <RadixHoverCard.Trigger\n      {...props}\n      className={cn(styles['hover-card__trigger'], className)}\n    >\n      {children}\n    </RadixHoverCard.Trigger>\n  );\n};\nHoverCardTrigger.displayName = 'HoverCardTrigger';\nHoverCard.Trigger = HoverCardTrigger;\n\nconst HoverCardContent = ({\n  children,\n  showArrow,\n  forceMount,\n  container,\n  ...props\n}: HoverCardContentProps) => {\n  const portalContainer = useResolvedPortalContainer(container);\n\n  return (\n    <RadixHoverCard.Portal\n      forceMount={forceMount}\n      container={portalContainer}\n    >\n      <GenericPopoverMenuPanel\n        as={RadixHoverCard.Content}\n        $type=\"hover-card\"\n        $showArrow={showArrow}\n        {...props}\n      >\n        {showArrow && (\n          <Arrow\n            asChild\n            as={RadixHoverCard.Arrow}\n            width={15}\n            height={10}\n          >\n            <Popover_Arrow />\n          </Arrow>\n        )}\n        {children}\n      </GenericPopoverMenuPanel>\n    </RadixHoverCard.Portal>\n  );\n};\nHoverCardContent.displayName = 'HoverCardContent';\nHoverCard.Content = HoverCardContent;\n"],"names":["HoverCard","children","props","HoverCardTrigger","className","cn","styles","displayName","Trigger","HoverCardContent","showArrow","forceMount","container","portalContainer","useResolvedPortalContainer","RadixHoverCard","Content","Arrow"],"mappings":";;;;;;;;AAeO,MAAMA,YAAYA,CAAC;AAAA,EAAEC,QAAAA;AAAAA,EAAU,GAAGC;AAAqC,CAAA,KAAM;AAClF,EAAA,2BAAQ,cAAA,CAAe,IAAA,EAAf,KAAwBA,OAAQD,QAAAA,EAAS,CAAA;AACnD;AAEA,MAAME,mBAAmBA,CAAC;AAAA,EACxBF,QAAAA;AAAAA,EACAG,SAAAA;AAAAA,EACA,GAAGF;AACiC,CAAA,KAAM;AAC1C,EAAA,uBACE,GAAA,CAAC,cAAA,CAAe,OAAA,EAAf,EACC,GAAIA,KAAAA,EACJ,SAAA,EAAWG,EAAAA,CAAGC,MAAAA,CAAO,qBAAqB,CAAA,EAAGF,SAAS,GAErDH,QAAAA,EACH,CAAA;AAEJ,CAAA;AACAE,gBAAAA,CAAiBI,WAAAA,GAAc,kBAAA;AAC/BP,SAAAA,CAAUQ,OAAAA,GAAUL,gBAAAA;AAEpB,MAAMM,mBAAmBA,CAAC;AAAA,EACxBR,QAAAA;AAAAA,EACAS,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACA,GAAGV;AACkB,CAAA,KAAM;AAC3B,EAAA,MAAMW,eAAAA,GAAkBC,2BAA2BF,SAAS,CAAA;AAE5D,EAAA,2BACG,cAAA,CAAe,MAAA,EAAf,EACC,UAAA,EACA,WAAWC,eAAAA,EAEX,QAAA,kBAAA,IAAA,CAAC,uBAAA,EAAA,EACC,EAAA,EAAIE,eAAeC,OAAAA,EACnB,KAAA,EAAM,cACN,UAAA,EAAYN,SAAAA,EACZ,GAAIR,KAAAA,EAEHQ,QAAAA,EAAAA;AAAAA,IAAAA,SAAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EACC,OAAA,EAAO,IAAA,EACP,EAAA,EAAIK,cAAAA,CAAeE,KAAAA,EACnB,KAAA,EAAO,EAAA,EACP,MAAA,EAAQ,EAAA,EAER,QAAA,kBAAA,GAAA,CAAC,iBAAa,CAAA,EAChB,CAAA;AAAA,IAEDhB;AAAAA,GAAAA,EACH,CAAA,EACF,CAAA;AAEJ,CAAA;AACAQ,gBAAAA,CAAiBF,WAAAA,GAAc,kBAAA;AAC/BP,SAAAA,CAAUgB,OAAAA,GAAUP,gBAAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/HoverCard/HoverCard.tsx"],"sourcesContent":["import * as RadixHoverCard from '@radix-ui/react-hover-card';\nimport { ReactNode } from 'react';\nimport { Arrow, GenericPopoverMenuPanel } from '@/components/GenericMenu';\nimport { cn } from '@/lib/cva';\nimport Popover_Arrow from '@/components/Assets/Icons/Popover-Arrow';\nimport { useResolvedPortalContainer } from '@/providers/PortalContext';\nimport styles from './HoverCard.module.css';\n\nexport interface HoverCardContentProps extends RadixHoverCard.HoverCardContentProps {\n  showArrow?: boolean;\n  forceMount?: true;\n  container?: HTMLElement | null;\n  children: ReactNode;\n}\n\nexport const HoverCard = ({ children, ...props }: RadixHoverCard.HoverCardProps) => {\n  return <RadixHoverCard.Root {...props}>{children}</RadixHoverCard.Root>;\n};\n\nconst HoverCardTrigger = ({\n  children,\n  className,\n  ...props\n}: RadixHoverCard.HoverCardTriggerProps) => {\n  return (\n    <RadixHoverCard.Trigger\n      {...props}\n      className={cn(styles['hover-card__trigger'], className)}\n    >\n      {children}\n    </RadixHoverCard.Trigger>\n  );\n};\nHoverCardTrigger.displayName = 'HoverCardTrigger';\nHoverCard.Trigger = HoverCardTrigger;\n\nconst HoverCardContent = ({\n  children,\n  showArrow,\n  forceMount,\n  container,\n  ...props\n}: HoverCardContentProps) => {\n  const portalContainer = useResolvedPortalContainer(container);\n\n  return (\n    <RadixHoverCard.Portal\n      forceMount={forceMount}\n      container={portalContainer}\n    >\n      <GenericPopoverMenuPanel\n        as={RadixHoverCard.Content}\n        type=\"hover-card\"\n        showArrow={showArrow}\n        {...props}\n      >\n        {showArrow && (\n          <Arrow\n            asChild\n            as={RadixHoverCard.Arrow}\n            width={15}\n            height={10}\n          >\n            <Popover_Arrow />\n          </Arrow>\n        )}\n        {children}\n      </GenericPopoverMenuPanel>\n    </RadixHoverCard.Portal>\n  );\n};\nHoverCardContent.displayName = 'HoverCardContent';\nHoverCard.Content = HoverCardContent;\n"],"names":["HoverCard","children","props","HoverCardTrigger","className","cn","styles","displayName","Trigger","HoverCardContent","showArrow","forceMount","container","portalContainer","useResolvedPortalContainer","RadixHoverCard","Content","Arrow"],"mappings":";;;;;;;;AAeO,MAAMA,YAAYA,CAAC;AAAA,EAAEC,QAAAA;AAAAA,EAAU,GAAGC;AAAqC,CAAA,KAAM;AAClF,EAAA,2BAAQ,cAAA,CAAe,IAAA,EAAf,KAAwBA,OAAQD,QAAAA,EAAS,CAAA;AACnD;AAEA,MAAME,mBAAmBA,CAAC;AAAA,EACxBF,QAAAA;AAAAA,EACAG,SAAAA;AAAAA,EACA,GAAGF;AACiC,CAAA,KAAM;AAC1C,EAAA,uBACE,GAAA,CAAC,cAAA,CAAe,OAAA,EAAf,EACC,GAAIA,KAAAA,EACJ,SAAA,EAAWG,EAAAA,CAAGC,MAAAA,CAAO,qBAAqB,CAAA,EAAGF,SAAS,GAErDH,QAAAA,EACH,CAAA;AAEJ,CAAA;AACAE,gBAAAA,CAAiBI,WAAAA,GAAc,kBAAA;AAC/BP,SAAAA,CAAUQ,OAAAA,GAAUL,gBAAAA;AAEpB,MAAMM,mBAAmBA,CAAC;AAAA,EACxBR,QAAAA;AAAAA,EACAS,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACA,GAAGV;AACkB,CAAA,KAAM;AAC3B,EAAA,MAAMW,eAAAA,GAAkBC,2BAA2BF,SAAS,CAAA;AAE5D,EAAA,2BACG,cAAA,CAAe,MAAA,EAAf,EACC,UAAA,EACA,WAAWC,eAAAA,EAEX,QAAA,kBAAA,IAAA,CAAC,uBAAA,EAAA,EACC,EAAA,EAAIE,eAAeC,OAAAA,EACnB,IAAA,EAAK,YAAA,EACL,SAAA,EACA,GAAId,KAAAA,EAEHQ,QAAAA,EAAAA;AAAAA,IAAAA,SAAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EACC,OAAA,EAAO,IAAA,EACP,EAAA,EAAIK,cAAAA,CAAeE,KAAAA,EACnB,KAAA,EAAO,EAAA,EACP,MAAA,EAAQ,EAAA,EAER,QAAA,kBAAA,GAAA,CAAC,iBAAa,CAAA,EAChB,CAAA;AAAA,IAEDhB;AAAAA,GAAAA,EACH,CAAA,EACF,CAAA;AAEJ,CAAA;AACAQ,gBAAAA,CAAiBF,WAAAA,GAAc,kBAAA;AAC/BP,SAAAA,CAAUgB,OAAAA,GAAUP,gBAAAA;;;;"}

package/dist/esm/components/IconButton/index.js

@@ -28,6 +28,7 @@ const iconButtonVariants = cva(styles.iconbutton, {
 });
 const IconButton = forwardRef(({
   type = "primary",
+  htmlType,
   icon,
   size,
   disabled,
@@ -35,7 +36,7 @@ const IconButton = forwardRef(({
   ...props
 }, ref) => {
   const iconName = icon ? icon.toString() : "unknown icon";
-  return /* @__PURE__ */ jsx("button", { ...props, className: cn(iconButtonVariants({
+  return /* @__PURE__ */ jsx("button", { ...props, type: htmlType, className: cn(iconButtonVariants({
     type,
     size
   }), className), disabled, ref, role: "button", "aria-label": iconName, children: /* @__PURE__ */ jsx(SvgImage, { name: icon, size: "sm" }) });

package/dist/esm/components/IconButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { Icon } from '@/components/Icon';\nimport { cn, cva } from '@/lib/cva';\nimport { IconButtonProps } from './IconButton.types';\nimport styles from './IconButton.module.css';\n\nconst iconButtonVariants = cva(styles.iconbutton, {\n  variants: {\n    type: {\n      primary: styles['iconbutton_type_primary'],\n      secondary: styles['iconbutton_type_secondary'],\n      ghost: styles['iconbutton_type_ghost'],\n      danger: styles['iconbutton_type_danger'],\n      info: styles['iconbutton_type_info'],\n    },\n    size: {\n      default: '',\n      sm: styles['iconbutton_size_sm'],\n      xs: styles['iconbutton_size_xs'],\n    },\n  },\n  defaultVariants: {\n    type: 'primary',\n    size: 'default',\n  },\n});\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n  ({ type = 'primary', icon, size, disabled, className, ...props }, ref) => {\n    const iconName = icon ? icon.toString() : 'unknown icon';\n\n    return (\n      <button\n        {...props}\n        className={cn(iconButtonVariants({ type, size }), className)}\n        disabled={disabled}\n        ref={ref}\n        role=\"button\"\n        aria-label={iconName}\n      >\n        <Icon\n          name={icon}\n          size=\"sm\"\n        />\n      </button>\n    );\n  }\n);\n\nIconButton.displayName = 'IconButton';\n"],"names":["iconButtonVariants","cva","styles","iconbutton","variants","type","primary","secondary","ghost","danger","info","size","default","sm","xs","defaultVariants","IconButton","forwardRef","icon","disabled","className","props","ref","iconName","toString","cn","Icon","displayName"],"mappings":";;;;;;;AAMA,MAAMA,kBAAAA,GAAqBC,GAAAA,CAAIC,MAAAA,CAAOC,UAAAA,EAAY;AAAA,EAChDC,QAAAA,EAAU;AAAA,IACRC,IAAAA,EAAM;AAAA,MACJC,OAAAA,EAASJ,OAAO,yBAAyB,CAAA;AAAA,MACzCK,SAAAA,EAAWL,OAAO,2BAA2B,CAAA;AAAA,MAC7CM,KAAAA,EAAON,OAAO,uBAAuB,CAAA;AAAA,MACrCO,MAAAA,EAAQP,OAAO,wBAAwB,CAAA;AAAA,MACvCQ,IAAAA,EAAMR,OAAO,sBAAsB;AAAA,KACrC;AAAA,IACAS,IAAAA,EAAM;AAAA,MACJC,OAAAA,EAAS,EAAA;AAAA,MACTC,EAAAA,EAAIX,OAAO,oBAAoB,CAAA;AAAA,MAC/BY,EAAAA,EAAIZ,OAAO,oBAAoB;AAAA;AACjC,GACF;AAAA,EACAa,eAAAA,EAAiB;AAAA,IACfV,IAAAA,EAAM,SAAA;AAAA,IACNM,IAAAA,EAAM;AAAA;AAEV,CAAC,CAAA;AAEM,MAAMK,UAAAA,GAAaC,WACxB,CAAC;AAAA,EAAEZ,IAAAA,GAAO,SAAA;AAAA,EAAWa,IAAAA;AAAAA,EAAMP,IAAAA;AAAAA,EAAMQ,QAAAA;AAAAA,EAAUC,SAAAA;AAAAA,EAAW,GAAGC;AAAM,CAAA,EAAGC,GAAAA,KAAQ;AACxE,EAAA,MAAMC,QAAAA,GAAWL,IAAAA,GAAOA,IAAAA,CAAKM,QAAAA,EAAS,GAAI,cAAA;AAE1C,EAAA,2BACG,QAAA,EAAA,EACC,GAAIH,KAAAA,EACJ,SAAA,EAAWI,GAAGzB,kBAAAA,CAAmB;AAAA,IAAEK,IAAAA;AAAAA,IAAMM;AAAAA,GAAM,CAAA,EAAGS,SAAS,CAAA,EAC3D,QAAA,EACA,KACA,IAAA,EAAK,QAAA,EACL,YAAA,EAAYG,QAAAA,EAEZ,8BAACG,QAAA,EAAA,EACC,IAAA,EAAMR,IAAAA,EACN,IAAA,EAAK,MAAI,CAAA,EAEb,CAAA;AAEJ,CACF;AAEAF,UAAAA,CAAWW,WAAAA,GAAc,YAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { Icon } from '@/components/Icon';\nimport { cn, cva } from '@/lib/cva';\nimport { IconButtonProps } from './IconButton.types';\nimport styles from './IconButton.module.css';\n\nconst iconButtonVariants = cva(styles.iconbutton, {\n  variants: {\n    type: {\n      primary: styles['iconbutton_type_primary'],\n      secondary: styles['iconbutton_type_secondary'],\n      ghost: styles['iconbutton_type_ghost'],\n      danger: styles['iconbutton_type_danger'],\n      info: styles['iconbutton_type_info'],\n    },\n    size: {\n      default: '',\n      sm: styles['iconbutton_size_sm'],\n      xs: styles['iconbutton_size_xs'],\n    },\n  },\n  defaultVariants: {\n    type: 'primary',\n    size: 'default',\n  },\n});\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n  ({ type = 'primary', htmlType, icon, size, disabled, className, ...props }, ref) => {\n    const iconName = icon ? icon.toString() : 'unknown icon';\n\n    return (\n      <button\n        {...props}\n        type={htmlType}\n        className={cn(iconButtonVariants({ type, size }), className)}\n        disabled={disabled}\n        ref={ref}\n        role=\"button\"\n        aria-label={iconName}\n      >\n        <Icon\n          name={icon}\n          size=\"sm\"\n        />\n      </button>\n    );\n  }\n);\n\nIconButton.displayName = 'IconButton';\n"],"names":["iconButtonVariants","cva","styles","iconbutton","variants","type","primary","secondary","ghost","danger","info","size","default","sm","xs","defaultVariants","IconButton","forwardRef","htmlType","icon","disabled","className","props","ref","iconName","toString","cn","Icon","displayName"],"mappings":";;;;;;;AAMA,MAAMA,kBAAAA,GAAqBC,GAAAA,CAAIC,MAAAA,CAAOC,UAAAA,EAAY;AAAA,EAChDC,QAAAA,EAAU;AAAA,IACRC,IAAAA,EAAM;AAAA,MACJC,OAAAA,EAASJ,OAAO,yBAAyB,CAAA;AAAA,MACzCK,SAAAA,EAAWL,OAAO,2BAA2B,CAAA;AAAA,MAC7CM,KAAAA,EAAON,OAAO,uBAAuB,CAAA;AAAA,MACrCO,MAAAA,EAAQP,OAAO,wBAAwB,CAAA;AAAA,MACvCQ,IAAAA,EAAMR,OAAO,sBAAsB;AAAA,KACrC;AAAA,IACAS,IAAAA,EAAM;AAAA,MACJC,OAAAA,EAAS,EAAA;AAAA,MACTC,EAAAA,EAAIX,OAAO,oBAAoB,CAAA;AAAA,MAC/BY,EAAAA,EAAIZ,OAAO,oBAAoB;AAAA;AACjC,GACF;AAAA,EACAa,eAAAA,EAAiB;AAAA,IACfV,IAAAA,EAAM,SAAA;AAAA,IACNM,IAAAA,EAAM;AAAA;AAEV,CAAC,CAAA;AAEM,MAAMK,UAAAA,GAAaC,WACxB,CAAC;AAAA,EAAEZ,IAAAA,GAAO,SAAA;AAAA,EAAWa,QAAAA;AAAAA,EAAUC,IAAAA;AAAAA,EAAMR,IAAAA;AAAAA,EAAMS,QAAAA;AAAAA,EAAUC,SAAAA;AAAAA,EAAW,GAAGC;AAAM,CAAA,EAAGC,GAAAA,KAAQ;AAClF,EAAA,MAAMC,QAAAA,GAAWL,IAAAA,GAAOA,IAAAA,CAAKM,QAAAA,EAAS,GAAI,cAAA;AAE1C,EAAA,uBACE,GAAA,CAAC,eACKH,KAAAA,EACJ,MAAMJ,QAAAA,EACN,SAAA,EAAWQ,GAAG1B,kBAAAA,CAAmB;AAAA,IAAEK,IAAAA;AAAAA,IAAMM;AAAAA,GAAM,CAAA,EAAGU,SAAS,CAAA,EAC3D,QAAA,EACA,KACA,IAAA,EAAK,QAAA,EACL,YAAA,EAAYG,QAAAA,EAEZ,8BAACG,QAAA,EAAA,EACC,IAAA,EAAMR,IAAAA,EACN,IAAA,EAAK,MAAI,CAAA,EAEb,CAAA;AAEJ,CACF;AAEAH,UAAAA,CAAWY,WAAAA,GAAc,YAAA;;;;"}