@calcom/atoms 2.8.9 → 2.9.0

package/dist/components/ui/settings-toggle.js

@@ -0,0 +1,100 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { useAutoAnimate as j } from "@formkit/auto-animate/react";
+import { cn as l } from "../../lib/utils.js";
+import { Label as p } from "./label.js";
+import { Switch as N } from "./switch.js";
+function R({
+  checked: a,
+  onCheckedChange: r,
+  description: s,
+  LockedIcon: n,
+  Badge: i,
+  title: f,
+  children: d,
+  disabled: o,
+  tooltip: c,
+  toggleSwitchAtTheEnd: x = !1,
+  childrenClassName: h,
+  switchContainerClassName: v,
+  labelClassName: u,
+  descriptionClassName: b,
+  noIndentation: g = !1,
+  hideSwitch: y,
+  ...m
+}) {
+  const [w] = j();
+  return /* @__PURE__ */ e("div", { className: "flex w-full flex-col stack-y-4 lg:flex-row lg:space-x-4 lg:stack-y-0", children: /* @__PURE__ */ t("fieldset", { className: "block w-full flex-col sm:flex", children: [
+    x ? /* @__PURE__ */ t(
+      "div",
+      {
+        className: l(
+          "border-subtle flex justify-between space-x-3 rounded-lg border px-4 py-6 sm:px-6",
+          a && d && "rounded-b-none",
+          v
+        ),
+        children: [
+          /* @__PURE__ */ t("div", { children: [
+            /* @__PURE__ */ t("div", { className: "flex items-center gap-x-2", "data-testid": `${m["data-testid"]}-title`, children: [
+              /* @__PURE__ */ t(
+                p,
+                {
+                  className: l("mt-0.5 text-base font-semibold leading-none", u),
+                  htmlFor: "",
+                  children: [
+                    f,
+                    n
+                  ]
+                }
+              ),
+              i && /* @__PURE__ */ e("div", { className: "mb-2", children: i })
+            ] }),
+            s && /* @__PURE__ */ e(
+              "p",
+              {
+                className: l("text-default -mt-1.5 text-sm leading-normal", b),
+                "data-testid": `${m["data-testid"]}-description`,
+                children: s
+              }
+            )
+          ] }),
+          !y && /* @__PURE__ */ e("div", { className: "my-auto h-full", children: /* @__PURE__ */ e(
+            N,
+            {
+              "data-testid": m["data-testid"],
+              fitToHeight: !0,
+              checked: a,
+              onCheckedChange: r,
+              disabled: o,
+              tooltip: c
+            }
+          ) })
+        ]
+      }
+    ) : /* @__PURE__ */ t("div", { className: "flex space-x-3", children: [
+      /* @__PURE__ */ e(
+        N,
+        {
+          "data-testid": m["data-testid"],
+          fitToHeight: !0,
+          checked: a,
+          onCheckedChange: r,
+          disabled: o,
+          tooltip: c
+        }
+      ),
+      /* @__PURE__ */ t("div", { children: [
+        /* @__PURE__ */ t(p, { className: l("text-emphasis text-sm font-semibold leading-none", u), children: [
+          f,
+          " ",
+          i || null,
+          n
+        ] }),
+        s && /* @__PURE__ */ e("p", { className: "text-default -mt-1.5 text-sm leading-normal", children: s })
+      ] })
+    ] }),
+    d && /* @__PURE__ */ e("div", { className: l(g ? "" : "lg:ml-14", h), ref: w, children: a && /* @__PURE__ */ e("div", { className: l(!x && "mt-4"), children: d }) })
+  ] }) });
+}
+export {
+  R as SettingsToggle
+};

package/dist/components/ui/shell.d.ts

@@ -0,0 +1,31 @@
+import { Dispatch, ReactElement, ReactNode, SetStateAction } from 'react';
+type DrawerState = [isOpen: boolean, setDrawerOpen: Dispatch<SetStateAction<boolean>>];
+export type LayoutProps = {
+    centered?: boolean;
+    title?: string;
+    description?: string;
+    heading?: ReactNode;
+    subtitle?: ReactNode;
+    headerClassName?: string;
+    children: ReactNode;
+    CTA?: ReactNode;
+    large?: boolean;
+    MobileNavigationContainer?: ReactNode;
+    SidebarContainer?: ReactElement;
+    TopNavContainer?: ReactNode;
+    drawerState?: DrawerState;
+    HeadingLeftIcon?: ReactNode;
+    backPath?: string | boolean;
+    flexChildrenContainer?: boolean;
+    isPublic?: boolean;
+    withoutMain?: boolean;
+    actions?: JSX.Element;
+    beforeCTAactions?: JSX.Element;
+    afterHeading?: ReactNode;
+    smallHeading?: boolean;
+    isPlatformUser?: boolean;
+    disableSticky?: boolean;
+};
+export declare const Shell: (props: LayoutProps) => JSX.Element;
+export {};
+//# sourceMappingURL=shell.d.ts.map

package/dist/components/ui/shell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shell.d.ts","sourceRoot":"","sources":["../../../src/components/ui/shell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI/E,KAAK,WAAW,GAAG,CAAC,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAEvF,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;IACpB,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,yBAAyB,CAAC,EAAE,SAAS,CAAC;IACtC,gBAAgB,CAAC,EAAE,YAAY,CAAC;IAChC,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC/B,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,KAAK,GAAI,OAAO,WAAW,gBAavC,CAAC"}

package/dist/components/ui/shell.js

@@ -0,0 +1,15 @@
+import { jsxs as i, jsx as l } from "react/jsx-runtime";
+import { cn as d } from "../../lib/utils.js";
+const t = (e) => /* @__PURE__ */ i("div", { className: d(e.headerClassName, "flex flex-col px-10 py-4"), children: [
+  /* @__PURE__ */ i("div", { className: "mb-6 flex items-center justify-between md:mb-6 md:mt-0 lg:mb-8", children: [
+    /* @__PURE__ */ i("div", { className: "flex flex-col gap-0.5", children: [
+      /* @__PURE__ */ l("div", { children: e.heading }),
+      /* @__PURE__ */ l("div", { className: "text-default text-sm", children: e.subtitle })
+    ] }),
+    /* @__PURE__ */ l("div", { children: e.CTA })
+  ] }),
+  /* @__PURE__ */ l("div", { children: e.children })
+] });
+export {
+  t as Shell
+};

package/dist/components/ui/show-toast.d.ts

@@ -0,0 +1,13 @@
+import { ExternalToast } from 'sonner';
+type IToast = {
+    message: string;
+    toastId: string | number;
+    onClose: (toastId: string | number) => void;
+};
+export declare const SuccessToast: ({ message, onClose, toastId }: IToast) => JSX.Element;
+export declare const ErrorToast: ({ message, onClose, toastId }: IToast) => JSX.Element;
+export declare const WarningToast: ({ message, onClose, toastId }: IToast) => JSX.Element;
+type ToastVariants = "success" | "warning" | "error";
+export declare function showToast(message: string, variant: ToastVariants, options?: number | ExternalToast): string | number;
+export {};
+//# sourceMappingURL=show-toast.d.ts.map

package/dist/components/ui/show-toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"show-toast.d.ts","sourceRoot":"","sources":["../../../src/components/ui/show-toast.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAK5C,KAAK,MAAM,GAAG;IACZ,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,OAAO,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;CAC7C,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,+BAA+B,MAAM,gBAmBjE,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,+BAA+B,MAAM,gBAmB/D,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,+BAA+B,MAAM,gBAmBjE,CAAC;AAIF,KAAK,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAErD,wBAAgB,SAAS,CACvB,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,aAAa,EACtB,OAAO,GAAE,MAAM,GAAG,aAAsC,mBAqBzD"}

package/dist/components/ui/show-toast.js

@@ -0,0 +1,65 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { toast as m } from "sonner";
+import { cn as c } from "../../lib/utils.js";
+import { CheckIcon as f, XIcon as l, InfoIcon as x } from "./icons.js";
+const d = ({ message: t, onClose: n, toastId: s }) => /* @__PURE__ */ i(
+  "button",
+  {
+    className: c(
+      "data-testid-toast-success bg-default dark:bg-inverted text-emphasis dark:text-inverted shadow-elevation-low border-subtle mb-2 flex h-auto items-center justify-between space-x-2 rounded-lg border px-3 py-2.5 text-sm font-semibold rtl:space-x-reverse md:max-w-sm"
+    ),
+    onClick: () => n(s),
+    children: [
+      /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(f, { className: "size-4" }) }),
+      /* @__PURE__ */ e("div", { className: "flex items-center", children: /* @__PURE__ */ e("p", { "data-testid": "toast-success", className: "m-0 w-full text-left", children: t }) }),
+      /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(l, { className: "size-4 hover:cursor-pointer" }) })
+    ]
+  }
+), b = ({ message: t, onClose: n, toastId: s }) => /* @__PURE__ */ i(
+  "button",
+  {
+    className: c(
+      "animate-fade-in-up bg-semantic-error-subtle text-semantic-error shadow-elevation-low border-semantic-error-subtle mb-2 flex h-auto items-center justify-between space-x-2 rounded-md border px-3 py-2.5 text-sm font-semibold rtl:space-x-reverse md:max-w-sm"
+    ),
+    onClick: () => n(s),
+    children: [
+      /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(x, { className: "text-semantic-error size-4" }) }),
+      /* @__PURE__ */ e("div", { className: "flex items-center", children: /* @__PURE__ */ e("p", { "data-testid": "toast-error", className: "m-0 w-full text-left", children: t }) }),
+      /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(l, { className: "text-semantic-error size-4 hover:cursor-pointer" }) })
+    ]
+  }
+), h = ({ message: t, onClose: n, toastId: s }) => /* @__PURE__ */ i(
+  "button",
+  {
+    className: c(
+      "animate-fade-in-up bg-semantic-attention-subtle text-semantic-attention shadow-elevation-low border-semantic-attention-subtle mb-2 flex h-auto items-center justify-between space-x-2 rounded-md border px-3 py-2.5 text-sm font-semibold rtl:space-x-reverse md:max-w-sm"
+    ),
+    onClick: () => n(s),
+    children: [
+      /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(x, { className: "text-semantic-attention size-4" }) }),
+      /* @__PURE__ */ e("div", { className: "flex items-center", children: /* @__PURE__ */ e("p", { "data-testid": "toast-warning", className: "m-0 w-full text-left", children: t }) }),
+      /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(l, { className: "text-semantic-attention size-4 hover:cursor-pointer" }) })
+    ]
+  }
+), u = 6e3;
+function I(t, n, s = u) {
+  const a = typeof s == "number" ? { duration: s } : s;
+  a.duration || (a.duration = u), a.position || (a.position = "bottom-center");
+  const o = (r) => {
+    m.dismiss(r);
+  }, p = {
+    success: (r) => /* @__PURE__ */ e(d, { message: t, onClose: o, toastId: r }),
+    error: (r) => /* @__PURE__ */ e(b, { message: t, onClose: o, toastId: r }),
+    warning: (r) => /* @__PURE__ */ e(h, { message: t, onClose: o, toastId: r })
+  };
+  return m.custom(
+    p[n] || ((r) => /* @__PURE__ */ e(d, { message: t, onClose: o, toastId: r })),
+    a
+  );
+}
+export {
+  b as ErrorToast,
+  d as SuccessToast,
+  h as WarningToast,
+  I as showToast
+};

package/dist/components/ui/skeleton.d.ts

@@ -0,0 +1,31 @@
+import { default as React } from 'react';
+type SkeletonBaseProps = {
+    className?: string;
+};
+interface SkeletonContainerProps {
+    as?: keyof JSX.IntrinsicElements;
+    children?: React.ReactNode;
+    className?: string;
+}
+type SkeletonLoaderProps = {
+    className: string;
+};
+declare const SkeletonAvatar: React.FC<SkeletonBaseProps>;
+type SkeletonProps<T> = {
+    as: keyof JSX.IntrinsicElements | React.FC;
+    className?: string;
+    children: React.ReactNode;
+    loading?: boolean;
+    waitForTranslation?: boolean;
+    loadingClassName?: string;
+} & (T extends React.FC<infer P> ? P : T extends keyof JSX.IntrinsicElements ? JSX.IntrinsicElements[T] : never);
+declare const Skeleton: <T extends keyof JSX.IntrinsicElements | React.FC>({ as, className, children, loading, waitForTranslation, loadingClassName, ...rest }: SkeletonProps<T>) => JSX.Element;
+declare const SkeletonText: React.FC<SkeletonBaseProps & {
+    invisible?: boolean;
+    style?: React.CSSProperties;
+}>;
+declare const SkeletonButton: React.FC<SkeletonBaseProps>;
+declare const SkeletonContainer: React.FC<SkeletonContainerProps>;
+declare const SelectSkeletonLoader: React.FC<SkeletonLoaderProps>;
+export { Skeleton, SkeletonAvatar, SkeletonText, SkeletonButton, SkeletonContainer, SelectSkeletonLoader };
+//# sourceMappingURL=skeleton.d.ts.map

package/dist/components/ui/skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../src/components/ui/skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,KAAK,iBAAiB,GAAG;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,UAAU,sBAAsB;IAC9B,EAAE,CAAC,EAAE,MAAM,GAAG,CAAC,iBAAiB,CAAC;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,KAAK,mBAAmB,GAAG;IACzB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAE/C,CAAC;AAEF,KAAK,aAAa,CAAC,CAAC,IAAI;IACtB,EAAE,EAAE,MAAM,GAAG,CAAC,iBAAiB,GAAG,KAAK,CAAC,EAAE,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,GAC5B,CAAC,GACD,CAAC,SAAS,MAAM,GAAG,CAAC,iBAAiB,GACnC,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,GACxB,KAAK,CAAC,CAAC;AAEb,QAAA,MAAM,QAAQ,GAAI,CAAC,SAAS,MAAM,GAAG,CAAC,iBAAiB,GAAG,KAAK,CAAC,EAAE,EAAE,qFAQjE,aAAa,CAAC,CAAC,CAAC,gBAiBlB,CAAC;AAEF,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,GAAG;IAAE,SAAS,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAAE,CAepG,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAM/C,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAGvD,CAAC;AAEF,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAgBvD,CAAC;AAEF,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,CAAC"}

package/dist/components/ui/skeleton.js

@@ -0,0 +1,59 @@
+import { jsx as t, jsxs as d } from "react/jsx-runtime";
+import { useAtomsLocale as u } from "../../hooks/use-atoms-locale.js";
+import { cn as s } from "../../lib/utils.js";
+const N = ({ className: e }) => /* @__PURE__ */ t("div", { className: s("bg-emphasis me-3 mt-1 rounded-full", e) }), k = ({
+  as: e,
+  className: n = "",
+  children: o,
+  loading: r = !1,
+  waitForTranslation: l = !0,
+  loadingClassName: m = "",
+  ...c
+}) => {
+  const { isLocaleReady: i } = u();
+  return r = (l ? !i : !1) || r, /* @__PURE__ */ t(
+    e,
+    {
+      className: s(
+        r ? s("font-size-0 bg-emphasis animate-pulse rounded-md text-transparent", m) : "",
+        n
+      ),
+      ...c,
+      children: o
+    }
+  );
+}, a = ({
+  className: e = "",
+  invisible: n = !1,
+  style: o
+}) => /* @__PURE__ */ t(
+  "span",
+  {
+    style: o,
+    className: s(
+      "font-size-0 bg-emphasis inline-block animate-pulse rounded-md empty:before:inline-block empty:before:content-['']",
+      e,
+      n ? "invisible" : ""
+    )
+  }
+), v = ({ className: e }) => /* @__PURE__ */ t(p, { children: /* @__PURE__ */ t("div", { className: s("bg-emphasis rounded-md", e) }) }), p = ({ children: e, as: n, className: o }) => /* @__PURE__ */ t(n || "div", { className: s("animate-pulse", o), children: e }), S = ({ className: e }) => /* @__PURE__ */ t(
+  "li",
+  {
+    className: s(
+      "border-subtle group flex w-full items-center justify-between rounded-sm border px-[10px] py-3",
+      e
+    ),
+    children: /* @__PURE__ */ t("div", { className: "grow truncate text-sm", children: /* @__PURE__ */ d("div", { className: "flex justify-between", children: [
+      /* @__PURE__ */ t(a, { className: "h-4 w-32" }),
+      /* @__PURE__ */ t(a, { className: "h-4 w-4" })
+    ] }) })
+  }
+);
+export {
+  S as SelectSkeletonLoader,
+  k as Skeleton,
+  N as SkeletonAvatar,
+  v as SkeletonButton,
+  p as SkeletonContainer,
+  a as SkeletonText
+};

package/dist/components/ui/switch.d.ts

@@ -0,0 +1,17 @@
+import { default as React, ReactNode } from 'react';
+import * as PrimitiveSwitch from "@radix-ui/react-switch";
+export declare const Switch: (props: React.ComponentProps<typeof PrimitiveSwitch.Root> & {
+    label?: string | ReactNode;
+    fitToHeight?: boolean;
+    disabled?: boolean;
+    tooltip?: string;
+    labelOnLeading?: boolean;
+    size?: "base" | "sm";
+    classNames?: {
+        container?: string;
+        thumb?: string;
+    };
+    LockedIcon?: React.ReactNode;
+    padding?: boolean;
+}) => JSX.Element;
+//# sourceMappingURL=switch.d.ts.map

package/dist/components/ui/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/components/ui/switch.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAYvC,eAAO,MAAM,MAAM,GACjB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IACzD,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,gBA6DF,CAAC"}

package/dist/components/ui/switch.js

@@ -0,0 +1,71 @@
+import { jsx as t, jsxs as u, Fragment as b } from "react/jsx-runtime";
+import { useId as f } from "@radix-ui/react-id";
+import * as l from "@radix-ui/react-switch";
+import { cn as o } from "../../lib/utils.js";
+import { Tooltip as p } from "./tooltip.js";
+const x = ({ children: r, tooltip: a }) => a ? /* @__PURE__ */ t(p, { content: a, children: r }) : /* @__PURE__ */ t(b, { children: r }), j = (r) => {
+  const {
+    label: a,
+    fitToHeight: h,
+    classNames: e,
+    labelOnLeading: i,
+    LockedIcon: s,
+    padding: m,
+    size: n = "base",
+    ...d
+  } = r, c = f();
+  return /* @__PURE__ */ t(x, { tooltip: r.tooltip, children: /* @__PURE__ */ u(
+    "div",
+    {
+      className: o(
+        "flex h-auto w-fit flex-row items-center",
+        h && "h-fit",
+        i && "flex-row-reverse justify-between",
+        m && "hover:bg-subtle rounded-md p-1.5",
+        e == null ? void 0 : e.container
+      ),
+      children: [
+        s && /* @__PURE__ */ t("div", { className: "mr-2", children: s }),
+        /* @__PURE__ */ t(
+          l.Root,
+          {
+            ...d,
+            id: c,
+            className: o(
+              n === "sm" ? "h-3 w-[20px]" : "h-4 w-[28px]",
+              "focus:ring-brand-default data-[state=checked]:bg-brand-default dark:data-[state=checked]:bg-brand-emphasis data-[state=unchecked]:bg-emphasis peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-inner transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+              n === "sm" ? "h-4 w-7" : "h-6 w-11",
+              e == null ? void 0 : e.container
+            ),
+            children: /* @__PURE__ */ t(
+              l.Thumb,
+              {
+                className: o(
+                  "bg-default data-[state=checked]:bg-brand-accent shadow-switch-thumb pointer-events-none block rounded-full shadow-lg ring-0 transition-transform",
+                  n === "sm" ? "h-3 w-3 data-[state=checked]:translate-x-3 data-[state=unchecked]:translate-x-0 rtl:data-[state=checked]:-translate-x-3" : "h-5 w-5 data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0 rtl:data-[state=checked]:-translate-x-5",
+                  e == null ? void 0 : e.thumb
+                )
+              }
+            )
+          }
+        ),
+        a && /* @__PURE__ */ t(
+          "label",
+          {
+            htmlFor: c,
+            className: o(
+              "text-emphasis font-medium",
+              n === "sm" ? "m-1 text-xs" : i ? "mr-2 text-sm" : "ml-2 text-sm",
+              d.disabled ? "cursor-not-allowed opacity-25" : "cursor-pointer",
+              i && "flex-1"
+            ),
+            children: a
+          }
+        )
+      ]
+    }
+  ) });
+};
+export {
+  j as Switch
+};

package/dist/components/ui/text-field.d.ts

@@ -0,0 +1,99 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+export declare const inputStyles: (props?: ({
+    size?: "sm" | "md" | null | undefined;
+} & import('class-variance-authority/dist/types').ClassProp) | undefined) => string;
+type InputBaseProps = Omit<ComponentPropsWithoutRef<"input">, "size">;
+type InputProps = InputBaseProps & {
+    isFullWidth?: boolean;
+    size?: "sm" | "md";
+};
+export declare const Input: import('react').ForwardRefExoticComponent<InputBaseProps & {
+    isFullWidth?: boolean;
+    size?: "sm" | "md";
+} & import('react').RefAttributes<HTMLInputElement>>;
+type TextAreaProps = ComponentPropsWithoutRef<"textarea">;
+export declare const TextArea: import('react').ForwardRefExoticComponent<Pick<import('react').DetailedHTMLProps<import('react').TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "key" | keyof import('react').TextareaHTMLAttributes<HTMLTextAreaElement>> & import('react').RefAttributes<HTMLTextAreaElement>>;
+export type TextAreaFieldProps = TextAreaProps & {
+    label?: ReactNode;
+    name: string;
+    labelClassName?: string;
+};
+export declare const TextAreaField: import('react').ForwardRefExoticComponent<Pick<import('react').DetailedHTMLProps<import('react').TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "key" | keyof import('react').TextareaHTMLAttributes<HTMLTextAreaElement>> & {
+    label?: ReactNode;
+    name: string;
+    labelClassName?: string;
+} & import('react').RefAttributes<HTMLTextAreaElement>>;
+export type InputFieldProps = InputProps & {
+    label?: ReactNode;
+    labelClassName?: string;
+    labelSrOnly?: boolean;
+    noLabel?: boolean;
+    hint?: ReactNode;
+    error?: string | boolean;
+    addOnSuffix?: ReactNode;
+    onClickAddon?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    containerClassName?: string;
+    showAsteriskIndicator?: boolean;
+};
+export declare const InputField: import('react').ForwardRefExoticComponent<InputBaseProps & {
+    isFullWidth?: boolean;
+    size?: "sm" | "md";
+} & {
+    label?: ReactNode;
+    labelClassName?: string;
+    labelSrOnly?: boolean;
+    noLabel?: boolean;
+    hint?: ReactNode;
+    error?: string | boolean;
+    addOnSuffix?: ReactNode;
+    onClickAddon?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    containerClassName?: string;
+    showAsteriskIndicator?: boolean;
+} & import('react').RefAttributes<HTMLInputElement>>;
+export declare const TextField: import('react').ForwardRefExoticComponent<InputBaseProps & {
+    isFullWidth?: boolean;
+    size?: "sm" | "md";
+} & {
+    label?: ReactNode;
+    labelClassName?: string;
+    labelSrOnly?: boolean;
+    noLabel?: boolean;
+    hint?: ReactNode;
+    error?: string | boolean;
+    addOnSuffix?: ReactNode;
+    onClickAddon?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    containerClassName?: string;
+    showAsteriskIndicator?: boolean;
+} & import('react').RefAttributes<HTMLInputElement>>;
+export declare const EmailField: import('react').ForwardRefExoticComponent<InputBaseProps & {
+    isFullWidth?: boolean;
+    size?: "sm" | "md";
+} & {
+    label?: ReactNode;
+    labelClassName?: string;
+    labelSrOnly?: boolean;
+    noLabel?: boolean;
+    hint?: ReactNode;
+    error?: string | boolean;
+    addOnSuffix?: ReactNode;
+    onClickAddon?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    containerClassName?: string;
+    showAsteriskIndicator?: boolean;
+} & import('react').RefAttributes<HTMLInputElement>>;
+export declare const PasswordField: import('react').ForwardRefExoticComponent<InputBaseProps & {
+    isFullWidth?: boolean;
+    size?: "sm" | "md";
+} & {
+    label?: ReactNode;
+    labelClassName?: string;
+    labelSrOnly?: boolean;
+    noLabel?: boolean;
+    hint?: ReactNode;
+    error?: string | boolean;
+    addOnSuffix?: ReactNode;
+    onClickAddon?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    containerClassName?: string;
+    showAsteriskIndicator?: boolean;
+} & import('react').RefAttributes<HTMLInputElement>>;
+export {};
+//# sourceMappingURL=text-field.d.ts.map

package/dist/components/ui/text-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../src/components/ui/text-field.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOjE,eAAO,MAAM,WAAW;;mFA6BvB,CAAC;AAEF,KAAK,cAAc,GAAG,IAAI,CAAC,wBAAwB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC,CAAC;AAEtE,KAAK,UAAU,GAAG,cAAc,GAAG;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,KAAK;kBAJF,OAAO;WACd,IAAI,GAAG,IAAI;oDAUlB,CAAC;AAEH,KAAK,aAAa,GAAG,wBAAwB,CAAC,UAAU,CAAC,CAAC;AAE1D,eAAO,MAAM,QAAQ,sSAKnB,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG,aAAa,GAAG;IAC/C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,aAAa;YALhB,SAAS;UACX,MAAM;qBACK,MAAM;uDAkBvB,CAAC;AAEH,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG;IACzC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC7D,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,UAAU;kBA1DP,OAAO;WACd,IAAI,GAAG,IAAI;;YA6CV,SAAS;qBACA,MAAM;kBACT,OAAO;cACX,OAAO;WACV,SAAS;YACR,MAAM,GAAG,OAAO;kBACV,SAAS;mBACR,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI;yBACvC,MAAM;4BACH,OAAO;oDAuF/B,CAAC;AAEH,eAAO,MAAM,SAAS;kBAhJN,OAAO;WACd,IAAI,GAAG,IAAI;;YA6CV,SAAS;qBACA,MAAM;kBACT,OAAO;cACX,OAAO;WACV,SAAS;YACR,MAAM,GAAG,OAAO;kBACV,SAAS;mBACR,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI;yBACvC,MAAM;4BACH,OAAO;oDA2F/B,CAAC;AAEH,eAAO,MAAM,UAAU;kBApJP,OAAO;WACd,IAAI,GAAG,IAAI;;YA6CV,SAAS;qBACA,MAAM;kBACT,OAAO;cACX,OAAO;WACV,SAAS;YACR,MAAM,GAAG,OAAO;kBACV,SAAS;mBACR,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI;yBACvC,MAAM;4BACH,OAAO;oDAyG/B,CAAC;AAEH,eAAO,MAAM,aAAa;kBAlKV,OAAO;WACd,IAAI,GAAG,IAAI;;YA6CV,SAAS;qBACA,MAAM;kBACT,OAAO;cACX,OAAO;WACV,SAAS;YACR,MAAM,GAAG,OAAO;kBACV,SAAS;mBACR,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI;yBACvC,MAAM;4BACH,OAAO;oDA4IhC,CAAC"}