@pelatform/starter.shared 0.1.0

package/README.md

@@ -0,0 +1,5 @@
+# Pelatform Starter
+
+A part of SaaS starter kit for Pelatform applications.
+
+[![Version](https://img.shields.io/npm/v/@pelatform/starter.svg)](https://www.npmjs.com/package/@pelatform/starter)

package/dist/index.d.ts

@@ -0,0 +1,166 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentProps, ReactNode, PropsWithChildren } from 'react';
+import { Avatar, buttonVariants, Dialog, Card, Button, Input } from 'pelatform-ui/default';
+import { User, Workspace, ApiKey } from '@pelatform/starter.utils';
+import { LucideIcon } from 'lucide-react';
+import { LanguageSwitcherProps } from 'pelatform-ui/components';
+export { Logo as LogoDefault } from 'pelatform-ui/components';
+
+type AvatarClassNames = {
+    base?: string;
+    fallback?: string;
+    fallbackIcon?: string;
+    image?: string;
+    skeleton?: string;
+};
+interface AvatarProps extends ComponentProps<typeof Avatar> {
+    className?: string;
+    classNames?: AvatarClassNames;
+    image?: string;
+    isPending?: boolean;
+    size?: NonNullable<Parameters<typeof buttonVariants>[0]>["size"] | null | undefined;
+    user?: Partial<User> | null;
+    workspace?: Partial<Workspace> | null;
+}
+
+type DialogClassNames = {
+    content?: string;
+    header?: string;
+    footer?: string;
+};
+interface DialogComponentProps extends ComponentProps<typeof Dialog> {
+    className?: string;
+    children?: ReactNode;
+    classNames?: CardClassNames;
+    title?: string;
+    description?: string;
+    disableFooter?: boolean;
+    cancelButton?: boolean;
+    cancelButtonDisabled?: boolean;
+    button?: ReactNode;
+}
+
+type CardClassNames = {
+    base?: string;
+    cell?: string;
+    content?: string;
+    header?: string;
+    footer?: string;
+    grid?: string;
+    skeleton?: string;
+    title?: string;
+    description?: string;
+    instructions?: string;
+    error?: string;
+    label?: string;
+    input?: string;
+    checkbox?: string;
+    icon?: string;
+    button?: string;
+    primaryButton?: string;
+    secondaryButton?: string;
+    outlineButton?: string;
+    destructiveButton?: string;
+    avatar?: AvatarClassNames;
+    dialog?: DialogClassNames;
+};
+interface CardComponentProps extends Omit<ComponentProps<typeof Card>, "title" | "variant"> {
+    className?: string;
+    children?: ReactNode;
+    classNames?: CardClassNames;
+    title?: ReactNode;
+    description?: ReactNode;
+    instructions?: ReactNode;
+    actionLabel?: ReactNode;
+    action?: () => Promise<unknown> | unknown;
+    disabled?: boolean;
+    isDestructive?: boolean;
+    isPending?: boolean;
+    isSubmitting?: boolean;
+}
+
+declare function CardComponent({ children, className, classNames, title, description, instructions, actionLabel, action, disabled, isDestructive, isPending, isSubmitting, ...props }: CardComponentProps): react_jsx_runtime.JSX.Element;
+declare function CardHeaderComponent({ className, classNames, title, description, isPending, }: CardComponentProps): react_jsx_runtime.JSX.Element;
+declare function CardFooterComponent({ className, classNames, instructions, actionLabel, action, disabled, isDestructive, isPending, isSubmitting, }: CardComponentProps): react_jsx_runtime.JSX.Element;
+declare function CardActionComponent({ classNames, actionLabel, onClick, disabled, isDestructive, isSubmitting, ...props }: CardComponentProps & ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+
+declare function DialogComponent({ children, classNames, onOpenChange, title, description, disableFooter, cancelButton, cancelButtonDisabled, button, ...props }: DialogComponentProps): react_jsx_runtime.JSX.Element;
+declare function DialogFooterComponent({ className, classNames, onOpenChange, cancelButton, cancelButtonDisabled, button, }: DialogComponentProps): react_jsx_runtime.JSX.Element;
+
+declare function SkeletonViewComponent({ classNames }: {
+    classNames?: CardClassNames;
+}): react_jsx_runtime.JSX.Element;
+declare function SkeletonInputComponent({ classNames }: {
+    classNames?: CardClassNames;
+}): react_jsx_runtime.JSX.Element;
+
+declare function UserAvatar({ className, classNames, image, isPending, size, user, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
+declare function WorkspaceLogo({ className, classNames, image, isPending, size, workspace, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
+
+declare function DisplayIdCard({ className, classNames, isPending, id, title, description, ...props }: CardComponentProps & {
+    id: string | undefined;
+    title: string;
+    description: string;
+}): react_jsx_runtime.JSX.Element;
+
+type EmptyStateProps = PropsWithChildren<{
+    className?: string;
+    icon?: LucideIcon;
+    title: string;
+    description?: ReactNode;
+    learnMore?: string;
+    learnMoreText?: string;
+}>;
+declare function EmptyState({ className, icon: Icon, title, description, learnMore, learnMoreText, children, }: EmptyStateProps): react_jsx_runtime.JSX.Element;
+
+declare function LanguageSwitcher({ className, type, variant, size, showNames, showFlags, }: Omit<LanguageSwitcherProps, "currentLocale" | "locales" | "onLocaleChange">): react_jsx_runtime.JSX.Element;
+
+interface LogoProps {
+    className?: string;
+    href?: string;
+}
+
+declare function LogoWithName({ className }: LogoProps): react_jsx_runtime.JSX.Element;
+declare function LogoWithHref({ className, href }: LogoProps): react_jsx_runtime.JSX.Element;
+
+declare function OTPInputGroup({ otpSeparators }: {
+    otpSeparators?: 0 | 1 | 2;
+}): react_jsx_runtime.JSX.Element;
+
+declare function PasswordInput({ className, variant, enableToggle, onChange, ...props }: ComponentProps<typeof Input> & {
+    enableToggle?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+declare function SignedInHint({ linkHref }: {
+    linkHref?: string;
+}): react_jsx_runtime.JSX.Element;
+
+declare function UserMenu({ hiddenSwitcher }: {
+    hiddenSwitcher?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+type ViewClassNames = {
+    base?: string;
+    content?: string;
+    title?: string;
+    subtitle?: string;
+    skeleton?: string;
+    icon?: string;
+    avatar?: AvatarClassNames;
+};
+interface ViewProps {
+    className?: string;
+    classNames?: ViewClassNames;
+    isPending?: boolean;
+    size?: NonNullable<Parameters<typeof buttonVariants>[0]>["size"] | null | undefined;
+    user?: Partial<User> | null;
+    workspace?: Partial<Workspace> | null;
+}
+
+declare function UserView({ className, classNames, isPending, size, user }: ViewProps): react_jsx_runtime.JSX.Element;
+declare function ApiKeyView({ className, classNames, apiKey }: ViewProps & {
+    apiKey: ApiKey;
+}): react_jsx_runtime.JSX.Element;
+declare function WorkspaceView({ className, classNames, isPending, size, workspace }: ViewProps): react_jsx_runtime.JSX.Element;
+
+export { ApiKeyView, type AvatarClassNames, type AvatarProps, CardActionComponent, type CardClassNames, CardComponent, type CardComponentProps, CardFooterComponent, CardHeaderComponent, type DialogClassNames, DialogComponent, type DialogComponentProps, DialogFooterComponent, DisplayIdCard, EmptyState, type EmptyStateProps, LanguageSwitcher, LogoWithHref, LogoWithName, OTPInputGroup, PasswordInput, SignedInHint, SkeletonInputComponent, SkeletonViewComponent, UserAvatar, UserMenu, UserView, type ViewClassNames, type ViewProps, WorkspaceLogo, WorkspaceView };

package/dist/index.js

@@ -0,0 +1,993 @@
+"use client";
+
+// src/components/utils/card.tsx
+import { useFormState } from "react-hook-form";
+import { cn } from "pelatform-ui";
+import { Button, Card, CardContent, CardFooter, Skeleton, Spinner } from "pelatform-ui/default";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function CardComponent({
+  children,
+  className,
+  classNames,
+  title,
+  description,
+  instructions,
+  actionLabel,
+  action,
+  disabled,
+  isDestructive,
+  isPending,
+  isSubmitting,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    Card,
+    {
+      className: cn(
+        "w-full overflow-hidden",
+        isDestructive && "border-destructive/70",
+        className,
+        classNames?.base
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(CardContent, { className: cn("space-y-6 p-5 sm:p-10", classNames?.content), children: [
+          /* @__PURE__ */ jsx(
+            CardHeaderComponent,
+            {
+              classNames,
+              description,
+              title,
+              isPending
+            }
+          ),
+          children
+        ] }),
+        /* @__PURE__ */ jsx(
+          CardFooterComponent,
+          {
+            classNames,
+            instructions,
+            actionLabel,
+            action,
+            disabled,
+            isDestructive,
+            isPending,
+            isSubmitting
+          }
+        )
+      ]
+    }
+  );
+}
+function CardHeaderComponent({
+  className,
+  classNames,
+  title,
+  description,
+  isPending
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col space-y-2", className, classNames?.header), children: isPending ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: cn("h-7 w-1/3", classNames?.skeleton) }),
+    description && /* @__PURE__ */ jsx(Skeleton, { className: cn("h-5 w-2/3", classNames?.skeleton) })
+  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("h2", { className: cn("font-medium text-xl", classNames?.title), children: title }),
+    description && /* @__PURE__ */ jsx("p", { className: cn("text-muted-foreground text-sm", classNames?.description), children: description })
+  ] }) });
+}
+function CardFooterComponent({
+  className,
+  classNames,
+  instructions,
+  actionLabel,
+  action,
+  disabled,
+  isDestructive,
+  isPending,
+  isSubmitting
+}) {
+  return /* @__PURE__ */ jsx(
+    CardFooter,
+    {
+      className: cn(
+        "flex items-center justify-between space-x-4 bg-muted p-3 sm:px-10",
+        isDestructive && "border-destructive/70",
+        className,
+        classNames?.footer
+      ),
+      children: isPending ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        instructions && /* @__PURE__ */ jsx(
+          Skeleton,
+          {
+            className: cn(
+              "h-4 w-48 max-w-full bg-muted-foreground/10 md:h-5 md:w-60",
+              classNames?.skeleton
+            )
+          }
+        ),
+        actionLabel && /* @__PURE__ */ jsx(
+          Skeleton,
+          {
+            className: cn("h-8 w-20 bg-muted-foreground/10 md:ms-auto", classNames?.skeleton)
+          }
+        )
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        instructions && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn("text-muted-foreground text-xs md:text-sm", classNames?.instructions),
+            children: instructions
+          }
+        ),
+        actionLabel && /* @__PURE__ */ jsx(
+          CardActionComponent,
+          {
+            classNames,
+            actionLabel,
+            onClick: action,
+            disabled,
+            isDestructive,
+            isSubmitting
+          }
+        )
+      ] })
+    }
+  );
+}
+function CardActionComponent({
+  classNames,
+  actionLabel,
+  onClick,
+  disabled,
+  isDestructive,
+  isSubmitting,
+  ...props
+}) {
+  if (!onClick) {
+    const formState = useFormState();
+    isSubmitting = formState.isSubmitting;
+  }
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      type: onClick ? "button" : "submit",
+      variant: isDestructive ? "destructive" : "primary",
+      size: "sm",
+      className: cn(
+        "ms-auto",
+        isSubmitting || disabled ? "pointer-events-auto! cursor-not-allowed" : "",
+        classNames?.button,
+        isDestructive ? classNames?.destructiveButton : classNames?.primaryButton
+      ),
+      onClick,
+      disabled: isSubmitting || disabled,
+      ...props,
+      children: [
+        isSubmitting && /* @__PURE__ */ jsx(Spinner, {}),
+        actionLabel
+      ]
+    }
+  );
+}
+
+// src/components/utils/dialog.tsx
+import { useTranslations } from "next-intl";
+import { cn as cn2 } from "pelatform-ui";
+import {
+  Button as Button2,
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from "pelatform-ui/default";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function DialogComponent({
+  children,
+  classNames,
+  onOpenChange,
+  title,
+  description,
+  disableFooter,
+  cancelButton,
+  cancelButtonDisabled,
+  button,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(Dialog, { onOpenChange, ...props, children: /* @__PURE__ */ jsxs2(
+    DialogContent,
+    {
+      onOpenAutoFocus: (e) => e.preventDefault(),
+      className: classNames?.dialog?.content,
+      children: [
+        /* @__PURE__ */ jsxs2(DialogHeader, { className: cn2("space-y-2", classNames?.header), children: [
+          /* @__PURE__ */ jsx2(DialogTitle, { className: classNames?.title, children: title }),
+          description && /* @__PURE__ */ jsx2(DialogDescription, { className: classNames?.description, children: description })
+        ] }),
+        children,
+        !disableFooter && /* @__PURE__ */ jsx2(
+          DialogFooterComponent,
+          {
+            classNames,
+            onOpenChange,
+            cancelButton,
+            cancelButtonDisabled,
+            button
+          }
+        )
+      ]
+    }
+  ) });
+}
+function DialogFooterComponent({
+  className,
+  classNames,
+  onOpenChange,
+  cancelButton,
+  cancelButtonDisabled,
+  button
+}) {
+  const t = useTranslations();
+  return /* @__PURE__ */ jsxs2(DialogFooter, { className: cn2(className, classNames?.dialog?.footer), children: [
+    cancelButton && /* @__PURE__ */ jsx2(
+      Button2,
+      {
+        type: "button",
+        variant: "secondary",
+        className: cn2(classNames?.button, classNames?.secondaryButton),
+        onClick: () => onOpenChange?.(false),
+        disabled: cancelButtonDisabled,
+        children: t("common.actions.cancel")
+      }
+    ),
+    button
+  ] });
+}
+
+// src/components/utils/skeleton.tsx
+import { cn as cn3 } from "pelatform-ui";
+import { Card as Card2, Skeleton as Skeleton2 } from "pelatform-ui/default";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function SkeletonViewComponent({ classNames }) {
+  return /* @__PURE__ */ jsxs3(Card2, { className: cn3("flex-row items-center gap-3 px-4 py-3", classNames?.cell), children: [
+    /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx3(Skeleton2, { className: cn3("size-5 rounded-full", classNames?.skeleton) }),
+      /* @__PURE__ */ jsx3("div", { children: /* @__PURE__ */ jsx3(Skeleton2, { className: cn3("h-4 w-32", classNames?.skeleton) }) })
+    ] }),
+    /* @__PURE__ */ jsx3(Skeleton2, { className: cn3("ms-auto size-8 w-16", classNames?.skeleton) })
+  ] });
+}
+function SkeletonInputComponent({ classNames }) {
+  return /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ jsx3(Skeleton2, { className: cn3("h-4 w-32", classNames?.skeleton) }),
+    /* @__PURE__ */ jsx3(Skeleton2, { className: cn3("h-9 w-full", classNames?.skeleton) })
+  ] });
+}
+
+// src/components/avatar.tsx
+import { BuildingIcon, UserRoundIcon } from "lucide-react";
+import { useTranslations as useTranslations2 } from "next-intl";
+import { getSizeAvatar, getUserName } from "@pelatform/starter.utils";
+import { cn as cn4 } from "pelatform-ui";
+import { getInitials } from "pelatform-ui/components";
+import { Avatar, AvatarFallback, AvatarImage, Skeleton as Skeleton3 } from "pelatform-ui/default";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function UserAvatar({
+  className,
+  classNames,
+  image,
+  isPending,
+  size,
+  user,
+  ...props
+}) {
+  const t = useTranslations2();
+  const name = getUserName(user);
+  const src = user?.image;
+  if (isPending) {
+    return /* @__PURE__ */ jsx4(
+      Skeleton3,
+      {
+        className: cn4(
+          "shrink-0 rounded-full",
+          getSizeAvatar(size),
+          className,
+          classNames?.base,
+          classNames?.skeleton
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs4(
+    Avatar,
+    {
+      className: cn4("rounded-full bg-accent", getSizeAvatar(size), className, classNames?.base),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx4(
+          AvatarImage,
+          {
+            src: image || src || void 0,
+            alt: name || t("ui.navigation.user"),
+            className: classNames?.image
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          AvatarFallback,
+          {
+            className: cn4("text-foreground uppercase", classNames?.fallback),
+            delayMs: src ? 600 : void 0,
+            children: getInitials(name, 2) || /* @__PURE__ */ jsx4(UserRoundIcon, { className: cn4("size-[50%]", classNames?.fallbackIcon) })
+          }
+        )
+      ]
+    }
+  );
+}
+function WorkspaceLogo({
+  className,
+  classNames,
+  image,
+  isPending,
+  size,
+  workspace,
+  ...props
+}) {
+  const t = useTranslations2();
+  const name = workspace?.name;
+  const src = workspace?.logo;
+  if (isPending) {
+    return /* @__PURE__ */ jsx4(
+      Skeleton3,
+      {
+        className: cn4(
+          "shrink-0 rounded-full",
+          getSizeAvatar(size),
+          className,
+          classNames?.base,
+          classNames?.skeleton
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs4(
+    Avatar,
+    {
+      className: cn4("rounded-full bg-accent", getSizeAvatar(size), className, classNames?.base),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx4(
+          AvatarImage,
+          {
+            src: image || src || void 0,
+            alt: name || t("ui.navigation.workspace"),
+            className: classNames?.image
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          AvatarFallback,
+          {
+            className: cn4("text-foreground", classNames?.fallback),
+            delayMs: src ? 600 : void 0,
+            children: /* @__PURE__ */ jsx4(BuildingIcon, { className: cn4("size-[50%]", classNames?.fallbackIcon) })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/display-id.tsx
+import { useRef } from "react";
+import { CheckIcon, CopyIcon } from "lucide-react";
+import { useTranslations as useTranslations3 } from "next-intl";
+import { cn as cn5 } from "pelatform-ui";
+import {
+  Button as Button3,
+  Input,
+  Skeleton as Skeleton4,
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger
+} from "pelatform-ui/default";
+import { useCopyToClipboard } from "pelatform-ui/hooks";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function DisplayIdCard({
+  className,
+  classNames,
+  isPending,
+  id,
+  title,
+  description,
+  ...props
+}) {
+  const t = useTranslations3();
+  const { copy, copied } = useCopyToClipboard();
+  const inputRef = useRef(null);
+  const handleCopy = () => {
+    if (inputRef.current) {
+      copy(inputRef.current.value);
+    }
+  };
+  return /* @__PURE__ */ jsx5(
+    CardComponent,
+    {
+      className,
+      classNames,
+      title,
+      description,
+      isPending,
+      ...props,
+      children: isPending ? /* @__PURE__ */ jsx5(Skeleton4, { className: cn5("h-11.5 w-full max-w-md", classNames?.skeleton) }) : /* @__PURE__ */ jsxs5(
+        "div",
+        {
+          className: cn5(
+            "flex w-full max-w-md items-center justify-between rounded-md border p-2",
+            classNames?.grid
+          ),
+          children: [
+            /* @__PURE__ */ jsx5(Input, { value: id, ref: inputRef, disabled: true, className: "border-none! bg-transparent!" }),
+            /* @__PURE__ */ jsx5(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsxs5(Tooltip, { children: [
+              /* @__PURE__ */ jsx5(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx5(Button3, { variant: "dim", onClick: handleCopy, disabled: copied, children: copied ? /* @__PURE__ */ jsx5(CheckIcon, { className: cn5("stroke-green-600", classNames?.icon) }) : /* @__PURE__ */ jsx5(CopyIcon, { className: classNames?.icon }) }) }),
+              /* @__PURE__ */ jsx5(TooltipContent, { className: "px-2 py-1 text-xs", children: t("common.actions.copy") })
+            ] }) })
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/components/empty-state.tsx
+import Link from "next/link";
+import { useTranslations as useTranslations4 } from "next-intl";
+import { cn as cn6 } from "pelatform-ui";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+function EmptyState({
+  className,
+  icon: Icon,
+  title,
+  description,
+  learnMore,
+  learnMoreText,
+  children
+}) {
+  const t = useTranslations4();
+  return /* @__PURE__ */ jsxs6("div", { className: cn6("flex flex-col items-center justify-center gap-y-4", className), children: [
+    Icon && /* @__PURE__ */ jsx6("div", { className: "flex size-14 items-center justify-center rounded-2xl border bg-muted", children: /* @__PURE__ */ jsx6(Icon, { className: "size-6 text-foreground" }) }),
+    /* @__PURE__ */ jsx6("p", { className: "text-center font-medium text-base text-foreground", children: title }),
+    description && /* @__PURE__ */ jsxs6("p", { className: "max-w-sm text-balance text-center text-muted-foreground text-sm", children: [
+      description,
+      " ",
+      learnMore && /* @__PURE__ */ jsxs6(
+        Link,
+        {
+          href: learnMore,
+          className: "text-foreground underline underline-offset-2 transition-colors hover:text-primary",
+          children: [
+            learnMoreText ?? t("ui.common.learnMore"),
+            " \u2197"
+          ]
+        }
+      )
+    ] }),
+    children
+  ] });
+}
+
+// src/components/language-switcher.tsx
+import Image from "next/image";
+import { useRouter } from "next/navigation";
+import { useLocale, useTranslations as useTranslations5 } from "next-intl";
+import { useConfig } from "@pelatform/starter.hook";
+import {
+  LanguageSwitcher as LanguageSwitcherBase
+} from "pelatform-ui/components";
+import { jsx as jsx7 } from "react/jsx-runtime";
+function LanguageSwitcher({
+  className,
+  type,
+  variant,
+  size,
+  showNames,
+  showFlags
+}) {
+  const { i18n } = useConfig();
+  const router = useRouter();
+  const t = useTranslations5();
+  const currentLocale = useLocale();
+  const availableLocales = (() => {
+    if (!i18n.enabled) {
+      return [i18n.defaultLocale];
+    }
+    const availableLocales2 = Object.keys(i18n.locales);
+    return availableLocales2;
+  })();
+  const languages = availableLocales.map((locale) => {
+    const localeConfig = i18n.locales[locale] || null;
+    return {
+      code: locale,
+      name: localeConfig?.name || locale.toUpperCase(),
+      flag: `/flags/${localeConfig?.flag}.svg` || ""
+    };
+  });
+  function handleLanguageChange(newLocale) {
+    if (newLocale === currentLocale) {
+      return;
+    }
+    document.cookie = `${i18n.localeCookieName}=${newLocale}; max-age=${60 * 60 * 24 * 365}; path=/`;
+    router.refresh();
+  }
+  return /* @__PURE__ */ jsx7(
+    LanguageSwitcherBase,
+    {
+      className,
+      type,
+      variant,
+      size,
+      showNames,
+      showFlags,
+      label: t("ui.common.language"),
+      i18nEnabled: i18n.enabled,
+      currentLocale,
+      locales: languages,
+      onLocaleChange: handleLanguageChange,
+      customFlagUrl: true,
+      Image
+    }
+  );
+}
+
+// src/components/logo.tsx
+import Link2 from "next/link";
+import { useConfig as useConfig2 } from "@pelatform/starter.hook";
+import { cn as cn7 } from "pelatform-ui";
+import { Logo } from "pelatform-ui/components";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function LogoWithName({ className }) {
+  const { app } = useConfig2();
+  return /* @__PURE__ */ jsxs7("div", { className: cn7("flex items-center gap-2", className), children: [
+    /* @__PURE__ */ jsx8(Logo, { className: "size-7" }),
+    /* @__PURE__ */ jsx8("span", { className: "font-semibold text-lg text-mono", children: app.name })
+  ] });
+}
+function LogoWithHref({ className, href = "/" }) {
+  const { app } = useConfig2();
+  return /* @__PURE__ */ jsxs7(Link2, { href, className: cn7("flex items-center gap-2", className), children: [
+    /* @__PURE__ */ jsx8(Logo, { className: "size-7" }),
+    /* @__PURE__ */ jsx8("span", { className: "font-semibold text-lg text-mono", children: app.name })
+  ] });
+}
+
+// src/components/otp-input-group.tsx
+import { InputOTPGroup, InputOTPSeparator, InputOTPSlot } from "pelatform-ui/default";
+import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+function OTPInputGroup({ otpSeparators = 0 }) {
+  if (otpSeparators === 0) {
+    return /* @__PURE__ */ jsxs8(InputOTPGroup, { children: [
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 0 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 1 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 2 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 3 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 4 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 5 })
+    ] });
+  }
+  if (otpSeparators === 1) {
+    return /* @__PURE__ */ jsxs8(Fragment2, { children: [
+      /* @__PURE__ */ jsxs8(InputOTPGroup, { children: [
+        /* @__PURE__ */ jsx9(InputOTPSlot, { index: 0 }),
+        /* @__PURE__ */ jsx9(InputOTPSlot, { index: 1 }),
+        /* @__PURE__ */ jsx9(InputOTPSlot, { index: 2 })
+      ] }),
+      /* @__PURE__ */ jsx9(InputOTPSeparator, {}),
+      /* @__PURE__ */ jsxs8(InputOTPGroup, { children: [
+        /* @__PURE__ */ jsx9(InputOTPSlot, { index: 3 }),
+        /* @__PURE__ */ jsx9(InputOTPSlot, { index: 4 }),
+        /* @__PURE__ */ jsx9(InputOTPSlot, { index: 5 })
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs8(Fragment2, { children: [
+    /* @__PURE__ */ jsxs8(InputOTPGroup, { children: [
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 0 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 1 })
+    ] }),
+    /* @__PURE__ */ jsx9(InputOTPSeparator, {}),
+    /* @__PURE__ */ jsxs8(InputOTPGroup, { children: [
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 2 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 3 })
+    ] }),
+    /* @__PURE__ */ jsx9(InputOTPSeparator, {}),
+    /* @__PURE__ */ jsxs8(InputOTPGroup, { children: [
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 4 }),
+      /* @__PURE__ */ jsx9(InputOTPSlot, { index: 5 })
+    ] })
+  ] });
+}
+
+// src/components/password-input.tsx
+import { useState } from "react";
+import { EyeIcon, EyeOffIcon } from "lucide-react";
+import { cn as cn8 } from "pelatform-ui";
+import { Button as Button4, Input as Input2 } from "pelatform-ui/default";
+import { Fragment as Fragment3, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+function PasswordInput({
+  className,
+  variant,
+  enableToggle,
+  onChange,
+  ...props
+}) {
+  const [disabled, setDisabled] = useState(true);
+  const [isVisible, setIsVisible] = useState(false);
+  return /* @__PURE__ */ jsxs9("div", { className: "relative", children: [
+    /* @__PURE__ */ jsx10(
+      Input2,
+      {
+        type: isVisible && enableToggle ? "text" : "password",
+        variant,
+        className: cn8(enableToggle && "pe-10", className),
+        ...props,
+        onChange: (event) => {
+          setDisabled(!event.target.value);
+          onChange?.(event);
+        }
+      }
+    ),
+    enableToggle && /* @__PURE__ */ jsxs9(Fragment3, { children: [
+      /* @__PURE__ */ jsx10(
+        Button4,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "icon",
+          className: "absolute end-0 top-0 bg-transparent!",
+          onClick: () => setIsVisible(!isVisible),
+          disabled,
+          children: isVisible ? /* @__PURE__ */ jsx10(EyeIcon, {}) : /* @__PURE__ */ jsx10(EyeOffIcon, {})
+        }
+      ),
+      /* @__PURE__ */ jsx10("style", { children: `
+            .hide-password-toggle::-ms-reveal,
+            .hide-password-toggle::-ms-clear {
+              visibility: hidden;
+              pointer-events: none;
+              display: none;
+            }
+          ` })
+    ] })
+  ] });
+}
+
+// src/components/signed-in-hint.tsx
+import Link3 from "next/link";
+import { useTranslations as useTranslations6 } from "next-intl";
+import { useSession } from "@pelatform/starter.hook";
+import { Button as Button5 } from "pelatform-ui/default";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+function SignedInHint({ linkHref = "/signin" }) {
+  const t = useTranslations6("ui.common.signed");
+  const { isPending, user } = useSession();
+  return /* @__PURE__ */ jsxs10("div", { className: "fixed start-0 bottom-0 z-40 m-5 flex flex-col gap-2", children: [
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1 text-muted-foreground text-xs", children: [
+      t("text"),
+      " ",
+      isPending || !user ? /* @__PURE__ */ jsx11("span", { className: "h-3 w-32 animate-pulse rounded-md border bg-muted-foreground" }) : /* @__PURE__ */ jsx11("b", { className: "text-foreground", children: user.email })
+    ] }),
+    /* @__PURE__ */ jsx11(Button5, { variant: "mono", className: "h-8 w-fit rounded-lg px-3 text-xs shadow-sm", children: /* @__PURE__ */ jsx11(Link3, { href: linkHref, children: t("button") }) })
+  ] });
+}
+
+// src/components/user-menu.tsx
+import { Fragment as Fragment5, useCallback, useEffect, useState as useState2 } from "react";
+import Link4 from "next/link";
+import { useRouter as useRouter2 } from "next/navigation";
+import { LogOut, PlusCircleIcon, Settings, Shield, UserStar } from "lucide-react";
+import { useTranslations as useTranslations8 } from "next-intl";
+import {
+  useConfig as useConfig3,
+  useListDeviceSessions,
+  useSession as useSession2,
+  useSetActiveSession
+} from "@pelatform/starter.hook";
+import { getUserName as getUserName3 } from "@pelatform/starter.utils";
+import { ModeSwitcher, UserAvatar as UserAvatar2 } from "pelatform-ui/components";
+import {
+  Badge,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+  Skeleton as Skeleton6
+} from "pelatform-ui/default";
+
+// src/components/view.tsx
+import { KeyRoundIcon } from "lucide-react";
+import { useLocale as useLocale2, useTranslations as useTranslations7 } from "next-intl";
+import { getUserName as getUserName2 } from "@pelatform/starter.utils";
+import { cn as cn9 } from "pelatform-ui";
+import { Skeleton as Skeleton5 } from "pelatform-ui/default";
+import { Fragment as Fragment4, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+function UserView({ className, classNames, isPending, size, user }) {
+  const t = useTranslations7();
+  return /* @__PURE__ */ jsxs11("div", { className: cn9("flex items-center gap-2", className, classNames?.base), children: [
+    /* @__PURE__ */ jsx12(
+      UserAvatar,
+      {
+        className: cn9(size !== "sm" && "my-0.5"),
+        classNames: classNames?.avatar,
+        isPending,
+        size,
+        user
+      }
+    ),
+    /* @__PURE__ */ jsx12("div", { className: cn9("grid flex-1 text-start leading-tight", classNames?.content), children: isPending ? /* @__PURE__ */ jsxs11(Fragment4, { children: [
+      /* @__PURE__ */ jsx12(
+        Skeleton5,
+        {
+          className: cn9(
+            "max-w-full",
+            size === "lg" ? "h-4.5 w-32" : "h-3.5 w-24",
+            classNames?.title,
+            classNames?.skeleton
+          )
+        }
+      ),
+      size !== "sm" && /* @__PURE__ */ jsx12(
+        Skeleton5,
+        {
+          className: cn9(
+            "mt-1.5 max-w-full",
+            size === "lg" ? "h-3.5 w-40" : "h-3 w-32",
+            classNames?.subtitle,
+            classNames?.skeleton
+          )
+        }
+      )
+    ] }) : /* @__PURE__ */ jsxs11(Fragment4, { children: [
+      /* @__PURE__ */ jsx12(
+        "span",
+        {
+          className: cn9(
+            "truncate font-semibold",
+            size === "lg" ? "text-base" : "text-sm",
+            classNames?.title
+          ),
+          children: getUserName2(user) || t("ui.navigation.user")
+        }
+      ),
+      !user?.isAnonymous && size !== "sm" && (user?.name || user?.username) && /* @__PURE__ */ jsx12(
+        "span",
+        {
+          className: cn9(
+            "truncate opacity-70",
+            size === "lg" ? "text-sm" : "text-xs",
+            classNames?.subtitle
+          ),
+          children: user?.email
+        }
+      )
+    ] }) })
+  ] });
+}
+function ApiKeyView({ className, classNames, apiKey }) {
+  const t = useTranslations7();
+  const locale = useLocale2();
+  const formatExpiration = () => {
+    if (!apiKey.expiresAt) return t("common.time.neverExpires");
+    const expiresDate = new Date(apiKey.expiresAt);
+    return `${t("common.time.expires")} ${expiresDate.toLocaleDateString(locale ?? "en", {
+      month: "short",
+      day: "numeric",
+      year: "numeric"
+    })}`;
+  };
+  return /* @__PURE__ */ jsxs11("div", { className: cn9("flex items-center gap-3 truncate", className, classNames?.base), children: [
+    /* @__PURE__ */ jsx12(KeyRoundIcon, { className: cn9("size-4 shrink-0", classNames?.icon) }),
+    /* @__PURE__ */ jsxs11("div", { className: "flex flex-col truncate text-start", children: [
+      /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx12("span", { className: "truncate font-semibold text-sm", children: apiKey.name }),
+        /* @__PURE__ */ jsxs11("span", { className: "flex-1 truncate text-muted-foreground text-sm", children: [
+          apiKey.start,
+          "******"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx12("div", { className: "truncate text-muted-foreground text-xs", children: formatExpiration() })
+    ] })
+  ] });
+}
+function WorkspaceView({ className, classNames, isPending, size, workspace }) {
+  const t = useTranslations7();
+  return /* @__PURE__ */ jsxs11("div", { className: cn9("flex items-center gap-2 truncate", className, classNames?.base), children: [
+    /* @__PURE__ */ jsx12(
+      WorkspaceLogo,
+      {
+        className: cn9(size !== "sm" && "my-0.5"),
+        classNames: classNames?.avatar,
+        isPending,
+        workspace,
+        size
+      }
+    ),
+    /* @__PURE__ */ jsx12("div", { className: cn9("flex flex-col truncate text-start leading-tight", classNames?.content), children: isPending ? /* @__PURE__ */ jsxs11(Fragment4, { children: [
+      /* @__PURE__ */ jsx12(
+        Skeleton5,
+        {
+          className: cn9(
+            "max-w-full",
+            size === "lg" ? "h-4.5 w-32" : "h-3.5 w-24",
+            classNames?.title,
+            classNames?.skeleton
+          )
+        }
+      ),
+      size !== "sm" && /* @__PURE__ */ jsx12(
+        Skeleton5,
+        {
+          className: cn9(
+            "mt-1.5 max-w-full",
+            size === "lg" ? "h-3.5 w-24" : "h-3 w-16",
+            classNames?.subtitle,
+            classNames?.skeleton
+          )
+        }
+      )
+    ] }) : /* @__PURE__ */ jsxs11(Fragment4, { children: [
+      /* @__PURE__ */ jsx12(
+        "span",
+        {
+          className: cn9(
+            "truncate font-semibold",
+            size === "lg" ? "text-base" : "text-sm",
+            classNames?.title
+          ),
+          children: workspace?.name || t("ui.navigation.workspace")
+        }
+      ),
+      size !== "sm" && workspace?.slug && /* @__PURE__ */ jsx12(
+        "span",
+        {
+          className: cn9(
+            "truncate opacity-70",
+            size === "lg" ? "text-sm" : "text-xs",
+            classNames?.subtitle
+          ),
+          children: workspace.slug
+        }
+      )
+    ] }) })
+  ] });
+}
+
+// src/components/user-menu.tsx
+import { Fragment as Fragment6, jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+function UserMenu({ hiddenSwitcher = false }) {
+  const { features, path } = useConfig3();
+  const router = useRouter2();
+  const t = useTranslations8();
+  const { isPending: sessionPending, user } = useSession2();
+  const { setActiveSessionAsync } = useSetActiveSession();
+  const { data: deviceSessions, isPending: deviceSessionsPending } = useListDeviceSessions({
+    enabled: features.multiSession
+  });
+  const [activeSessionPending, setActiveSessionPending] = useState2(false);
+  const isPending = sessionPending || activeSessionPending;
+  const switchAccount = useCallback(
+    async (sessionToken) => {
+      setActiveSessionPending(true);
+      try {
+        await setActiveSessionAsync({ sessionToken });
+        router.refresh();
+        setActiveSessionPending(false);
+      } catch (error) {
+        console.error("Error switching account:", error);
+        setActiveSessionPending(false);
+      }
+    },
+    [router, setActiveSessionAsync]
+  );
+  useEffect(() => {
+    if (!features.multiSession) return;
+    setActiveSessionPending(false);
+  }, [features.multiSession, user?.id]);
+  const userEmail = user?.email || "user@example.com";
+  const userName = getUserName3(user);
+  const userAvatar = user?.image || void 0;
+  const userRole = user?.role || "user";
+  return /* @__PURE__ */ jsxs12(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx13(DropdownMenuTrigger, { className: "focus:outline-none focus:ring-0", children: isPending ? /* @__PURE__ */ jsx13(Skeleton6, { className: "size-8 shrink-0 rounded-full" }) : /* @__PURE__ */ jsx13(UserAvatar2, { className: "size-8", indicator: true, src: userAvatar, alt: userName }) }),
+    /* @__PURE__ */ jsxs12(DropdownMenuContent, { className: "w-56", side: "bottom", align: "end", sideOffset: 11, children: [
+      /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-3 px-3 py-2", children: [
+        /* @__PURE__ */ jsx13(UserAvatar2, { src: userAvatar, alt: userName }),
+        /* @__PURE__ */ jsxs12("div", { className: "flex min-w-0 flex-1 flex-col items-start", children: [
+          /* @__PURE__ */ jsx13("span", { className: "truncate font-semibold text-foreground text-sm", children: userName }),
+          /* @__PURE__ */ jsx13("span", { className: "block w-full truncate text-muted-foreground text-xs", children: userEmail }),
+          /* @__PURE__ */ jsx13(Badge, { variant: "success", appearance: "outline", size: "sm", className: "mt-1", children: userRole.toUpperCase() })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx13(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsx13(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs12(Link4, { href: path.account.SETTINGS, children: [
+        /* @__PURE__ */ jsx13(Settings, {}),
+        /* @__PURE__ */ jsx13("span", { children: t("ui.navigation.preferences") })
+      ] }) }),
+      /* @__PURE__ */ jsx13(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs12(Link4, { href: path.account.SECURITY, children: [
+        /* @__PURE__ */ jsx13(Shield, {}),
+        /* @__PURE__ */ jsx13("span", { children: t("ui.navigation.security") })
+      ] }) }),
+      "admin" === userRole && /* @__PURE__ */ jsx13(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs12(Link4, { href: path.admin.OVERVIEW, children: [
+        /* @__PURE__ */ jsx13(UserStar, {}),
+        /* @__PURE__ */ jsx13("span", { children: "Admin Dashboard" })
+      ] }) }),
+      !hiddenSwitcher && /* @__PURE__ */ jsxs12(Fragment6, { children: [
+        /* @__PURE__ */ jsx13(DropdownMenuSeparator, {}),
+        /* @__PURE__ */ jsx13(
+          ModeSwitcher,
+          {
+            type: "sub-dropdown",
+            label: {
+              system: t("ui.common.system"),
+              dark: t("ui.common.dark"),
+              light: t("ui.common.light")
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx13(LanguageSwitcher, { type: "sub-dropdown" })
+      ] }),
+      /* @__PURE__ */ jsx13(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsx13(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs12(Link4, { href: path.auth.SIGN_OUT, children: [
+        /* @__PURE__ */ jsx13(LogOut, {}),
+        /* @__PURE__ */ jsx13("span", { children: t("ui.navigation.signOut") })
+      ] }) }),
+      user && features.multiSession && /* @__PURE__ */ jsxs12(Fragment6, { children: [
+        /* @__PURE__ */ jsx13(DropdownMenuSeparator, {}),
+        !deviceSessions && deviceSessionsPending && /* @__PURE__ */ jsxs12(Fragment6, { children: [
+          /* @__PURE__ */ jsx13(DropdownMenuItem, { disabled: true, children: /* @__PURE__ */ jsx13(UserView, { isPending: true }) }),
+          /* @__PURE__ */ jsx13(DropdownMenuSeparator, {})
+        ] }),
+        deviceSessions?.filter((sessionData) => sessionData.user.id !== user?.id).map(({ session, user: multiUser }) => /* @__PURE__ */ jsxs12(Fragment5, { children: [
+          /* @__PURE__ */ jsxs12(DropdownMenuItem, { onClick: () => switchAccount(session.token), children: [
+            /* @__PURE__ */ jsx13(UserAvatar2, { src: multiUser?.image || void 0, alt: getUserName3(multiUser) }),
+            /* @__PURE__ */ jsxs12("div", { className: "flex min-w-0 flex-1 flex-col items-start", children: [
+              /* @__PURE__ */ jsx13("span", { className: "truncate font-semibold text-foreground text-xs", children: getUserName3(multiUser) }),
+              /* @__PURE__ */ jsx13("span", { className: "block w-full truncate text-muted-foreground text-xs", children: multiUser?.email })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx13(DropdownMenuSeparator, {})
+        ] }, session.id)),
+        /* @__PURE__ */ jsx13(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs12(Link4, { href: path.auth.SIGN_IN, children: [
+          /* @__PURE__ */ jsx13(PlusCircleIcon, {}),
+          t("common.actions.addAccount")
+        ] }) })
+      ] })
+    ] })
+  ] });
+}
+export {
+  ApiKeyView,
+  CardActionComponent,
+  CardComponent,
+  CardFooterComponent,
+  CardHeaderComponent,
+  DialogComponent,
+  DialogFooterComponent,
+  DisplayIdCard,
+  EmptyState,
+  LanguageSwitcher,
+  Logo as LogoDefault,
+  LogoWithHref,
+  LogoWithName,
+  OTPInputGroup,
+  PasswordInput,
+  SignedInHint,
+  SkeletonInputComponent,
+  SkeletonViewComponent,
+  UserAvatar,
+  UserMenu,
+  UserView,
+  WorkspaceLogo,
+  WorkspaceView
+};

package/dist/style.css

@@ -0,0 +1 @@
+@source ".";

package/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "@pelatform/starter.shared",
+  "version": "0.1.0",
+  "description": "A part of SaaS starter kit for Pelatform applications.",
+  "author": "Pelatform",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "exports": {
+    "./css": "./dist/style.css",
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "clean": "rimraf dist",
+    "clean:all": "rimraf .turbo dist node_modules",
+    "dev": "tsup --watch --onSuccess \"cp src/style.css dist/style.css\"",
+    "build": "tsup && cp src/style.css dist/style.css",
+    "types:check": "tsc --noEmit"
+  },
+  "files": [
+    "dist"
+  ],
+  "keywords": [
+    "pelatform",
+    "starter kit",
+    "components",
+    "utilities"
+  ],
+  "dependencies": {},
+  "devDependencies": {
+    "@pelatform/starter.config": "0.1.0",
+    "@pelatform/starter.hook": "0.1.1",
+    "@pelatform/starter.i18n": "0.1.2",
+    "@pelatform/starter.utils": "0.1.1",
+    "@pelatform/tsconfig": "^0.1.3",
+    "@types/react": "^19.2.7",
+    "lucide-react": "^0.556.0",
+    "next": "^16.0.7",
+    "next-intl": "^4.5.8",
+    "pelatform-ui": "^1.1.3",
+    "react": "^19.2.1",
+    "react-hook-form": "^7.68.0",
+    "tsup": "^8.5.1"
+  },
+  "peerDependencies": {
+    "@pelatform/starter.config": ">=0.1.0",
+    "@pelatform/starter.hook": ">=0.1.0",
+    "@pelatform/starter.i18n": ">=0.1.0",
+    "@pelatform/starter.utils": ">=0.1.0",
+    "lucide-react": ">=0.55.0",
+    "next": ">=16.0.0",
+    "next-intl": ">=4.5.0",
+    "pelatform-ui": ">=1.1.0",
+    "react": ">=18.0.0 || >=19.0.0-rc.0",
+    "react-hook-form": ">=7.5.0"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx,cjs,mjs,cts,mts}": "biome check --write --no-errors-on-unmatched",
+    "*.{md,yml,yaml}": "prettier --write",
+    "*.{json,jsonc,html}": "biome format --write --no-errors-on-unmatched"
+  }
+}