@alepha/ui 0.17.2 → 0.18.0

package/dist/demo/DemoResetPassword-DWh4_BpQ.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DemoResetPassword-DWh4_BpQ.js","names":["Text"],"sources":["../../src/auth/components/ResetPassword.tsx","../../src/demo/components/auth/DemoResetPassword.tsx"],"sourcesContent":["import { ActionButton, Control } from \"@alepha/ui\";\nimport { Alert, Card, Flex, Image, PinInput, Text, Title } from \"@mantine/core\";\nimport {\n  IconAlertCircle,\n  IconCheck,\n  IconInfoCircle,\n  IconLock,\n  IconMail,\n} from \"@tabler/icons-react\";\nimport { AlephaError, t } from \"alepha\";\nimport type {\n  PasswordResetIntentResponse,\n  RealmConfig,\n  UserController,\n} from \"alepha/api/users\";\nimport { resetPasswordRequestSchema } from \"alepha/api/users\";\nimport { useClient } from \"alepha/react\";\nimport { useForm } from \"alepha/react/form\";\nimport { useI18n } from \"alepha/react/i18n\";\nimport { useRouter } from \"alepha/react/router\";\nimport { useState } from \"react\";\nimport type { AuthI18n } from \"../AuthI18n.ts\";\nimport type { AuthRouter } from \"../AuthRouter.ts\";\n\nexport interface ResetPasswordProps {\n  realmConfig: RealmConfig;\n}\n\ntype Step = \"email\" | \"code\" | \"password\" | \"success\";\n\ninterface ResetState {\n  step: Step;\n  intent?: PasswordResetIntentResponse;\n  email?: string;\n  code?: string;\n}\n\nconst ResetPassword = (props: ResetPasswordProps) => {\n  const router = useRouter<AuthRouter>();\n  const userCtrl = useClient<UserController>();\n  const { tr } = useI18n<AuthI18n, \"en\">();\n  const [resetState, setResetState] = useState<ResetState>({ step: \"email\" });\n  const [error, setError] = useState<string | null>(null);\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const redirect = router.query.r || \"/\";\n\n  const settings = props.realmConfig.settings;\n  const isResetPasswordAllowed = settings?.resetPasswordAllowed !== false;\n\n  // Phase 1: Request password reset intent\n  const emailForm = useForm({\n    schema: resetPasswordRequestSchema,\n    handler: async (data) => {\n      setError(null);\n      const intent = await userCtrl.createPasswordResetIntent({\n        query: { userRealmName: props.realmConfig.realmName },\n        body: { email: data.email },\n      });\n\n      setResetState({\n        step: \"code\",\n        intent,\n        email: data.email,\n      });\n    },\n  });\n\n  // Phase 2: Complete password reset\n  const passwordForm = useForm(\n    {\n      schema: t.object({\n        password: t.string({ minLength: 8 }),\n        confirmPassword: t.string({ minLength: 8 }),\n      }),\n      handler: async (data) => {\n        if (data.password !== data.confirmPassword) {\n          throw new AlephaError(\"Passwords do not match\");\n        }\n\n        if (!resetState.intent || !resetState.code) {\n          throw new AlephaError(\"Invalid reset state\");\n        }\n\n        await userCtrl.completePasswordReset({\n          body: {\n            intentId: resetState.intent.intentId,\n            code: resetState.code,\n            newPassword: data.password,\n          },\n        });\n\n        setResetState({ step: \"success\" });\n      },\n    },\n    [resetState.intent, resetState.code],\n  );\n\n  const handleCodeComplete = (value: string) => {\n    if (value.length === 6) {\n      setResetState((prev) => ({\n        ...prev,\n        step: \"password\",\n        code: value,\n      }));\n    }\n  };\n\n  const handleResendCode = async () => {\n    if (!resetState.email) return;\n\n    setIsSubmitting(true);\n    setError(null);\n\n    try {\n      const intent = await userCtrl.createPasswordResetIntent({\n        query: { userRealmName: props.realmConfig.realmName },\n        body: { email: resetState.email },\n      });\n\n      setResetState((prev) => ({\n        ...prev,\n        intent,\n      }));\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Failed to resend code\");\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  return (\n    <Flex flex={1} justify={\"center\"} align={\"center\"}>\n      <Flex direction=\"column\" gap={\"sm\"} w={360}>\n        <Card withBorder p={\"lg\"} bg={\"var(--alepha-elevated)\"}>\n          <Flex direction=\"column\" gap={\"md\"}>\n            {/* Realm branding */}\n            {(settings.logoUrl ||\n              settings.displayName ||\n              settings.description) && (\n              <Flex direction=\"column\" gap={\"xs\"} align=\"center\" mb=\"xs\">\n                {settings.logoUrl && (\n                  <Image\n                    src={settings.logoUrl}\n                    alt={settings.displayName || props.realmConfig.realmName}\n                    h={48}\n                    w=\"auto\"\n                    fit=\"contain\"\n                  />\n                )}\n                {settings.displayName && (\n                  <Title order={4} ta=\"center\">\n                    {settings.displayName}\n                  </Title>\n                )}\n                {settings.description && (\n                  <Text size=\"sm\" c=\"dimmed\" ta=\"center\">\n                    {settings.description}\n                  </Text>\n                )}\n              </Flex>\n            )}\n\n            {error && (\n              <Alert variant=\"light\" color=\"red\" icon={<IconAlertCircle />}>\n                <Text size=\"sm\">{error}</Text>\n              </Alert>\n            )}\n\n            {!isResetPasswordAllowed ? (\n              <>\n                <Alert\n                  variant=\"light\"\n                  color=\"yellow\"\n                  icon={<IconAlertCircle />}\n                >\n                  <Text size=\"sm\">{tr(\"resetPasswordDisabled\")}</Text>\n                </Alert>\n                <ActionButton\n                  href={router.path(\"login\", {\n                    query: { realm: props.realmConfig.realmName },\n                  })}\n                >\n                  {tr(\"resetPasswordBackToSignIn\")}\n                </ActionButton>\n              </>\n            ) : resetState.step === \"email\" ? (\n              <form {...emailForm.props}>\n                <Flex direction=\"column\" flex={1} gap={\"md\"}>\n                  <Text size=\"lg\" fw={500} ta=\"center\">\n                    {tr(\"resetPasswordTitle\")}\n                  </Text>\n                  <Text size=\"sm\" c=\"dimmed\">\n                    {tr(\"resetPasswordEnterEmail\")}\n                  </Text>\n                  <Control\n                    title={tr(\"resetPasswordEmail\")}\n                    input={emailForm.input.email}\n                    icon={<IconMail />}\n                    text={{\n                      autoComplete: \"email\",\n                      autoFocus: true,\n                      disabled: !isResetPasswordAllowed,\n                    }}\n                  />\n                  <ActionButton\n                    form={emailForm}\n                    disabled={!isResetPasswordAllowed}\n                  >\n                    {tr(\"resetPasswordSendCode\")}\n                  </ActionButton>\n                </Flex>\n              </form>\n            ) : resetState.step === \"code\" ? (\n              <Flex direction=\"column\" gap={\"md\"}>\n                <Text size=\"lg\" fw={500} ta=\"center\">\n                  {tr(\"resetPasswordTitle\")}\n                </Text>\n                <Alert variant=\"light\" color=\"blue\" icon={<IconInfoCircle />}>\n                  <Text size=\"sm\">{tr(\"resetPasswordCodeSent\")}</Text>\n                </Alert>\n                <Text size=\"sm\" c=\"dimmed\" ta=\"center\">\n                  {tr(\"resetPasswordEnterCode\")}\n                </Text>\n                <Flex justify=\"center\">\n                  <PinInput\n                    length={6}\n                    type=\"number\"\n                    autoFocus\n                    oneTimeCode\n                    onComplete={handleCodeComplete}\n                    aria-label=\"Password reset verification code\"\n                  />\n                </Flex>\n                <ActionButton\n                  variant=\"subtle\"\n                  onClick={handleResendCode}\n                  loading={isSubmitting}\n                >\n                  {tr(\"resetPasswordResendCode\")}\n                </ActionButton>\n              </Flex>\n            ) : resetState.step === \"password\" ? (\n              <form {...passwordForm.props}>\n                <Flex direction=\"column\" flex={1} gap={\"md\"}>\n                  <Text size=\"lg\" fw={500} ta=\"center\">\n                    {tr(\"resetPasswordTitle\")}\n                  </Text>\n                  <Text size=\"sm\" c=\"dimmed\">\n                    {tr(\"resetPasswordEnterNewPassword\")}\n                  </Text>\n                  <Control\n                    title={tr(\"resetPasswordNewPassword\")}\n                    input={passwordForm.input.password}\n                    icon={<IconLock />}\n                    password={{\n                      autoComplete: \"new-password\",\n                      autoFocus: true,\n                    }}\n                  />\n                  <Control\n                    title={tr(\"resetPasswordConfirmPassword\")}\n                    input={passwordForm.input.confirmPassword}\n                    icon={<IconLock />}\n                    password={{\n                      autoComplete: \"new-password\",\n                    }}\n                  />\n                  <ActionButton form={passwordForm}>\n                    {tr(\"resetPasswordSetNewPassword\")}\n                  </ActionButton>\n                </Flex>\n              </form>\n            ) : (\n              <>\n                <Alert variant=\"light\" color=\"green\" icon={<IconCheck />}>\n                  <Text size=\"sm\">{tr(\"resetPasswordSuccess\")}</Text>\n                </Alert>\n                <ActionButton\n                  href={router.path(\"login\", {\n                    query: { realm: props.realmConfig.realmName },\n                  })}\n                >\n                  {tr(\"resetPasswordBackToSignIn\")}\n                </ActionButton>\n              </>\n            )}\n          </Flex>\n        </Card>\n        <ActionButton variant={\"subtle\"} href={redirect}>\n          {tr(\"resetPasswordCancel\")}\n        </ActionButton>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default ResetPassword;\n","import { t } from \"alepha\";\nimport type { RealmConfig } from \"alepha/api/users\";\nimport ResetPassword from \"../../../auth/components/ResetPassword.tsx\";\nimport Showcase from \"../shared/Showcase.tsx\";\n\nconst showcaseSchema = t.object({\n  resetPasswordAllowed: t.boolean({\n    title: \"Reset Allowed\",\n    default: true,\n    $control: { switch: true },\n  }),\n  showBranding: t.boolean({\n    title: \"Show Branding\",\n    default: true,\n    $control: { switch: true },\n  }),\n});\n\nconst buildRealmConfig = (props: {\n  resetPasswordAllowed: boolean;\n  showBranding: boolean;\n}): RealmConfig => {\n  return {\n    realmName: \"demo\",\n    authenticationMethods: [{ name: \"credentials\", type: \"CREDENTIALS\" }],\n    settings: {\n      displayName: props.showBranding ? \"Demo App\" : undefined,\n      description: props.showBranding ? \"Reset your password\" : undefined,\n      logoUrl: undefined,\n      registrationAllowed: true,\n      emailEnabled: true,\n      emailRequired: true,\n      usernameEnabled: false,\n      usernameRequired: false,\n      usernameRegExp: \"^[a-zA-Z0-9_]{3,30}$\",\n      phoneEnabled: false,\n      phoneRequired: false,\n      verifyEmailRequired: false,\n      verifyPhoneRequired: false,\n      firstNameLastNameEnabled: false,\n      firstNameLastNameRequired: false,\n      resetPasswordAllowed: props.resetPasswordAllowed,\n      adminEmails: [],\n      adminUsernames: [],\n      passwordPolicy: {\n        minLength: 8,\n        requireUppercase: true,\n        requireLowercase: true,\n        requireNumbers: true,\n        requireSpecialCharacters: false,\n      },\n    },\n  };\n};\n\nconst DemoResetPassword = () => {\n  return (\n    <Showcase\n      title=\"ResetPassword\"\n      schema={showcaseSchema}\n      initialValues={{\n        resetPasswordAllowed: true,\n        showBranding: true,\n      }}\n      columns={1}\n    >\n      {(props) => <ResetPassword realmConfig={buildRealmConfig(props)} />}\n    </Showcase>\n  );\n};\n\nexport default DemoResetPassword;\n"],"mappings":"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"}

package/dist/demo/DemoSidebar-C1csnGhX.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DemoSidebar-C1csnGhX.js","names":[],"sources":["../../src/demo/components/core/DemoSidebar.tsx"],"sourcesContent":["import { Sidebar, type SidebarNode } from \"@alepha/ui\";\nimport { Flex } from \"@mantine/core\";\nimport {\n  IconDashboard,\n  IconFiles,\n  IconSettings,\n  IconUsers,\n} from \"@tabler/icons-react\";\nimport { t } from \"alepha\";\nimport Showcase from \"../shared/Showcase.tsx\";\n\nconst sidebarItems = [\n  { type: \"search\" },\n  { type: \"divider\" },\n  {\n    icon: IconDashboard,\n    label: \"Dashboard\",\n  },\n  {\n    icon: IconUsers,\n    label: \"Users\",\n    children: [\n      { label: \"All Users\" },\n      { label: \"Add User\" },\n      { label: \"Roles\" },\n    ],\n  },\n  {\n    icon: IconFiles,\n    label: \"Files\",\n  },\n  { type: \"spacer\" },\n  {\n    position: \"bottom\",\n    icon: IconSettings,\n    label: \"Settings\",\n  },\n] satisfies SidebarNode[];\n\nconst showcaseSchema = t.object({\n  collapsed: t.boolean({\n    title: \"Collapsed\",\n    default: false,\n    $control: { switch: true },\n  }),\n  gap: t.enum([\"xs\", \"sm\", \"md\", \"lg\"], {\n    title: \"Gap\",\n    default: \"xs\",\n    $control: { segmented: true },\n  }),\n});\n\nconst DemoSidebar = () => {\n  return (\n    <Showcase\n      title=\"Sidebar\"\n      schema={showcaseSchema}\n      initialValues={{\n        collapsed: false,\n        gap: \"xs\",\n      }}\n      columns={1}\n      windowProps={{\n        fill: true,\n        containerProps: { p: 0 },\n      }}\n    >\n      {(props) => (\n        <Flex\n          h={\"100%\"}\n          w={props.collapsed ? 60 : 240}\n          bg=\"var(--alepha-surface)\"\n        >\n          <Sidebar\n            items={sidebarItems}\n            collapsed={props.collapsed}\n            gap={props.gap}\n          />\n        </Flex>\n      )}\n    </Showcase>\n  );\n};\n\nexport default DemoSidebar;\n"],"mappings":";;;;;;;;AAWA,MAAM,eAAe;CACnB,EAAE,MAAM,UAAU;CAClB,EAAE,MAAM,WAAW;CACnB;EACE,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,UAAU;GACR,EAAE,OAAO,aAAa;GACtB,EAAE,OAAO,YAAY;GACrB,EAAE,OAAO,SAAS;GACnB;EACF;CACD;EACE,MAAM;EACN,OAAO;EACR;CACD,EAAE,MAAM,UAAU;CAClB;EACE,UAAU;EACV,MAAM;EACN,OAAO;EACR;CACF;AAED,MAAM,iBAAiB,EAAE,OAAO;CAC9B,WAAW,EAAE,QAAQ;EACnB,OAAO;EACP,SAAS;EACT,UAAU,EAAE,QAAQ,MAAM;EAC3B,CAAC;CACF,KAAK,EAAE,KAAK;EAAC;EAAM;EAAM;EAAM;EAAK,EAAE;EACpC,OAAO;EACP,SAAS;EACT,UAAU,EAAE,WAAW,MAAM;EAC9B,CAAC;CACH,CAAC;AAEF,MAAM,oBAAoB;AACxB,QACE,oBAAC;EACC,OAAM;EACN,QAAQ;EACR,eAAe;GACb,WAAW;GACX,KAAK;GACN;EACD,SAAS;EACT,aAAa;GACX,MAAM;GACN,gBAAgB,EAAE,GAAG,GAAG;GACzB;aAEC,UACA,oBAAC;GACC,GAAG;GACH,GAAG,MAAM,YAAY,KAAK;GAC1B,IAAG;aAEH,oBAAC;IACC,OAAO;IACP,WAAW,MAAM;IACjB,KAAK,MAAM;KACX;IACG;GAEA"}

package/dist/demo/DemoVerifyEmail-DbU_tCj8.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DemoVerifyEmail-DbU_tCj8.js","names":["Text"],"sources":["../../src/auth/components/VerifyEmail.tsx","../../src/demo/components/auth/DemoVerifyEmail.tsx"],"sourcesContent":["import { ActionButton } from \"@alepha/ui\";\nimport { Alert, Card, Flex, Loader, Text } from \"@mantine/core\";\nimport { IconAlertCircle, IconCheck, IconMailCheck } from \"@tabler/icons-react\";\nimport type { UserController } from \"alepha/api/users\";\nimport { useClient } from \"alepha/react\";\nimport { useI18n } from \"alepha/react/i18n\";\nimport { useRouter, useRouterState } from \"alepha/react/router\";\nimport { useEffect, useState } from \"react\";\nimport type { AuthI18n } from \"../AuthI18n.ts\";\nimport type { AuthRouter } from \"../AuthRouter.ts\";\n\nexport type VerifyEmailProps = {};\n\ntype Step = \"verifying\" | \"success\" | \"error\";\n\nconst VerifyEmail = (_props: VerifyEmailProps) => {\n  const router = useRouter<AuthRouter>();\n  const state = useRouterState();\n  const userCtrl = useClient<UserController>();\n  const { tr } = useI18n<AuthI18n, \"en\">();\n\n  const [step, setStep] = useState<Step>(\"verifying\");\n  const [error, setError] = useState<string | null>(null);\n\n  const email = state.query.email as string | undefined;\n  const token = state.query.token as string | undefined;\n\n  useEffect(() => {\n    const verify = async () => {\n      if (!email || !token) {\n        setError(tr(\"verifyEmailMissingParams\"));\n        setStep(\"error\");\n        return;\n      }\n\n      try {\n        await userCtrl.verifyEmail({\n          body: { email, token },\n        });\n        setStep(\"success\");\n      } catch (err) {\n        setError(err instanceof Error ? err.message : tr(\"verifyEmailFailed\"));\n        setStep(\"error\");\n      }\n    };\n\n    verify();\n  }, [email, token]);\n\n  return (\n    <Flex flex={1} justify=\"center\" align=\"center\">\n      <Flex direction=\"column\" gap=\"sm\" w={400}>\n        <Card withBorder p=\"lg\" bg=\"var(--alepha-elevated)\">\n          <Flex direction=\"column\" gap=\"md\" align=\"center\">\n            {step === \"verifying\" && (\n              <>\n                <Loader size=\"lg\" />\n                <Text size=\"lg\" fw={500} ta=\"center\">\n                  {tr(\"verifyEmailVerifying\")}\n                </Text>\n                <Text size=\"sm\" c=\"dimmed\" ta=\"center\">\n                  {tr(\"verifyEmailPleaseWait\")}\n                </Text>\n              </>\n            )}\n\n            {step === \"success\" && (\n              <>\n                <IconMailCheck size={48} color=\"var(--mantine-color-green-6)\" />\n                <Text size=\"lg\" fw={500} ta=\"center\">\n                  {tr(\"verifyEmailTitle\")}\n                </Text>\n                <Alert variant=\"light\" color=\"green\" icon={<IconCheck />}>\n                  <Text size=\"sm\">{tr(\"verifyEmailSuccess\")}</Text>\n                </Alert>\n                <ActionButton href={router.path(\"login\")} fullWidth>\n                  {tr(\"verifyEmailSignIn\")}\n                </ActionButton>\n              </>\n            )}\n\n            {step === \"error\" && (\n              <>\n                <IconAlertCircle size={48} color=\"var(--mantine-color-red-6)\" />\n                <Text size=\"lg\" fw={500} ta=\"center\">\n                  {tr(\"verifyEmailTitle\")}\n                </Text>\n                <Alert variant=\"light\" color=\"red\" icon={<IconAlertCircle />}>\n                  <Text size=\"sm\">{error || tr(\"verifyEmailFailed\")}</Text>\n                </Alert>\n                <ActionButton href={router.path(\"login\")} fullWidth>\n                  {tr(\"verifyEmailBackToSignIn\")}\n                </ActionButton>\n              </>\n            )}\n          </Flex>\n        </Card>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default VerifyEmail;\n","import { t } from \"alepha\";\nimport VerifyEmail from \"../../../auth/components/VerifyEmail.tsx\";\nimport Showcase from \"../shared/Showcase.tsx\";\n\nconst showcaseSchema = t.object({\n  placeholder: t.boolean({\n    title: \"Demo Mode\",\n    default: true,\n    $control: { switch: true },\n  }),\n});\n\nconst DemoVerifyEmail = () => {\n  return (\n    <Showcase\n      title=\"VerifyEmail\"\n      schema={showcaseSchema}\n      initialValues={{\n        placeholder: true,\n      }}\n      columns={1}\n    >\n      {() => <VerifyEmail />}\n    </Showcase>\n  );\n};\n\nexport default DemoVerifyEmail;\n"],"mappings":";;;;;;;;;;;;AAeA,MAAM,eAAe,WAA6B;CAChD,MAAM,SAAS,WAAuB;CACtC,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,WAAW,WAA2B;CAC5C,MAAM,EAAE,OAAO,SAAyB;CAExC,MAAM,CAAC,MAAM,WAAW,SAAe,YAAY;CACnD,MAAM,CAAC,OAAO,YAAY,SAAwB,KAAK;CAEvD,MAAM,QAAQ,MAAM,MAAM;CAC1B,MAAM,QAAQ,MAAM,MAAM;AAE1B,iBAAgB;EACd,MAAM,SAAS,YAAY;AACzB,OAAI,CAAC,SAAS,CAAC,OAAO;AACpB,aAAS,GAAG,2BAA2B,CAAC;AACxC,YAAQ,QAAQ;AAChB;;AAGF,OAAI;AACF,UAAM,SAAS,YAAY,EACzB,MAAM;KAAE;KAAO;KAAO,EACvB,CAAC;AACF,YAAQ,UAAU;YACX,KAAK;AACZ,aAAS,eAAe,QAAQ,IAAI,UAAU,GAAG,oBAAoB,CAAC;AACtE,YAAQ,QAAQ;;;AAIpB,UAAQ;IACP,CAAC,OAAO,MAAM,CAAC;AAElB,QACE,oBAAC;EAAK,MAAM;EAAG,SAAQ;EAAS,OAAM;YACpC,oBAAC;GAAK,WAAU;GAAS,KAAI;GAAK,GAAG;aACnC,oBAAC;IAAK;IAAW,GAAE;IAAK,IAAG;cACzB,qBAAC;KAAK,WAAU;KAAS,KAAI;KAAK,OAAM;;MACrC,SAAS,eACR;OACE,oBAAC,UAAO,MAAK,OAAO;OACpB,oBAACA;QAAK,MAAK;QAAK,IAAI;QAAK,IAAG;kBACzB,GAAG,uBAAuB;SACtB;OACP,oBAACA;QAAK,MAAK;QAAK,GAAE;QAAS,IAAG;kBAC3B,GAAG,wBAAwB;SACvB;UACN;MAGJ,SAAS,aACR;OACE,oBAAC;QAAc,MAAM;QAAI,OAAM;SAAiC;OAChE,oBAACA;QAAK,MAAK;QAAK,IAAI;QAAK,IAAG;kBACzB,GAAG,mBAAmB;SAClB;OACP,oBAAC;QAAM,SAAQ;QAAQ,OAAM;QAAQ,MAAM,oBAAC,cAAY;kBACtD,oBAACA;SAAK,MAAK;mBAAM,GAAG,qBAAqB;UAAQ;SAC3C;OACR,oBAAC;QAAa,MAAM,OAAO,KAAK,QAAQ;QAAE;kBACvC,GAAG,oBAAoB;SACX;UACd;MAGJ,SAAS,WACR;OACE,oBAAC;QAAgB,MAAM;QAAI,OAAM;SAA+B;OAChE,oBAACA;QAAK,MAAK;QAAK,IAAI;QAAK,IAAG;kBACzB,GAAG,mBAAmB;SAClB;OACP,oBAAC;QAAM,SAAQ;QAAQ,OAAM;QAAM,MAAM,oBAAC,oBAAkB;kBAC1D,oBAACA;SAAK,MAAK;mBAAM,SAAS,GAAG,oBAAoB;UAAQ;SACnD;OACR,oBAAC;QAAa,MAAM,OAAO,KAAK,QAAQ;QAAE;kBACvC,GAAG,0BAA0B;SACjB;UACd;;MAEA;KACF;IACF;GACF;;;;;AC9FX,MAAM,iBAAiB,EAAE,OAAO,EAC9B,aAAa,EAAE,QAAQ;CACrB,OAAO;CACP,SAAS;CACT,UAAU,EAAE,QAAQ,MAAM;CAC3B,CAAC,EACH,CAAC;AAEF,MAAM,wBAAwB;AAC5B,QACE,oBAAC;EACC,OAAM;EACN,QAAQ;EACR,eAAe,EACb,aAAa,MACd;EACD,SAAS;kBAEF,oBAAC,gBAAc;GACb"}

package/dist/demo/Showcase-BzoXNlCn.js

@@ -1,185 +0,0 @@
-import { TypeForm, ui } from "@alepha/ui";
-import { Card, Flex, SegmentedControl, Text as Text$1 } from "@mantine/core";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useForm } from "alepha/react/form";
-import { useState } from "react";
-
-//#region ../../src/demo/components/shared/MacWindow.tsx
-const MacWindow = ({ children, title, containerProps, fill }) => {
-	const [size, setSize] = useState("100");
-	const getWidth = () => {
-		return `${size}%`;
-	};
-	return /* @__PURE__ */ jsxs(Flex, {
-		direction: "column",
-		flex: fill ? 1 : void 0,
-		h: fill ? "100%" : void 0,
-		bdrs: "md",
-		style: {
-			width: getWidth(),
-			border: "1px solid var(--mantine-color-default-border)",
-			overflow: "hidden",
-			background: "var(--mantine-color-body)",
-			boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
-			transition: "width 0.3s ease"
-		},
-		children: [/* @__PURE__ */ jsxs(Flex, {
-			h: 36,
-			px: "sm",
-			align: "center",
-			gap: 8,
-			style: {
-				background: "var(--mantine-color-default)",
-				borderBottom: "1px solid var(--mantine-color-default-border)"
-			},
-			children: [
-				/* @__PURE__ */ jsxs(Flex, {
-					gap: 6,
-					children: [
-						/* @__PURE__ */ jsx(Flex, {
-							w: 12,
-							h: 12,
-							style: {
-								borderRadius: "50%",
-								background: "#ff5f57"
-							}
-						}),
-						/* @__PURE__ */ jsx(Flex, {
-							w: 12,
-							h: 12,
-							style: {
-								borderRadius: "50%",
-								background: "#febc2e"
-							}
-						}),
-						/* @__PURE__ */ jsx(Flex, {
-							w: 12,
-							h: 12,
-							style: {
-								borderRadius: "50%",
-								background: "#28c840"
-							}
-						})
-					]
-				}),
-				/* @__PURE__ */ jsx(Flex, {
-					style: {
-						flex: 1,
-						textAlign: "center",
-						fontSize: 13,
-						color: "var(--mantine-color-dimmed)"
-					},
-					children: title
-				}),
-				fill ? void 0 : /* @__PURE__ */ jsx(SegmentedControl, {
-					size: "xs",
-					value: size,
-					onChange: (v) => setSize(v),
-					data: [
-						{
-							label: "25",
-							value: "25"
-						},
-						{
-							label: "50",
-							value: "50"
-						},
-						{
-							label: "75",
-							value: "75"
-						},
-						{
-							label: "100",
-							value: "100"
-						}
-					]
-				})
-			]
-		}), /* @__PURE__ */ jsx(Flex, {
-			direction: "column",
-			flex: fill ? 1 : void 0,
-			p: "md",
-			...containerProps,
-			children
-		})]
-	});
-};
-
-//#endregion
-//#region ../../src/demo/components/shared/Showcase.tsx
-/**
-* Showcase component for demonstrating UI components with interactive props configuration.
-* Uses TypeForm to render a form based on the props schema and displays the component preview.
-*/
-const Showcase = ({ title, schema, initialValues, columns = 3, children, windowProps }) => {
-	const [values, setValues] = useState(initialValues ?? {});
-	const form = useForm({
-		schema,
-		initialValues,
-		handler: (values) => {
-			setValues(values);
-		},
-		onChange: (key, value) => {
-			console.log("onChange", key, value);
-			form.submit();
-		}
-	}, [schema]);
-	return /* @__PURE__ */ jsxs(Flex, {
-		flex: 1,
-		h: "100%",
-		children: [/* @__PURE__ */ jsx(Flex, {
-			flex: 1,
-			bg: ui.colors.background,
-			h: "100%",
-			p: "xl",
-			justify: "center",
-			align: "flex-start",
-			style: {
-				flex: 1,
-				minWidth: 0,
-				overflow: "auto"
-			},
-			children: /* @__PURE__ */ jsx(MacWindow, {
-				title,
-				...windowProps,
-				children: children(values)
-			})
-		}), /* @__PURE__ */ jsx(Flex, {
-			bg: ui.colors.surface,
-			h: "100%",
-			p: "md",
-			style: {
-				flex: "0 0 300px",
-				overflow: "auto"
-			},
-			children: /* @__PURE__ */ jsxs(Card, {
-				withBorder: true,
-				shadow: "sm",
-				radius: "md",
-				bg: ui.colors.elevated,
-				children: [/* @__PURE__ */ jsx(Card.Section, {
-					withBorder: true,
-					py: "xs",
-					inheritPadding: true,
-					children: /* @__PURE__ */ jsxs(Text$1, {
-						size: "xs",
-						fw: 500,
-						children: [title, " Props"]
-					})
-				}), /* @__PURE__ */ jsx(Card.Section, {
-					p: "sm",
-					children: /* @__PURE__ */ jsx(TypeForm, {
-						form,
-						columns,
-						skipSubmitButton: true,
-						skipFormElement: true
-					})
-				})]
-			})
-		})]
-	});
-};
-
-//#endregion
-export { Showcase as t };
-//# sourceMappingURL=Showcase-BzoXNlCn.js.map

package/dist/demo/Showcase-BzoXNlCn.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Showcase-BzoXNlCn.js","names":["Text"],"sources":["../../src/demo/components/shared/MacWindow.tsx","../../src/demo/components/shared/Showcase.tsx"],"sourcesContent":["import { Flex, type FlexProps, SegmentedControl } from \"@mantine/core\";\nimport { type ReactNode, useState } from \"react\";\n\nexport interface MacWindowProps {\n  children: ReactNode;\n  title?: string;\n  containerProps?: FlexProps;\n  fill?: boolean;\n}\n\ntype WindowSize = \"25\" | \"50\" | \"75\" | \"100\";\n\nconst MacWindow = ({\n  children,\n  title,\n  containerProps,\n  fill,\n}: MacWindowProps) => {\n  const [size, setSize] = useState<WindowSize>(\"100\");\n\n  const getWidth = () => {\n    return `${size}%`;\n  };\n\n  return (\n    <Flex\n      direction=\"column\"\n      flex={fill ? 1 : undefined}\n      h={fill ? \"100%\" : undefined}\n      bdrs={\"md\"}\n      style={{\n        width: getWidth(),\n        border: \"1px solid var(--mantine-color-default-border)\",\n        overflow: \"hidden\",\n        background: \"var(--mantine-color-body)\",\n        boxShadow: \"0 4px 12px rgba(0, 0, 0, 0.15)\",\n        transition: \"width 0.3s ease\",\n      }}\n    >\n      <Flex\n        h={36}\n        px=\"sm\"\n        align=\"center\"\n        gap={8}\n        style={{\n          background: \"var(--mantine-color-default)\",\n          borderBottom: \"1px solid var(--mantine-color-default-border)\",\n        }}\n      >\n        <Flex gap={6}>\n          <Flex\n            w={12}\n            h={12}\n            style={{ borderRadius: \"50%\", background: \"#ff5f57\" }}\n          />\n          <Flex\n            w={12}\n            h={12}\n            style={{ borderRadius: \"50%\", background: \"#febc2e\" }}\n          />\n          <Flex\n            w={12}\n            h={12}\n            style={{ borderRadius: \"50%\", background: \"#28c840\" }}\n          />\n        </Flex>\n\n        <Flex\n          style={{\n            flex: 1,\n            textAlign: \"center\",\n            fontSize: 13,\n            color: \"var(--mantine-color-dimmed)\",\n          }}\n        >\n          {title}\n        </Flex>\n\n        {fill ? undefined : (\n          <SegmentedControl\n            size=\"xs\"\n            value={size}\n            onChange={(v) => setSize(v as WindowSize)}\n            data={[\n              { label: \"25\", value: \"25\" },\n              { label: \"50\", value: \"50\" },\n              { label: \"75\", value: \"75\" },\n              { label: \"100\", value: \"100\" },\n            ]}\n          />\n        )}\n      </Flex>\n      <Flex\n        direction={\"column\"}\n        flex={fill ? 1 : undefined}\n        p=\"md\"\n        {...containerProps}\n      >\n        {children}\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default MacWindow;\n","import { TypeForm, ui } from \"@alepha/ui\";\nimport { Card, Flex, Text } from \"@mantine/core\";\nimport type { Static, TObject } from \"alepha\";\nimport { useForm } from \"alepha/react/form\";\nimport { type ReactNode, useState } from \"react\";\nimport MacWindow, { type MacWindowProps } from \"./MacWindow.tsx\";\n\nexport interface ShowcaseProps<T extends TObject> {\n  /**\n   * Component title\n   */\n  title: string;\n  /**\n   * Schema for the props configuration\n   */\n  schema: T;\n  /**\n   * Initial values for the props\n   */\n  initialValues?: Partial<Static<T>>;\n  /**\n   * Number of columns for the props form\n   */\n  columns?: number;\n  /**\n   * Render function that receives the current props values\n   */\n  children: (props: Static<T>) => ReactNode;\n  /**\n   * Additional props for the MacWindow container\n   */\n  windowProps?: Partial<MacWindowProps>;\n}\n\n/**\n * Showcase component for demonstrating UI components with interactive props configuration.\n * Uses TypeForm to render a form based on the props schema and displays the component preview.\n */\nconst Showcase = <T extends TObject>({\n  title,\n  schema,\n  initialValues,\n  columns = 3,\n  children,\n  windowProps,\n}: ShowcaseProps<T>) => {\n  const [values, setValues] = useState<Record<string, any>>(\n    initialValues ?? {},\n  );\n\n  const form = useForm(\n    {\n      schema,\n      initialValues,\n      handler: (values) => {\n        setValues(values as Record<string, any>);\n      },\n      onChange: (key, value) => {\n        console.log(\"onChange\", key, value);\n        form.submit();\n      },\n    },\n    [schema],\n  );\n\n  return (\n    <Flex flex={1} h={\"100%\"}>\n      <Flex\n        flex={1}\n        bg={ui.colors.background}\n        h={\"100%\"}\n        p=\"xl\"\n        justify=\"center\"\n        align=\"flex-start\"\n        style={{ flex: 1, minWidth: 0, overflow: \"auto\" }}\n      >\n        <MacWindow title={title} {...windowProps}>\n          {children(values as Static<T>)}\n        </MacWindow>\n      </Flex>\n\n      <Flex\n        bg={ui.colors.surface}\n        h={\"100%\"}\n        p={\"md\"}\n        style={{\n          flex: \"0 0 300px\",\n          overflow: \"auto\",\n        }}\n      >\n        <Card withBorder shadow=\"sm\" radius=\"md\" bg={ui.colors.elevated}>\n          <Card.Section withBorder py={\"xs\"} inheritPadding>\n            <Text size={\"xs\"} fw={500}>\n              {title} Props\n            </Text>\n          </Card.Section>\n\n          <Card.Section p={\"sm\"}>\n            <TypeForm\n              form={form}\n              columns={columns}\n              skipSubmitButton\n              skipFormElement\n            />\n          </Card.Section>\n        </Card>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default Showcase;\n"],"mappings":";;;;;;;AAYA,MAAM,aAAa,EACjB,UACA,OACA,gBACA,WACoB;CACpB,MAAM,CAAC,MAAM,WAAW,SAAqB,MAAM;CAEnD,MAAM,iBAAiB;AACrB,SAAO,GAAG,KAAK;;AAGjB,QACE,qBAAC;EACC,WAAU;EACV,MAAM,OAAO,IAAI;EACjB,GAAG,OAAO,SAAS;EACnB,MAAM;EACN,OAAO;GACL,OAAO,UAAU;GACjB,QAAQ;GACR,UAAU;GACV,YAAY;GACZ,WAAW;GACX,YAAY;GACb;aAED,qBAAC;GACC,GAAG;GACH,IAAG;GACH,OAAM;GACN,KAAK;GACL,OAAO;IACL,YAAY;IACZ,cAAc;IACf;;IAED,qBAAC;KAAK,KAAK;;MACT,oBAAC;OACC,GAAG;OACH,GAAG;OACH,OAAO;QAAE,cAAc;QAAO,YAAY;QAAW;QACrD;MACF,oBAAC;OACC,GAAG;OACH,GAAG;OACH,OAAO;QAAE,cAAc;QAAO,YAAY;QAAW;QACrD;MACF,oBAAC;OACC,GAAG;OACH,GAAG;OACH,OAAO;QAAE,cAAc;QAAO,YAAY;QAAW;QACrD;;MACG;IAEP,oBAAC;KACC,OAAO;MACL,MAAM;MACN,WAAW;MACX,UAAU;MACV,OAAO;MACR;eAEA;MACI;IAEN,OAAO,SACN,oBAAC;KACC,MAAK;KACL,OAAO;KACP,WAAW,MAAM,QAAQ,EAAgB;KACzC,MAAM;MACJ;OAAE,OAAO;OAAM,OAAO;OAAM;MAC5B;OAAE,OAAO;OAAM,OAAO;OAAM;MAC5B;OAAE,OAAO;OAAM,OAAO;OAAM;MAC5B;OAAE,OAAO;OAAO,OAAO;OAAO;MAC/B;MACD;;IAEC,EACP,oBAAC;GACC,WAAW;GACX,MAAM,OAAO,IAAI;GACjB,GAAE;GACF,GAAI;GAEH;IACI;GACF;;;;;;;;;AC9DX,MAAM,YAA+B,EACnC,OACA,QACA,eACA,UAAU,GACV,UACA,kBACsB;CACtB,MAAM,CAAC,QAAQ,aAAa,SAC1B,iBAAiB,EAAE,CACpB;CAED,MAAM,OAAO,QACX;EACE;EACA;EACA,UAAU,WAAW;AACnB,aAAU,OAA8B;;EAE1C,WAAW,KAAK,UAAU;AACxB,WAAQ,IAAI,YAAY,KAAK,MAAM;AACnC,QAAK,QAAQ;;EAEhB,EACD,CAAC,OAAO,CACT;AAED,QACE,qBAAC;EAAK,MAAM;EAAG,GAAG;aAChB,oBAAC;GACC,MAAM;GACN,IAAI,GAAG,OAAO;GACd,GAAG;GACH,GAAE;GACF,SAAQ;GACR,OAAM;GACN,OAAO;IAAE,MAAM;IAAG,UAAU;IAAG,UAAU;IAAQ;aAEjD,oBAAC;IAAiB;IAAO,GAAI;cAC1B,SAAS,OAAoB;KACpB;IACP,EAEP,oBAAC;GACC,IAAI,GAAG,OAAO;GACd,GAAG;GACH,GAAG;GACH,OAAO;IACL,MAAM;IACN,UAAU;IACX;aAED,qBAAC;IAAK;IAAW,QAAO;IAAK,QAAO;IAAK,IAAI,GAAG,OAAO;eACrD,oBAAC,KAAK;KAAQ;KAAW,IAAI;KAAM;eACjC,qBAACA;MAAK,MAAM;MAAM,IAAI;iBACnB,OAAM;OACF;MACM,EAEf,oBAAC,KAAK;KAAQ,GAAG;eACf,oBAAC;MACO;MACG;MACT;MACA;OACA;MACW;KACV;IACF;GACF"}

package/dist/json/index.d.ts

@@ -1,57 +0,0 @@
-import { BaseDialogOptions } from "@alepha/ui";
-import { MantineSize } from "@mantine/core";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
-//#region ../../src/json/extensions/DialogService.d.ts
-declare module "@alepha/ui" {
-  interface DialogService {
-    /**
-     * Opens a JSON viewer dialog.
-     *
-     * @param data - The JSON data to display.
-     * @param options - Additional dialog options.
-     */
-    json(data?: any, options?: BaseDialogOptions): void;
-  }
-} //# sourceMappingURL=DialogService.d.ts.map
-//#endregion
-//#region ../../src/json/components/JsonViewer.d.ts
-interface JsonViewerProps {
-  data: any;
-  /**
-   * Depth level to expand by default (0 = collapsed, Infinity = all expanded)
-   */
-  defaultExpandedDepth?: number;
-  /**
-   * Maximum nesting depth to render
-   */
-  maxDepth?: number;
-  /**
-   * Size variant
-   */
-  size?: MantineSize;
-  /**
-   * Whether to show quotes around keys and strings
-   */
-  showQuotes?: boolean;
-  /**
-   * Show copy button on row hover
-   */
-  showCopyButton?: boolean;
-  /**
-   * Custom value formatter. Return formatted string or undefined to use default.
-   */
-  formatValue?: (key: string | undefined, value: any, path: string[]) => string | number | undefined;
-}
-declare const JsonViewer: ({
-  data,
-  defaultExpandedDepth,
-  maxDepth,
-  size,
-  showQuotes,
-  showCopyButton,
-  formatValue
-}: JsonViewerProps) => react_jsx_runtime0.JSX.Element;
-//#endregion
-export { JsonViewer };
-//# sourceMappingURL=index.d.ts.map

package/dist/json/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/json/extensions/DialogService.tsx","../../src/json/components/JsonViewer.tsx"],"mappings":";;;;;;YAKY,aAAA;;;AAL2D;;;;IAYnE,IAAA,CAAK,IAAA,QAAY,OAAA,GAAU,iBAAA;EAAA;AAAA;;;UCerB,eAAA;EACR,IAAA;;;AD5BqE;ECgCrE,oBAAA;;;;EAIA,QAAA;EDxBO;;;EC4BP,IAAA,GAAO,WAAA;ED5BuC;;;ECgC9C,UAAA;;AApCqB;;EAwCrB,cAAA;EARkB;;;EAYlB,WAAA,IACE,GAAA,sBACA,KAAA,OACA,IAAA;AAAA;AAAA,cA6SS,UAAA;EAAc,IAAA;EAAA,oBAAA;EAAA,QAAA;EAAA,IAAA;EAAA,UAAA;EAAA,cAAA;EAAA;AAAA,GAQxB,eAAA,KAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/json/index.js

@@ -1,325 +0,0 @@
-import { DialogService, ui } from "@alepha/ui";
-import { ActionIcon, Flex, Text, Tree, getTreeExpandedState, useTree } from "@mantine/core";
-import { IconCheck, IconChevronDown, IconChevronRight, IconCopy } from "@tabler/icons-react";
-import { useCallback, useMemo, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region ../../src/json/components/JsonViewer.tsx
-const SIZE_CONFIG = {
-	xs: {
-		icon: 14,
-		levelOffset: 16
-	},
-	sm: {
-		icon: 16,
-		levelOffset: 20
-	},
-	md: {
-		icon: 18,
-		levelOffset: 24
-	},
-	lg: {
-		icon: 20,
-		levelOffset: 28
-	},
-	xl: {
-		icon: 22,
-		levelOffset: 32
-	}
-};
-const STYLES = {
-	root: { fontFamily: "var(--mantine-font-family-monospace)" },
-	chevron: {
-		flexShrink: 0,
-		color: "var(--mantine-color-dimmed)"
-	},
-	key: {
-		color: "var(--mantine-color-cyan-text)",
-		fontWeight: 500
-	},
-	colon: { color: "var(--mantine-color-dimmed)" },
-	string: { color: "var(--mantine-color-teal-text)" },
-	number: { color: "var(--mantine-color-blue-text)" },
-	boolean: { color: "var(--mantine-color-violet-text)" },
-	null: {
-		color: "var(--mantine-color-dimmed)",
-		fontStyle: "italic"
-	},
-	preview: { color: "var(--mantine-color-dimmed)" }
-};
-const getValueType = (val) => {
-	if (val === null) return "null";
-	if (val === void 0) return "undefined";
-	if (Array.isArray(val)) return "array";
-	return typeof val;
-};
-function buildTreeNodes(data, path = [], key, isArrayItem = false, maxDepth = 10) {
-	const currentPath = key !== void 0 ? [...path, key] : path;
-	const nodeId = currentPath.length > 0 ? currentPath.join(".") : "root";
-	if (currentPath.length > maxDepth) return {
-		value: nodeId,
-		label: key ?? "",
-		nodeValue: data,
-		nodeKey: key,
-		path: currentPath,
-		isArrayItem
-	};
-	const type = getValueType(data);
-	if (type === "object" || type === "array") {
-		const children = (type === "array" ? data.map((v, i) => [String(i), v]) : Object.entries(data)).map(([k, v]) => buildTreeNodes(v, currentPath, k, type === "array", maxDepth)).filter((n) => n !== null);
-		return {
-			value: nodeId,
-			label: key ?? "",
-			nodeValue: data,
-			nodeKey: key,
-			path: currentPath,
-			isArrayItem,
-			children: children.length > 0 ? children : void 0
-		};
-	}
-	return {
-		value: nodeId,
-		label: key ?? "",
-		nodeValue: data,
-		nodeKey: key,
-		path: currentPath,
-		isArrayItem
-	};
-}
-function getExpandedIds(nodes, targetDepth, currentDepth = 0) {
-	if (currentDepth >= targetDepth) return [];
-	const ids = [];
-	for (const node of nodes) if (node.children) {
-		ids.push(node.value);
-		ids.push(...getExpandedIds(node.children, targetDepth, currentDepth + 1));
-	}
-	return ids;
-}
-const CopyButton = ({ value, iconSize }) => {
-	const [copied, setCopied] = useState(false);
-	const handleCopy = useCallback((e) => {
-		e.stopPropagation();
-		navigator.clipboard.writeText(value);
-		setCopied(true);
-		setTimeout(() => setCopied(false), 1500);
-	}, [value]);
-	return /* @__PURE__ */ jsx(ActionIcon, {
-		size: iconSize + 4,
-		variant: "transparent",
-		c: copied ? "green" : "dimmed",
-		onClick: handleCopy,
-		className: "alepha-json-viewer-copy",
-		children: copied ? /* @__PURE__ */ jsx(IconCheck, { size: iconSize }) : /* @__PURE__ */ jsx(IconCopy, { size: iconSize })
-	});
-};
-const RowNode = ({ node, expanded, hasChildren, elementProps, size, config, showQuotes, showCopyButton, renderValue }) => {
-	const { nodeValue, nodeKey, path, isArrayItem, isRoot } = node;
-	const type = getValueType(nodeValue);
-	const isExpandable = type === "object" || type === "array";
-	const getPreview = () => {
-		if (!isExpandable) return null;
-		const count = (type === "array" ? nodeValue : Object.keys(nodeValue)).length;
-		const label = type === "array" ? "item" : "key";
-		if (!expanded) return /* @__PURE__ */ jsx(Text, {
-			fs: "italic",
-			component: "span",
-			size,
-			style: STYLES.preview,
-			children: count === 0 ? type === "array" ? "[]" : "{}" : type === "array" ? `[ ${count} ${count === 1 ? label : `${label}s`} ]` : `{ ${count} ${count === 1 ? label : `${label}s`} }`
-		});
-		return null;
-	};
-	const getCopyValue = () => isExpandable ? JSON.stringify(nodeValue, null, 2) : String(nodeValue ?? "");
-	return /* @__PURE__ */ jsxs(Flex, {
-		gap: 6,
-		wrap: "nowrap",
-		...elementProps,
-		className: `alepha-json-viewer-row ${elementProps.className || ""}`,
-		children: [
-			hasChildren ? expanded ? /* @__PURE__ */ jsx(IconChevronDown, {
-				size: config.icon,
-				style: STYLES.chevron
-			}) : /* @__PURE__ */ jsx(IconChevronRight, {
-				size: config.icon,
-				style: STYLES.chevron
-			}) : /* @__PURE__ */ jsx("span", { style: {
-				width: config.icon,
-				flexShrink: 0
-			} }),
-			nodeKey !== void 0 && !isArrayItem && /* @__PURE__ */ jsxs(Text, {
-				component: "span",
-				size,
-				children: [/* @__PURE__ */ jsx("span", {
-					style: STYLES.key,
-					children: showQuotes ? `"${nodeKey}"` : nodeKey
-				}), /* @__PURE__ */ jsx("span", {
-					style: STYLES.colon,
-					children: ":"
-				})]
-			}),
-			nodeKey !== void 0 && isArrayItem && /* @__PURE__ */ jsxs(Text, {
-				component: "span",
-				size,
-				children: [/* @__PURE__ */ jsx("span", {
-					style: STYLES.key,
-					children: nodeKey
-				}), /* @__PURE__ */ jsx("span", {
-					style: STYLES.colon,
-					children: ":"
-				})]
-			}),
-			hasChildren ? getPreview() : isExpandable ? type === "array" ? /* @__PURE__ */ jsx(Text, {
-				component: "span",
-				size,
-				style: STYLES.preview,
-				children: "[]"
-			}) : /* @__PURE__ */ jsx(Text, {
-				component: "span",
-				size,
-				style: STYLES.preview,
-				children: "{}"
-			}) : renderValue(nodeValue, nodeKey, path),
-			showCopyButton && /* @__PURE__ */ jsx(CopyButton, {
-				value: getCopyValue(),
-				iconSize: config.icon
-			})
-		]
-	});
-};
-const JsonViewer = ({ data, defaultExpandedDepth = 2, maxDepth = 10, size = "sm", showQuotes = false, showCopyButton = true, formatValue }) => {
-	const config = SIZE_CONFIG[size] || SIZE_CONFIG.sm;
-	const treeData = useMemo(() => {
-		const type = getValueType(data);
-		if (type === "object" || type === "array") {
-			const children = (type === "array" ? data.map((v, i) => [String(i), v]) : Object.entries(data)).map(([k, v]) => buildTreeNodes(v, [], k, type === "array", maxDepth)).filter((n) => n !== null);
-			return [{
-				value: "root",
-				label: "",
-				nodeValue: data,
-				nodeKey: void 0,
-				path: [],
-				isArrayItem: false,
-				isRoot: true,
-				children: children.length > 0 ? children : void 0
-			}];
-		}
-		const node = buildTreeNodes(data, [], void 0, false, maxDepth);
-		return node ? [node] : [];
-	}, [data, maxDepth]);
-	const tree = useTree({ initialExpandedState: useMemo(() => {
-		if (defaultExpandedDepth === 0) return {};
-		if (defaultExpandedDepth === Infinity) return getTreeExpandedState(treeData, "*");
-		return getTreeExpandedState(treeData, getExpandedIds(treeData, defaultExpandedDepth + 1));
-	}, [treeData, defaultExpandedDepth]) });
-	const renderValue = useCallback((val, key, path) => {
-		const custom = formatValue?.(key, val, path);
-		if (custom !== void 0) return /* @__PURE__ */ jsx(Text, {
-			component: "span",
-			size,
-			style: STYLES.string,
-			className: "alepha-json-viewer-value",
-			title: String(val),
-			children: custom
-		});
-		const type = getValueType(val);
-		switch (type) {
-			case "string": return /* @__PURE__ */ jsxs(Text, {
-				style: STYLES.string,
-				component: "span",
-				size,
-				className: "alepha-json-viewer-value",
-				title: val,
-				children: [
-					"\"",
-					val,
-					"\""
-				]
-			});
-			case "number": return /* @__PURE__ */ jsx(Text, {
-				component: "span",
-				size,
-				style: STYLES.number,
-				children: val
-			});
-			case "boolean": return /* @__PURE__ */ jsx(Text, {
-				component: "span",
-				size,
-				style: STYLES.boolean,
-				children: String(val)
-			});
-			case "null":
-			case "undefined": return /* @__PURE__ */ jsx(Text, {
-				component: "span",
-				size,
-				style: STYLES.null,
-				children: type
-			});
-			default: return /* @__PURE__ */ jsx(Text, {
-				component: "span",
-				size,
-				children: String(val)
-			});
-		}
-	}, [
-		formatValue,
-		showQuotes,
-		size
-	]);
-	const renderNode = useCallback(({ node, expanded, hasChildren, elementProps }) => {
-		return /* @__PURE__ */ jsx(RowNode, {
-			node,
-			expanded,
-			hasChildren,
-			elementProps,
-			size,
-			config,
-			showQuotes,
-			showCopyButton,
-			renderValue
-		});
-	}, [
-		config,
-		renderValue,
-		showCopyButton,
-		showQuotes,
-		size
-	]);
-	if (treeData.length === 0) return /* @__PURE__ */ jsx(Text, {
-		size,
-		style: STYLES.null,
-		children: data === null ? "null" : data === void 0 ? "undefined" : "{}"
-	});
-	return /* @__PURE__ */ jsx(Tree, {
-		data: treeData,
-		tree,
-		levelOffset: config.levelOffset,
-		expandOnClick: true,
-		renderNode,
-		styles: { root: STYLES.root }
-	});
-};
-
-//#endregion
-//#region ../../src/json/extensions/DialogService.tsx
-DialogService.prototype.json = function(data, options) {
-	this.open({
-		size: "lg",
-		title: options?.title || "Json Viewer",
-		...options,
-		content: /* @__PURE__ */ jsx(Flex, {
-			bdrs: "md",
-			w: "100%",
-			flex: 1,
-			p: "sm",
-			bg: ui.colors.surface,
-			children: /* @__PURE__ */ jsx(JsonViewer, {
-				size: "xs",
-				data
-			})
-		})
-	});
-};
-
-//#endregion
-export { JsonViewer };
-//# sourceMappingURL=index.js.map