@ayasofyazilim/ui 0.0.0 → 0.0.2

package/dist/custom/stepper.js

@@ -0,0 +1,166 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import React, {
+  Children,
+  createContext,
+  useContext,
+  useMemo
+} from "react";
+import { Button } from "@repo/ayasofyazilim-ui/components/button";
+import { cn } from "@repo/ayasofyazilim-ui/lib/utils";
+const Separator = ({ vertical }) => {
+  const containerClass = `border-muted items-center justify-center flex ${vertical ? "w-1" : "h-8 w-full"}`;
+  const innerClass = `bg-muted w-full ${vertical ? "h-16" : "h-1"}`;
+  return /* @__PURE__ */ jsx("div", { className: containerClass, children: /* @__PURE__ */ jsx("div", { className: innerClass }) });
+};
+const StepperContent = ({
+  children,
+  title,
+  canGoBack = true,
+  canGoNext = true,
+  previousButtonText,
+  nextButtonText,
+  isBackDisabled,
+  isNextDisabled,
+  className,
+  controlsClassName
+}) => {
+  const {
+    previousButtonText: defaultPreviousButtonText,
+    nextButtonText: defaultNextButtonText,
+    onIndexChange,
+    vertical,
+    stepsLength
+  } = useContext(StepperContext);
+  const [isLastStep, setIsLastStep] = React.useState(false);
+  return /* @__PURE__ */ jsxs("div", { id: title, className: cn(vertical ? "w-10/12" : "w-full", className), children: [
+    children,
+    onIndexChange && /* @__PURE__ */ jsxs("div", { className: cn("mt-5 flex justify-between", controlsClassName), children: [
+      /* @__PURE__ */ jsx("div", { children: canGoBack && /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          disabled: isBackDisabled,
+          onClick: () => onIndexChange((prev) => {
+            if (prev > 0) {
+              return prev - 1;
+            }
+            return prev;
+          }),
+          children: previousButtonText || defaultPreviousButtonText
+        }
+      ) }),
+      /* @__PURE__ */ jsx("div", { children: canGoNext && /* @__PURE__ */ jsx(
+        Button,
+        {
+          disabled: isNextDisabled || isLastStep,
+          onClick: () => onIndexChange((prev) => {
+            if (prev === stepsLength - 1) {
+              setIsLastStep(true);
+            }
+            if (prev < stepsLength - 1) {
+              return prev + 1;
+            }
+            return prev;
+          }),
+          children: nextButtonText || defaultNextButtonText
+        }
+      ) })
+    ] })
+  ] });
+};
+const StepperHeader = ({
+  keysWithSeparator,
+  activeTabIndex,
+  vertical,
+  containerClassName,
+  activeItemClassName,
+  inactiveItemClassName
+}) => {
+  const containerClass = cn(
+    `flex gap-5 justify-between relative mb-10 ${vertical ? "flex-col items-center w-2/12" : "w-full"}`,
+    containerClassName
+  );
+  const activeItemClass = cn("bg-primary text-white", activeItemClassName);
+  const inactiveItemClass = cn("bg-zinc-200 text-black", inactiveItemClassName);
+  return /* @__PURE__ */ jsx("div", { className: containerClass, children: keysWithSeparator?.map((item, index) => {
+    if (typeof item === "string") {
+      return /* @__PURE__ */ jsx(
+        Separator,
+        {
+          vertical
+        },
+        `separator-${index.toString()}`
+      );
+    }
+    const active = activeTabIndex === item.index;
+    const innerClass = `rounded-full w-8 h-8 items-center justify-center flex text-xs ${active ? activeItemClass : inactiveItemClass}`;
+    const titleContainerClass = `text-sm text-center ${active ? "text-black" : "text-muted-foreground"}`;
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2", children: [
+      /* @__PURE__ */ jsx("div", { className: innerClass, children: item.icon || item.index + 1 }),
+      /* @__PURE__ */ jsx("div", { className: titleContainerClass, children: item.title })
+    ] }, item.index);
+  }) });
+};
+const StepperContext = createContext({
+  nextButtonText: "Next",
+  previousButtonText: "Previous",
+  // eslint-disable-next-line
+  onIndexChange: (value) => {
+  },
+  vertical: false,
+  stepsLength: 2
+});
+function Stepper({
+  children,
+  activeTabIndex,
+  vertical = false,
+  nextButtonText = "Next",
+  previousButtonText = "Previous",
+  onIndexChange,
+  className,
+  headerProps
+}) {
+  const keys = children?.flatMap((child, index) => {
+    const item = React.isValidElement(child) ? {
+      title: child.props.title || "",
+      icon: child.props.icon,
+      index
+    } : { title: "", icon: "", index };
+    if (index === 0) {
+      return [item];
+    }
+    return ["SEPARATOR", item];
+  });
+  const stepsLength = Children.count(children);
+  const providerProps = useMemo(
+    () => ({
+      nextButtonText,
+      previousButtonText,
+      onIndexChange,
+      vertical,
+      stepsLength
+    }),
+    [nextButtonText, previousButtonText, onIndexChange, vertical, stepsLength]
+  );
+  const filteredChildren = React.Children.toArray(children)?.[activeTabIndex];
+  return /* @__PURE__ */ jsx(StepperContext.Provider, { value: providerProps, children: /* @__PURE__ */ jsxs("div", { className: cn(vertical ? "flex flex-row gap-10" : "", className), children: [
+    /* @__PURE__ */ jsx(
+      StepperHeader,
+      {
+        keysWithSeparator: keys,
+        activeTabIndex,
+        vertical,
+        ...headerProps
+      }
+    ),
+    filteredChildren
+  ] }) });
+}
+export {
+  Separator,
+  StepperContent,
+  StepperHeader,
+  Stepper as default
+};
+//# sourceMappingURL=stepper.js.map

package/dist/custom/stepper.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/custom/stepper.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, {\r\n  Children,\r\n  Dispatch,\r\n  SetStateAction,\r\n  createContext,\r\n  useContext,\r\n  useMemo,\r\n} from \"react\";\r\nimport { Button } from \"@repo/ayasofyazilim-ui/components/button\";\r\nimport { cn } from \"@repo/ayasofyazilim-ui/lib/utils\";\r\n\r\nexport interface ISeparatorProps {\r\n  vertical?: boolean;\r\n}\r\nexport const Separator = ({ vertical }: ISeparatorProps) => {\r\n  const containerClass = `border-muted items-center justify-center flex ${\r\n    vertical ? \"w-1\" : \"h-8 w-full\"\r\n  }`;\r\n  const innerClass = `bg-muted w-full ${vertical ? \"h-16\" : \"h-1\"}`;\r\n\r\n  return (\r\n    <div className={containerClass}>\r\n      <div className={innerClass} />\r\n    </div>\r\n  );\r\n};\r\n\r\nexport interface IStepperContentProps {\r\n  canGoBack?: boolean;\r\n  canGoNext?: boolean;\r\n  children?: React.ReactNode;\r\n  className?: string;\r\n  controlsClassName?: string;\r\n  isBackDisabled?: boolean;\r\n  isNextDisabled?: boolean;\r\n  nextButtonText?: string;\r\n  previousButtonText?: string;\r\n  title?: string;\r\n}\r\nexport const StepperContent = ({\r\n  children,\r\n  title,\r\n  canGoBack = true,\r\n  canGoNext = true,\r\n  previousButtonText,\r\n  nextButtonText,\r\n  isBackDisabled,\r\n  isNextDisabled,\r\n  className,\r\n  controlsClassName,\r\n}: IStepperContentProps) => {\r\n  const {\r\n    previousButtonText: defaultPreviousButtonText,\r\n    nextButtonText: defaultNextButtonText,\r\n    onIndexChange,\r\n    vertical,\r\n    stepsLength,\r\n  } = useContext(StepperContext);\r\n  const [isLastStep, setIsLastStep] = React.useState(false);\r\n  return (\r\n    <div id={title} className={cn(vertical ? \"w-10/12\" : \"w-full\", className)}>\r\n      {children}\r\n      {onIndexChange && (\r\n        <div className={cn(\"mt-5 flex justify-between\", controlsClassName)}>\r\n          <div>\r\n            {canGoBack && (\r\n              <Button\r\n                variant=\"outline\"\r\n                disabled={isBackDisabled}\r\n                onClick={() =>\r\n                  onIndexChange((prev) => {\r\n                    if (prev > 0) {\r\n                      return prev - 1;\r\n                    }\r\n                    return prev;\r\n                  })\r\n                }\r\n              >\r\n                {previousButtonText || defaultPreviousButtonText}\r\n              </Button>\r\n            )}\r\n          </div>\r\n          <div>\r\n            {canGoNext && (\r\n              <Button\r\n                disabled={isNextDisabled || isLastStep}\r\n                onClick={() =>\r\n                  onIndexChange((prev) => {\r\n                    if (prev === stepsLength - 1) {\r\n                      setIsLastStep(true);\r\n                    }\r\n                    if (prev < stepsLength - 1) {\r\n                      return prev + 1;\r\n                    }\r\n                    return prev;\r\n                  })\r\n                }\r\n              >\r\n                {nextButtonText || defaultNextButtonText}\r\n              </Button>\r\n            )}\r\n          </div>\r\n        </div>\r\n      )}\r\n    </div>\r\n  );\r\n};\r\n\r\nexport interface IStepperHeaderProps {\r\n  activeItemClassName?: string;\r\n  activeTabIndex: number;\r\n  containerClassName?: string;\r\n  inactiveItemClassName?: string;\r\n  keysWithSeparator:\r\n    | (string | { icon: React.ReactNode; index: number; title: string })[]\r\n    | undefined;\r\n  vertical?: boolean;\r\n}\r\n\r\nexport const StepperHeader = ({\r\n  keysWithSeparator,\r\n  activeTabIndex,\r\n  vertical,\r\n  containerClassName,\r\n  activeItemClassName,\r\n  inactiveItemClassName,\r\n}: IStepperHeaderProps) => {\r\n  const containerClass = cn(\r\n    `flex gap-5 justify-between relative mb-10 ${\r\n      vertical ? \"flex-col items-center w-2/12\" : \"w-full\"\r\n    }`,\r\n    containerClassName\r\n  );\r\n  const activeItemClass = cn(\"bg-primary text-white\", activeItemClassName);\r\n  const inactiveItemClass = cn(\"bg-zinc-200 text-black\", inactiveItemClassName);\r\n\r\n  return (\r\n    <div className={containerClass}>\r\n      {keysWithSeparator?.map((item, index) => {\r\n        if (typeof item === \"string\") {\r\n          return (\r\n            <Separator\r\n              key={`separator-${index.toString()}`}\r\n              vertical={vertical}\r\n            />\r\n          );\r\n        }\r\n\r\n        const active = activeTabIndex === item.index;\r\n        const innerClass = `rounded-full w-8 h-8 items-center justify-center flex text-xs ${\r\n          active ? activeItemClass : inactiveItemClass\r\n        }`;\r\n        const titleContainerClass = `text-sm text-center ${\r\n          active ? \"text-black\" : \"text-muted-foreground\"\r\n        }`;\r\n        return (\r\n          <div key={item.index} className=\"flex flex-col items-center gap-2\">\r\n            <div className={innerClass}>{item.icon || item.index + 1}</div>\r\n            <div className={titleContainerClass}>{item.title}</div>\r\n          </div>\r\n        );\r\n      })}\r\n    </div>\r\n  );\r\n};\r\n\r\nconst StepperContext = createContext({\r\n  nextButtonText: \"Next\",\r\n  previousButtonText: \"Previous\",\r\n  // eslint-disable-next-line\r\n  onIndexChange: (value: SetStateAction<number>) => {},\r\n  vertical: false,\r\n  stepsLength: 2,\r\n});\r\nexport interface IStepperProps {\r\n  activeTabIndex: number;\r\n  children?: React.ReactNode[];\r\n  className?: string;\r\n  headerProps?: Partial<IStepperHeaderProps>;\r\n  nextButtonText?: string;\r\n  onIndexChange: Dispatch<SetStateAction<number>>;\r\n  previousButtonText?: string;\r\n  vertical?: boolean;\r\n}\r\n\r\nexport default function Stepper({\r\n  children,\r\n  activeTabIndex,\r\n  vertical = false,\r\n  nextButtonText = \"Next\",\r\n  previousButtonText = \"Previous\",\r\n  onIndexChange,\r\n  className,\r\n  headerProps,\r\n}: IStepperProps) {\r\n  const keys = children?.flatMap((child, index) => {\r\n    const item = React.isValidElement(child)\r\n      ? {\r\n          title: (child.props as { title: string }).title || \"\",\r\n          icon: (child.props as { icon: string }).icon,\r\n          index,\r\n        }\r\n      : { title: \"\", icon: \"\", index };\r\n    if (index === 0) {\r\n      return [item];\r\n    }\r\n    return [\"SEPARATOR\", item];\r\n  });\r\n  const stepsLength = Children.count(children);\r\n  const providerProps = useMemo(\r\n    () => ({\r\n      nextButtonText,\r\n      previousButtonText,\r\n      onIndexChange,\r\n      vertical,\r\n      stepsLength,\r\n    }),\r\n    [nextButtonText, previousButtonText, onIndexChange, vertical, stepsLength]\r\n  );\r\n  const filteredChildren = React.Children.toArray(children)?.[activeTabIndex];\r\n  return (\r\n    <StepperContext.Provider value={providerProps}>\r\n      <div className={cn(vertical ? \"flex flex-row gap-10\" : \"\", className)}>\r\n        <StepperHeader\r\n          keysWithSeparator={keys}\r\n          activeTabIndex={activeTabIndex}\r\n          vertical={vertical}\r\n          {...headerProps}\r\n        />\r\n        {filteredChildren}\r\n      </div>\r\n    </StepperContext.Provider>\r\n  );\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/custom/tab-layout.js

@@ -0,0 +1,182 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import Link from "next/link";
+import { usePathname, useSearchParams } from "next/navigation";
+import { Suspense } from "react";
+import { cn } from "@repo/ayasofyazilim-ui/lib/utils";
+import { Skeleton } from "@repo/ayasofyazilim-ui/components/skeleton";
+const defaultClassNames = {
+  vertical: {
+    tabs: "flex h-full overflow-clip md:overflow-hidden block gap-2",
+    tabList: "flex flex-col h-full justify-start max-w-sm overflow-hidden border-b-2 pb-2 mb-2 md:mb-0 mb:border-b-0",
+    tabTrigger: "justify-start md:max-w-lg overflow-hidden w-full",
+    tabContent: "mx-2 my-0 w-full h-full overflow-auto flex-1"
+  },
+  horizontal: {
+    tabs: "flex h-full overflow-hidden flex-col",
+    tabList: "w-full mx:w-max overflow-x-auto overflow-y-hidden min-h-max",
+    tabTrigger: "min-w-max",
+    tabContent: "h-full my-2 overflow-auto"
+  }
+};
+const tabsVariants = cva("", {
+  variants: {
+    variant: {
+      default: "",
+      simple: ""
+    },
+    orientation: {
+      horizontal: "md:flex md:h-full md:overflow-hidden flex-col",
+      vertical: "md:flex md:h-full"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    variant: "default"
+  }
+});
+const tabListVariants = cva("", {
+  variants: {
+    variant: {
+      default: "inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
+      simple: ""
+    },
+    orientation: {
+      horizontal: "w-max mx:w-max overflow-x-auto overflow-y-hidden min-h-max",
+      vertical: "flex flex-col md:h-full justify-start md:max-w-[220px] w-full md:overflow-hidden md:pr-3 md:border-r border-muted"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    variant: "default"
+  }
+});
+const tabTriggerVariants = cva(
+  "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+  {
+    variants: {
+      variant: {
+        default: "px-3 py-1 ring-offset-background transition-all focus-visible:ring-2 focus-visible:ring-offset-2 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
+        simple: "px-3 py-2 ring-offset-background transition-all rounded-lg focus-visible:ring-2 focus-visible:ring-offset-2 data-[state=active]:bg-muted data-[state=active]:text-foreground"
+      },
+      orientation: {
+        horizontal: "",
+        vertical: "justify-start md:max-w-lg overflow-hidden w-full"
+      }
+    },
+    defaultVariants: {
+      orientation: "horizontal",
+      variant: "default"
+    }
+  }
+);
+const tabContentVariants = cva("", {
+  variants: {
+    variant: {
+      default: "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      simple: ""
+    },
+    orientation: {
+      horizontal: "h-full my-2 overflow-auto",
+      vertical: "my-0 w-full h-full overflow-auto flex-1"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    variant: "default"
+  }
+});
+function findActiveTab(tabList, path) {
+  const indexOfActiveTab = path.split("/").reverse().findIndex((_, index) => {
+    if (index === 0) {
+      return tabList.find((i) => i.href === path);
+    }
+    const link = path.split("/").slice(0, -index).join("/");
+    return tabList.find((i) => i.href === link);
+  });
+  if (indexOfActiveTab === -1) {
+    return void 0;
+  }
+  if (indexOfActiveTab === 0) {
+    return tabList.find((i) => i.href === path)?.href;
+  }
+  return tabList.find(
+    (i) => i.href === path.split("/").slice(0, -indexOfActiveTab).join("/")
+  )?.href;
+}
+function TabLayout({
+  tabList,
+  children,
+  orientation = "horizontal",
+  classNames,
+  variant = "default"
+}) {
+  const tabsClassNames = tabsVariants({ orientation, variant });
+  const tabListClassNames = tabListVariants({ orientation, variant });
+  const tabTriggerClassNames = tabTriggerVariants({ orientation, variant });
+  const tabContentClassNames = tabContentVariants({ orientation, variant });
+  const path = usePathname();
+  const searchParams = `?${useSearchParams().toString()}`;
+  const active = findActiveTab(tabList, path + searchParams) || findActiveTab(tabList, path) || tabList[0]?.href || "";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(tabsClassNames, classNames?.[orientation]?.tabs),
+      role: "tabpanel",
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            role: "tablist",
+            className: cn(tabListClassNames, classNames?.[orientation]?.tabList),
+            style: {
+              scrollbarWidth: "thin"
+            },
+            children: tabList.map((tab) => /* @__PURE__ */ jsx(
+              "span",
+              {
+                role: "tab",
+                "data-state": tab.href === active ? "active" : "inactive",
+                className: cn(
+                  tabTriggerClassNames,
+                  classNames?.[orientation]?.tabTrigger,
+                  tab.disabled && "text-muted-foreground cursor-not-allowed"
+                ),
+                children: tab.disabled ? /* @__PURE__ */ jsxs("span", { className: "w-full overflow-hidden text-elipsis data-[state=active]:sticky data-[state=active]:left-0 data-[state=active]:right-0", children: [
+                  tab.icon && /* @__PURE__ */ jsx(tab.icon, { className: "block md:hidden" }),
+                  tab.label
+                ] }) : /* @__PURE__ */ jsxs(
+                  Link,
+                  {
+                    href: tab.href,
+                    className: "w-full overflow-hidden text-elipsis data-[state=active]:sticky data-[state=active]:left-0 data-[state=active]:right-0",
+                    children: [
+                      tab.icon && /* @__PURE__ */ jsx(tab.icon, { className: "block md:hidden" }),
+                      tab.label
+                    ]
+                  }
+                )
+              },
+              tab.href
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              tabContentClassNames,
+              classNames?.[orientation]?.tabContent
+            ),
+            children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(Skeleton, { className: "flex-1 size-full" }), children })
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  TabLayout
+};
+//# sourceMappingURL=tab-layout.js.map

package/dist/custom/tab-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/custom/tab-layout.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { cva, VariantProps } from \"class-variance-authority\";\r\nimport Link from \"next/link\";\r\nimport { usePathname, useSearchParams } from \"next/navigation\";\r\nimport { ComponentType, ReactNode, Suspense } from \"react\";\r\nimport { cn } from \"@repo/ayasofyazilim-ui/lib/utils\";\r\nimport { Skeleton } from \"@repo/ayasofyazilim-ui/components/skeleton\";\r\n\r\ntype DeepPartial<T> = T extends object\r\n  ? {\r\n      [P in keyof T]?: DeepPartial<T[P]>;\r\n    }\r\n  : T;\r\nconst defaultClassNames = {\r\n  vertical: {\r\n    tabs: \"flex h-full overflow-clip md:overflow-hidden block gap-2\",\r\n    tabList:\r\n      \"flex flex-col h-full justify-start max-w-sm overflow-hidden border-b-2 pb-2 mb-2 md:mb-0 mb:border-b-0\",\r\n    tabTrigger: \"justify-start md:max-w-lg overflow-hidden w-full\",\r\n    tabContent: \"mx-2 my-0 w-full h-full overflow-auto flex-1\",\r\n  },\r\n  horizontal: {\r\n    tabs: \"flex h-full overflow-hidden flex-col\",\r\n    tabList: \"w-full mx:w-max overflow-x-auto overflow-y-hidden min-h-max\",\r\n    tabTrigger: \"min-w-max\",\r\n    tabContent: \"h-full my-2 overflow-auto\",\r\n  },\r\n};\r\n\r\nconst tabsVariants = cva(\"\", {\r\n  variants: {\r\n    variant: {\r\n      default: \"\",\r\n      simple: \"\",\r\n    },\r\n    orientation: {\r\n      horizontal: \"md:flex md:h-full md:overflow-hidden flex-col\",\r\n      vertical: \"md:flex md:h-full\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    orientation: \"horizontal\",\r\n    variant: \"default\",\r\n  },\r\n});\r\n\r\nconst tabListVariants = cva(\"\", {\r\n  variants: {\r\n    variant: {\r\n      default:\r\n        \"inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground\",\r\n      simple: \"\",\r\n    },\r\n    orientation: {\r\n      horizontal: \"w-max mx:w-max overflow-x-auto overflow-y-hidden min-h-max\",\r\n      vertical:\r\n        \"flex flex-col md:h-full justify-start md:max-w-[220px] w-full md:overflow-hidden md:pr-3 md:border-r border-muted\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    orientation: \"horizontal\",\r\n    variant: \"default\",\r\n  },\r\n});\r\n\r\nconst tabTriggerVariants = cva(\r\n  \"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50\",\r\n  {\r\n    variants: {\r\n      variant: {\r\n        default:\r\n          \"px-3 py-1 ring-offset-background transition-all focus-visible:ring-2 focus-visible:ring-offset-2 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow\",\r\n        simple:\r\n          \"px-3 py-2 ring-offset-background transition-all rounded-lg focus-visible:ring-2 focus-visible:ring-offset-2 data-[state=active]:bg-muted data-[state=active]:text-foreground\",\r\n      },\r\n      orientation: {\r\n        horizontal: \"\",\r\n        vertical: \"justify-start md:max-w-lg overflow-hidden w-full\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      orientation: \"horizontal\",\r\n      variant: \"default\",\r\n    },\r\n  }\r\n);\r\n\r\nconst tabContentVariants = cva(\"\", {\r\n  variants: {\r\n    variant: {\r\n      default:\r\n        \"mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\r\n      simple: \"\",\r\n    },\r\n    orientation: {\r\n      horizontal: \"h-full my-2 overflow-auto\",\r\n      vertical: \"my-0 w-full h-full overflow-auto flex-1\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    orientation: \"horizontal\",\r\n    variant: \"default\",\r\n  },\r\n});\r\n\r\nfunction findActiveTab(tabList: { href: string }[], path: string) {\r\n  const indexOfActiveTab = path\r\n    .split(\"/\")\r\n    .reverse()\r\n    .findIndex((_, index) => {\r\n      if (index === 0) {\r\n        return tabList.find((i) => i.href === path);\r\n      }\r\n      const link = path.split(\"/\").slice(0, -index).join(\"/\");\r\n      return tabList.find((i) => i.href === link);\r\n    });\r\n  if (indexOfActiveTab === -1) {\r\n    return undefined;\r\n  }\r\n  if (indexOfActiveTab === 0) {\r\n    return tabList.find((i) => i.href === path)?.href;\r\n  }\r\n  return tabList.find(\r\n    (i) => i.href === path.split(\"/\").slice(0, -indexOfActiveTab).join(\"/\")\r\n  )?.href;\r\n}\r\n\r\nexport function TabLayout({\r\n  tabList,\r\n  children,\r\n  orientation = \"horizontal\",\r\n  classNames,\r\n  variant = \"default\",\r\n}: {\r\n  tabList: {\r\n    label: string;\r\n    href: string;\r\n    icon?: ComponentType<{ className?: string }>;\r\n    fallback?: ReactNode;\r\n    disabled?: boolean;\r\n  }[];\r\n  children: ReactNode;\r\n  orientation?: \"horizontal\" | \"vertical\";\r\n  classNames?: DeepPartial<typeof defaultClassNames>;\r\n  variant?: VariantProps<typeof tabsVariants>[\"variant\"];\r\n}) {\r\n  const tabsClassNames = tabsVariants({ orientation, variant });\r\n  const tabListClassNames = tabListVariants({ orientation, variant });\r\n  const tabTriggerClassNames = tabTriggerVariants({ orientation, variant });\r\n  const tabContentClassNames = tabContentVariants({ orientation, variant });\r\n  const path = usePathname();\r\n\r\n  const searchParams = `?${useSearchParams().toString()}`;\r\n  const active =\r\n    findActiveTab(tabList, path + searchParams) ||\r\n    findActiveTab(tabList, path) ||\r\n    tabList[0]?.href ||\r\n    \"\";\r\n\r\n  return (\r\n    <div\r\n      className={cn(tabsClassNames, classNames?.[orientation]?.tabs)}\r\n      role=\"tabpanel\"\r\n    >\r\n      <div\r\n        role=\"tablist\"\r\n        className={cn(tabListClassNames, classNames?.[orientation]?.tabList)}\r\n        style={{\r\n          scrollbarWidth: \"thin\",\r\n        }}\r\n      >\r\n        {tabList.map((tab) => (\r\n          <span\r\n            role=\"tab\"\r\n            key={tab.href}\r\n            data-state={tab.href === active ? \"active\" : \"inactive\"}\r\n            className={cn(\r\n              tabTriggerClassNames,\r\n              classNames?.[orientation]?.tabTrigger,\r\n              tab.disabled && \"text-muted-foreground cursor-not-allowed\"\r\n            )}\r\n          >\r\n            {tab.disabled ? (\r\n              <span className=\"w-full overflow-hidden text-elipsis data-[state=active]:sticky data-[state=active]:left-0 data-[state=active]:right-0\">\r\n                {tab.icon && <tab.icon className=\"block md:hidden\" />}\r\n                {tab.label}\r\n              </span>\r\n            ) : (\r\n              <Link\r\n                href={tab.href}\r\n                className=\"w-full overflow-hidden text-elipsis data-[state=active]:sticky data-[state=active]:left-0 data-[state=active]:right-0\"\r\n              >\r\n                {tab.icon && <tab.icon className=\"block md:hidden\" />}\r\n                {tab.label}\r\n              </Link>\r\n            )}\r\n          </span>\r\n        ))}\r\n      </div>\r\n      <div\r\n        className={cn(\r\n          tabContentClassNames,\r\n          classNames?.[orientation]?.tabContent\r\n        )}\r\n      >\r\n        <Suspense fallback={<Skeleton className=\"flex-1 size-full\" />}>\r\n          {children}\r\n        </Suspense>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/custom/tanstack-table/fields/index.js

@@ -0,0 +1,13 @@
+export * from "./tanstack-table-column-header";
+export * from "./tanstack-table-filter-faceted";
+export * from "./tanstack-table-filter-text";
+export * from "./tanstack-table-pagination";
+export * from "./tanstack-table-row-actions-confirmation";
+export * from "./tanstack-table-row-actions-custom-dialog";
+export * from "./tanstack-table-row-actions";
+export * from "./tanstack-table-table-actions-custom-dialog";
+export * from "./tanstack-table-toolbar";
+export * from "./tanstack-table-view-options";
+export * from "./tanstack-table-plain-table";
+export * from "./tanstack-table-action-dialogs";
+//# sourceMappingURL=index.js.map

package/dist/custom/tanstack-table/fields/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/custom/tanstack-table/fields/index.tsx"],"sourcesContent":["export * from \"./tanstack-table-column-header\";\r\nexport * from \"./tanstack-table-filter-faceted\";\r\nexport * from \"./tanstack-table-filter-text\";\r\nexport * from \"./tanstack-table-pagination\";\r\nexport * from \"./tanstack-table-row-actions-confirmation\";\r\nexport * from \"./tanstack-table-row-actions-custom-dialog\";\r\nexport * from \"./tanstack-table-row-actions\";\r\nexport * from \"./tanstack-table-table-actions-custom-dialog\";\r\nexport * from \"./tanstack-table-toolbar\";\r\nexport * from \"./tanstack-table-view-options\";\r\nexport * from \"./tanstack-table-plain-table\";\r\nexport * from \"./tanstack-table-action-dialogs\";\r\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/custom/tanstack-table/fields/tanstack-table-action-dialogs.js

@@ -0,0 +1,76 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect } from "react";
+import {
+  TanstackTableConfirmationDialog,
+  TanstackTableCustomDialog,
+  TanstackTableTableCustomDialog
+} from ".";
+import { TanstackTableTableSchemaFormDialog } from "./tanstack-table-table-actions-schemaform-dialog";
+function TanstackTableActionDialogs({
+  rowAction,
+  setRowAction,
+  tableAction,
+  setTableAction
+}) {
+  useEffect(() => {
+    if (rowAction?.type === "simple") {
+      rowAction.onClick(rowAction.row);
+      setRowAction(null);
+    }
+  }, [rowAction]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    rowAction?.type === "confirmation-dialog" && /* @__PURE__ */ jsx(
+      TanstackTableConfirmationDialog,
+      {
+        setDialogOpen: () => setRowAction(null),
+        row: rowAction.row,
+        title: rowAction.title,
+        description: rowAction.description,
+        confirmationText: rowAction.confirmationText,
+        cancelText: rowAction.cancelText,
+        onConfirm: rowAction.onConfirm,
+        onCancel: rowAction.onCancel,
+        type: "confirmation-dialog"
+      }
+    ),
+    rowAction?.type === "custom-dialog" && /* @__PURE__ */ jsx(
+      TanstackTableCustomDialog,
+      {
+        setDialogOpen: () => setRowAction(null),
+        row: rowAction.row,
+        title: rowAction.title,
+        content: rowAction.content,
+        confirmationText: rowAction.confirmationText,
+        cancelText: rowAction.cancelText,
+        onConfirm: rowAction.onConfirm,
+        onCancel: rowAction.onCancel,
+        type: "custom-dialog"
+      }
+    ),
+    tableAction?.type === "custom-dialog" && /* @__PURE__ */ jsx(
+      TanstackTableTableCustomDialog,
+      {
+        setDialogOpen: () => setTableAction(null),
+        title: tableAction.title,
+        type: "custom-dialog",
+        content: tableAction.content,
+        confirmationText: tableAction.confirmationText,
+        cancelText: tableAction.cancelText,
+        onConfirm: tableAction.onConfirm,
+        onCancel: tableAction.onCancel,
+        dialogClassNames: tableAction.dialogClassNames
+      }
+    ),
+    tableAction?.type === "schemaform-dialog" && /* @__PURE__ */ jsx(
+      TanstackTableTableSchemaFormDialog,
+      {
+        setDialogOpen: () => setTableAction(null),
+        ...tableAction
+      }
+    )
+  ] });
+}
+export {
+  TanstackTableActionDialogs
+};
+//# sourceMappingURL=tanstack-table-action-dialogs.js.map

package/dist/custom/tanstack-table/fields/tanstack-table-action-dialogs.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/custom/tanstack-table/fields/tanstack-table-action-dialogs.tsx"],"sourcesContent":["import React, { Dispatch, useEffect } from \"react\";\r\nimport {\r\n  TanstackTableConfirmationDialog,\r\n  TanstackTableCustomDialog,\r\n  TanstackTableTableCustomDialog,\r\n} from \".\";\r\nimport {\r\n  TanstackTableRowActionsType,\r\n  TanstackTableTableActionsType,\r\n} from \"../types\";\r\nimport { TanstackTableTableSchemaFormDialog } from \"./tanstack-table-table-actions-schemaform-dialog\";\r\n\r\nexport function TanstackTableActionDialogs<TData>({\r\n  rowAction,\r\n  setRowAction,\r\n  tableAction,\r\n  setTableAction,\r\n}: {\r\n  rowAction: (TanstackTableRowActionsType<TData> & { row: TData }) | null;\r\n  setRowAction: Dispatch<\r\n    React.SetStateAction<\r\n      | (TanstackTableRowActionsType<TData> & {\r\n          row: TData;\r\n        })\r\n      | null\r\n    >\r\n  >;\r\n  setTableAction: Dispatch<\r\n    React.SetStateAction<TanstackTableTableActionsType<TData> | null>\r\n  >;\r\n  tableAction: TanstackTableTableActionsType<TData> | null;\r\n}) {\r\n  useEffect(() => {\r\n    if (rowAction?.type === \"simple\") {\r\n      rowAction.onClick(rowAction.row);\r\n      setRowAction(null);\r\n    }\r\n  }, [rowAction]);\r\n\r\n  return (\r\n    <>\r\n      {rowAction?.type === \"confirmation-dialog\" && (\r\n        <TanstackTableConfirmationDialog<TData>\r\n          setDialogOpen={() => setRowAction(null)}\r\n          row={rowAction.row}\r\n          title={rowAction.title}\r\n          description={rowAction.description}\r\n          confirmationText={rowAction.confirmationText}\r\n          cancelText={rowAction.cancelText}\r\n          onConfirm={rowAction.onConfirm}\r\n          onCancel={rowAction.onCancel}\r\n          type=\"confirmation-dialog\"\r\n        />\r\n      )}\r\n      {rowAction?.type === \"custom-dialog\" && (\r\n        <TanstackTableCustomDialog<TData>\r\n          setDialogOpen={() => setRowAction(null)}\r\n          row={rowAction.row}\r\n          title={rowAction.title}\r\n          content={rowAction.content}\r\n          confirmationText={rowAction.confirmationText}\r\n          cancelText={rowAction.cancelText}\r\n          onConfirm={rowAction.onConfirm}\r\n          onCancel={rowAction.onCancel}\r\n          type=\"custom-dialog\"\r\n        />\r\n      )}\r\n      {tableAction?.type === \"custom-dialog\" && (\r\n        <TanstackTableTableCustomDialog\r\n          setDialogOpen={() => setTableAction(null)}\r\n          title={tableAction.title}\r\n          type=\"custom-dialog\"\r\n          content={tableAction.content}\r\n          confirmationText={tableAction.confirmationText}\r\n          cancelText={tableAction.cancelText}\r\n          onConfirm={tableAction.onConfirm}\r\n          onCancel={tableAction.onCancel}\r\n          dialogClassNames={tableAction.dialogClassNames}\r\n        />\r\n      )}\r\n      {tableAction?.type === \"schemaform-dialog\" && (\r\n        <TanstackTableTableSchemaFormDialog<TData>\r\n          setDialogOpen={() => setTableAction(null)}\r\n          {...tableAction}\r\n        />\r\n      )}\r\n    </>\r\n  );\r\n}\r\n"],"mappings":"AAwCI,mBAEI,KAFJ;AAxCJ,SAA0B,iBAAiB;AAC3C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAKP,SAAS,0CAA0C;AAE5C,SAAS,2BAAkC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAcG;AACD,YAAU,MAAM;AACd,QAAI,WAAW,SAAS,UAAU;AAChC,gBAAU,QAAQ,UAAU,GAAG;AAC/B,mBAAa,IAAI;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AAEd,SACE,iCACG;AAAA,eAAW,SAAS,yBACnB;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,MAAM,aAAa,IAAI;AAAA,QACtC,KAAK,UAAU;AAAA,QACf,OAAO,UAAU;AAAA,QACjB,aAAa,UAAU;AAAA,QACvB,kBAAkB,UAAU;AAAA,QAC5B,YAAY,UAAU;AAAA,QACtB,WAAW,UAAU;AAAA,QACrB,UAAU,UAAU;AAAA,QACpB,MAAK;AAAA;AAAA,IACP;AAAA,IAED,WAAW,SAAS,mBACnB;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,MAAM,aAAa,IAAI;AAAA,QACtC,KAAK,UAAU;AAAA,QACf,OAAO,UAAU;AAAA,QACjB,SAAS,UAAU;AAAA,QACnB,kBAAkB,UAAU;AAAA,QAC5B,YAAY,UAAU;AAAA,QACtB,WAAW,UAAU;AAAA,QACrB,UAAU,UAAU;AAAA,QACpB,MAAK;AAAA;AAAA,IACP;AAAA,IAED,aAAa,SAAS,mBACrB;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,MAAM,eAAe,IAAI;AAAA,QACxC,OAAO,YAAY;AAAA,QACnB,MAAK;AAAA,QACL,SAAS,YAAY;AAAA,QACrB,kBAAkB,YAAY;AAAA,QAC9B,YAAY,YAAY;AAAA,QACxB,WAAW,YAAY;AAAA,QACvB,UAAU,YAAY;AAAA,QACtB,kBAAkB,YAAY;AAAA;AAAA,IAChC;AAAA,IAED,aAAa,SAAS,uBACrB;AAAA,MAAC;AAAA;AAAA,QACC,eAAe,MAAM,eAAe,IAAI;AAAA,QACvC,GAAG;AAAA;AAAA,IACN;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/custom/tanstack-table/fields/tanstack-table-column-header.js

@@ -0,0 +1,47 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon } from "lucide-react";
+import { Button } from "@repo/ayasofyazilim-ui/components/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger
+} from "@repo/ayasofyazilim-ui/components/dropdown-menu";
+import { cn } from "@repo/ayasofyazilim-ui/lib/utils";
+function TanstackTableColumnHeader({
+  column,
+  title,
+  className
+}) {
+  if (!column.getCanSort()) {
+    return /* @__PURE__ */ jsx("div", { className: cn(className), children: title });
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("flex items-center w-full space-x-2 mx-2", className), children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: "ghost",
+        size: "sm",
+        className: "-ml-3 h-8 data-[state=open]:bg-accent w-full justify-between",
+        children: [
+          /* @__PURE__ */ jsx("span", { children: title }),
+          column.getIsSorted() === "desc" ? /* @__PURE__ */ jsx(ArrowDownIcon, { className: "ml-2 h-4 w-4" }) : column.getIsSorted() === "asc" ? /* @__PURE__ */ jsx(ArrowUpIcon, { className: "ml-2 h-4 w-4" }) : /* @__PURE__ */ jsx(ChevronsUpDownIcon, { className: "ml-2 h-4 w-4" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "start", children: [
+      /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => column.toggleSorting(false), children: [
+        /* @__PURE__ */ jsx(ArrowUpIcon, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }),
+        "Asc"
+      ] }),
+      /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => column.toggleSorting(true), children: [
+        /* @__PURE__ */ jsx(ArrowDownIcon, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }),
+        "Desc"
+      ] })
+    ] })
+  ] }) });
+}
+export {
+  TanstackTableColumnHeader
+};
+//# sourceMappingURL=tanstack-table-column-header.js.map

package/dist/custom/tanstack-table/fields/tanstack-table-column-header.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/custom/tanstack-table/fields/tanstack-table-column-header.tsx"],"sourcesContent":["import { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon } from \"lucide-react\";\r\nimport { Column } from \"@tanstack/react-table\";\r\n\r\nimport { HTMLAttributes } from \"react\";\r\nimport { Button } from \"@repo/ayasofyazilim-ui/components/button\";\r\nimport {\r\n  DropdownMenu,\r\n  DropdownMenuContent,\r\n  DropdownMenuItem,\r\n  DropdownMenuTrigger,\r\n} from \"@repo/ayasofyazilim-ui/components/dropdown-menu\";\r\nimport { cn } from \"@repo/ayasofyazilim-ui/lib/utils\";\r\n\r\ninterface TanstackTableColumnHeaderProps<TData, TValue>\r\n  extends HTMLAttributes<HTMLDivElement> {\r\n  column: Column<TData, TValue>;\r\n  title: string;\r\n}\r\n\r\nexport function TanstackTableColumnHeader<TData, TValue>({\r\n  column,\r\n  title,\r\n  className,\r\n}: TanstackTableColumnHeaderProps<TData, TValue>) {\r\n  if (!column.getCanSort()) {\r\n    return <div className={cn(className)}>{title}</div>;\r\n  }\r\n\r\n  return (\r\n    <div className={cn(\"flex items-center w-full space-x-2 mx-2\", className)}>\r\n      <DropdownMenu>\r\n        <DropdownMenuTrigger asChild>\r\n          <Button\r\n            variant=\"ghost\"\r\n            size=\"sm\"\r\n            className=\"-ml-3 h-8 data-[state=open]:bg-accent w-full justify-between\"\r\n          >\r\n            <span>{title}</span>\r\n            {column.getIsSorted() === \"desc\" ? (\r\n              <ArrowDownIcon className=\"ml-2 h-4 w-4\" />\r\n            ) : column.getIsSorted() === \"asc\" ? (\r\n              <ArrowUpIcon className=\"ml-2 h-4 w-4\" />\r\n            ) : (\r\n              <ChevronsUpDownIcon className=\"ml-2 h-4 w-4\" />\r\n            )}\r\n          </Button>\r\n        </DropdownMenuTrigger>\r\n        <DropdownMenuContent align=\"start\">\r\n          <DropdownMenuItem onClick={() => column.toggleSorting(false)}>\r\n            <ArrowUpIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\r\n            Asc\r\n          </DropdownMenuItem>\r\n          <DropdownMenuItem onClick={() => column.toggleSorting(true)}>\r\n            <ArrowDownIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\r\n            Desc\r\n          </DropdownMenuItem>\r\n          {/* <DropdownMenuSeparator />\r\n          <DropdownMenuItem onClick={() => column.toggleVisibility(false)}>\r\n            <EyeNoneIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\r\n            Hide\r\n          </DropdownMenuItem> */}\r\n        </DropdownMenuContent>\r\n      </DropdownMenu>\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"AAyBW,cAOD,YAPC;AAzBX,SAAS,eAAe,aAAa,0BAA0B;AAI/D,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU;AAQZ,SAAS,0BAAyC;AAAA,EACvD;AAAA,EACA;AAAA,EACA;AACF,GAAkD;AAChD,MAAI,CAAC,OAAO,WAAW,GAAG;AACxB,WAAO,oBAAC,SAAI,WAAW,GAAG,SAAS,GAAI,iBAAM;AAAA,EAC/C;AAEA,SACE,oBAAC,SAAI,WAAW,GAAG,2CAA2C,SAAS,GACrE,+BAAC,gBACC;AAAA,wBAAC,uBAAoB,SAAO,MAC1B;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,WAAU;AAAA,QAEV;AAAA,8BAAC,UAAM,iBAAM;AAAA,UACZ,OAAO,YAAY,MAAM,SACxB,oBAAC,iBAAc,WAAU,gBAAe,IACtC,OAAO,YAAY,MAAM,QAC3B,oBAAC,eAAY,WAAU,gBAAe,IAEtC,oBAAC,sBAAmB,WAAU,gBAAe;AAAA;AAAA;AAAA,IAEjD,GACF;AAAA,IACA,qBAAC,uBAAoB,OAAM,SACzB;AAAA,2BAAC,oBAAiB,SAAS,MAAM,OAAO,cAAc,KAAK,GACzD;AAAA,4BAAC,eAAY,WAAU,6CAA4C;AAAA,QAAE;AAAA,SAEvE;AAAA,MACA,qBAAC,oBAAiB,SAAS,MAAM,OAAO,cAAc,IAAI,GACxD;AAAA,4BAAC,iBAAc,WAAU,6CAA4C;AAAA,QAAE;AAAA,SAEzE;AAAA,OAMF;AAAA,KACF,GACF;AAEJ;","names":[]}