@svadmin/lite 0.3.7 → 0.3.12

package/dist/components/buttons/LiteExportButton.svelte

@@ -0,0 +1,31 @@
+<script lang="ts">
+  import { t } from '@svadmin/core/i18n';
+  import { Download } from '@lucide/svelte';
+
+  interface Props {
+    resource: string;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+  }
+
+  let {
+    resource,
+    basePath = '/lite',
+    hideText = false,
+    class: className = '',
+    size = 'default'
+  }: Props = $props();
+</script>
+
+<a
+  href={`${basePath}/${resource}?action=export`}
+  class="lite-btn {size === 'sm' ? 'lite-btn-sm' : ''} {className}"
+  title={t('common.export') || 'Export'}
+>
+  <Download class="h-4 w-4" />
+  {#if !hideText}
+    <span style="marginLeft: 4px">{t('common.export') || 'Export'}</span>
+  {/if}
+</a>

package/dist/components/buttons/LiteExportButton.svelte.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    resource: string;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+}
+declare const LiteExportButton: import("svelte").Component<Props, {}, "">;
+type LiteExportButton = ReturnType<typeof LiteExportButton>;
+export default LiteExportButton;

package/dist/components/buttons/LiteImportButton.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+  import { t } from '@svadmin/core/i18n';
+  import { Upload } from '@lucide/svelte';
+
+  interface Props {
+    resource: string;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+  }
+
+  let {
+    resource,
+    basePath = '/lite',
+    hideText = false,
+    class: className = '',
+    size = 'default'
+  }: Props = $props();
+</script>
+
+<details class="lite-confirm-details {className}">
+  <summary 
+    class="lite-btn {size === 'sm' ? 'lite-btn-sm' : ''}"
+    title={t('common.import') || 'Import'}
+  >
+    <Upload class="h-4 w-4" />
+    {#if !hideText}
+      <span style="marginLeft: 4px">{t('common.import') || 'Import'}</span>
+    {/if}
+  </summary>
+  <div class="lite-confirm-panel">
+    <p style="margin: 0 0 8px; font-size: 13px;">{t('common.importData') || 'Import data (CSV/JSON)'}</p>
+    <form method="POST" action={`${basePath}/${resource}?/${resource}_import`} enctype="multipart/form-data" style="display:flex; flex-direction: column; gap: 8px;">
+      <input type="file" name="file" accept=".csv,.json" required style="font-size: 13px;" />
+      <div style="display:flex; gap: 8px; justify-content: flex-end;">
+        <button 
+          type="button" 
+          class="lite-btn lite-btn-sm" 
+          onclick={(e) => (e.currentTarget as HTMLElement).closest('details')?.removeAttribute('open')}
+        >
+          {t('common.cancel') || 'Cancel'}
+        </button>
+        <button type="submit" class="lite-btn lite-btn-sm lite-btn-primary">
+          {t('common.upload') || 'Upload'}
+        </button>
+      </div>
+    </form>
+  </div>
+</details>

package/dist/components/buttons/LiteImportButton.svelte.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    resource: string;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+}
+declare const LiteImportButton: import("svelte").Component<Props, {}, "">;
+type LiteImportButton = ReturnType<typeof LiteImportButton>;
+export default LiteImportButton;

package/dist/components/buttons/LiteListButton.svelte

@@ -0,0 +1,31 @@
+<script lang="ts">
+  import { t } from '@svadmin/core/i18n';
+  import { List } from '@lucide/svelte';
+
+  interface Props {
+    resource: string;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+  }
+
+  let {
+    resource,
+    basePath = '/lite',
+    hideText = false,
+    class: className = '',
+    size = 'default'
+  }: Props = $props();
+</script>
+
+<a
+  href={`${basePath}/${resource}`}
+  class="lite-btn {size === 'sm' ? 'lite-btn-sm' : ''} {className}"
+  title={t('common.list') || 'List'}
+>
+  <List class="h-4 w-4" />
+  {#if !hideText}
+    <span style="marginLeft: 4px">{t('common.list') || 'List'}</span>
+  {/if}
+</a>

package/dist/components/buttons/LiteListButton.svelte.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    resource: string;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+}
+declare const LiteListButton: import("svelte").Component<Props, {}, "">;
+type LiteListButton = ReturnType<typeof LiteListButton>;
+export default LiteListButton;

package/dist/components/buttons/LiteRefreshButton.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+  import { t } from '@svadmin/core/i18n';
+  import { RefreshCw } from '@lucide/svelte';
+
+  interface Props {
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+  }
+
+  let {
+    hideText = false,
+    class: className = '',
+    size = 'default'
+  }: Props = $props();
+
+  function refreshPage() {
+    if (typeof window !== 'undefined') {
+      window.location.reload();
+    }
+  }
+</script>
+
+<button
+  type="button"
+  class="lite-btn {size === 'sm' ? 'lite-btn-sm' : ''} {className}"
+  title={t('common.refresh') || 'Refresh'}
+  onclick={refreshPage}
+>
+  <RefreshCw class="h-4 w-4" />
+  {#if !hideText}
+    <span style="marginLeft: 4px">{t('common.refresh') || 'Refresh'}</span>
+  {/if}
+</button>

package/dist/components/buttons/LiteRefreshButton.svelte.d.ts

@@ -0,0 +1,8 @@
+interface Props {
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+}
+declare const LiteRefreshButton: import("svelte").Component<Props, {}, "">;
+type LiteRefreshButton = ReturnType<typeof LiteRefreshButton>;
+export default LiteRefreshButton;

package/dist/components/buttons/LiteSaveButton.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+  import { t } from '@svadmin/core/i18n';
+  import { Save } from '@lucide/svelte';
+
+  interface Props {
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+  }
+
+  let {
+    hideText = false,
+    class: className = '',
+    size = 'default'
+  }: Props = $props();
+</script>
+
+<button
+  type="submit"
+  class="lite-btn lite-btn-primary {size === 'sm' ? 'lite-btn-sm' : ''} {className}"
+  title={t('common.save') || 'Save'}
+>
+  <Save class="h-4 w-4" />
+  {#if !hideText}
+    <span style="marginLeft: 4px">{t('common.save') || 'Save'}</span>
+  {/if}
+</button>

package/dist/components/buttons/LiteSaveButton.svelte.d.ts

@@ -0,0 +1,8 @@
+interface Props {
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+}
+declare const LiteSaveButton: import("svelte").Component<Props, {}, "">;
+type LiteSaveButton = ReturnType<typeof LiteSaveButton>;
+export default LiteSaveButton;

package/dist/components/buttons/LiteShowButton.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+  import { t } from '@svadmin/core/i18n';
+  import { Eye } from '@lucide/svelte';
+
+  interface Props {
+    resource: string;
+    recordItemId: string | number;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+  }
+
+  let {
+    resource,
+    recordItemId,
+    basePath = '/lite',
+    hideText = false,
+    class: className = '',
+    size = 'default'
+  }: Props = $props();
+</script>
+
+<a
+  href={`${basePath}/${resource}/show/${recordItemId}`}
+  class="lite-btn {size === 'sm' ? 'lite-btn-sm' : ''} {className}"
+  title={t('common.show') || 'Show'}
+>
+  <Eye class="h-4 w-4" />
+  {#if !hideText}
+    <span style="marginLeft: 4px">{t('common.show') || 'Show'}</span>
+  {/if}
+</a>

package/dist/components/buttons/LiteShowButton.svelte.d.ts

@@ -0,0 +1,11 @@
+interface Props {
+    resource: string;
+    recordItemId: string | number;
+    basePath?: string;
+    hideText?: boolean;
+    class?: string;
+    size?: 'sm' | 'default' | 'icon';
+}
+declare const LiteShowButton: import("svelte").Component<Props, {}, "">;
+type LiteShowButton = ReturnType<typeof LiteShowButton>;
+export default LiteShowButton;

package/dist/components/buttons/index.js

@@ -0,0 +1,10 @@
+export { default as LiteCreateButton } from './LiteCreateButton.svelte';
+export { default as LiteEditButton } from './LiteEditButton.svelte';
+export { default as LiteShowButton } from './LiteShowButton.svelte';
+export { default as LiteListButton } from './LiteListButton.svelte';
+export { default as LiteDeleteButton } from './LiteDeleteButton.svelte';
+export { default as LiteCloneButton } from './LiteCloneButton.svelte';
+export { default as LiteExportButton } from './LiteExportButton.svelte';
+export { default as LiteImportButton } from './LiteImportButton.svelte';
+export { default as LiteRefreshButton } from './LiteRefreshButton.svelte';
+export { default as LiteSaveButton } from './LiteSaveButton.svelte';

package/dist/components/fields/LiteBooleanField.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">
+/* eslint-disable @typescript-eslint/no-explicit-any */
+  import type { FieldDefinition } from '@svadmin/core';
+
+  interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+  }
+
+  let { field, value, error = [], mode = 'show' }: Props = $props();
+  let hasError = $derived(error.length > 0);
+</script>
+
+{#if mode === 'show'}
+  <div>
+    <span class="lite-bool {value ? 'lite-bool-true' : ''}"></span>
+    {value ? '✓ Yes' : '✗ No'}
+  </div>
+{:else}
+  <div class="lite-checkbox-group">
+    <input
+      type="checkbox"
+      name={field.key}
+      id={field.key}
+      checked={!!value}
+      value="true"
+    />
+    <!-- Fallback hidden input so unchecked boxes submit "false" -->
+    <input type="hidden" name={field.key} value="false" />
+    
+    <label for={field.key}>
+      {(field as any).placeholder ?? (field.label || 'Yes')}
+    </label>
+    {#if hasError}
+      {#each error as err, _i (_i)}
+        <div class="lite-error-text">{err}</div>
+      {/each}
+    {/if}
+  </div>
+{/if}

package/dist/components/fields/LiteBooleanField.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { FieldDefinition } from '@svadmin/core';
+interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+}
+declare const LiteBooleanField: import("svelte").Component<Props, {}, "">;
+type LiteBooleanField = ReturnType<typeof LiteBooleanField>;
+export default LiteBooleanField;

package/dist/components/fields/LiteDateField.svelte

@@ -0,0 +1,51 @@
+<script lang="ts">
+  import type { FieldDefinition } from '@svadmin/core';
+
+  interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+  }
+
+  let { field, value, error = [], mode = 'show' }: Props = $props();
+  let hasError = $derived(error.length > 0);
+
+  function formatDate(v: unknown): string {
+    if (!v) return '';
+    try {
+      return new Date(v as string).toISOString().substring(0, 16); // Formats for html datetime-local
+    } catch {
+      return '';
+    }
+  }
+
+  function displayDate(v: unknown): string {
+    if (!v) return '—';
+    try {
+      return new Date(v as string).toLocaleString();
+    } catch {
+      return String(v);
+    }
+  }
+</script>
+
+{#if mode === 'show'}
+  <span>{displayDate(value)}</span>
+{:else}
+  <div>
+    <input
+      type="datetime-local"
+      name={field.key}
+      id={field.key}
+      value={formatDate(value)}
+      class="lite-input {hasError ? 'lite-input-error' : ''}"
+      {...field.required ? { required: true } : {}}
+    />
+    {#if hasError}
+      {#each error as err, _i (_i)}
+        <div class="lite-error-text">{err}</div>
+      {/each}
+    {/if}
+  </div>
+{/if}

package/dist/components/fields/LiteDateField.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { FieldDefinition } from '@svadmin/core';
+interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+}
+declare const LiteDateField: import("svelte").Component<Props, {}, "">;
+type LiteDateField = ReturnType<typeof LiteDateField>;
+export default LiteDateField;

package/dist/components/fields/LiteEmailField.svelte

@@ -0,0 +1,41 @@
+<script lang="ts">
+/* eslint-disable @typescript-eslint/no-explicit-any */
+  import type { FieldDefinition } from '@svadmin/core';
+
+  interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+  }
+
+  let { field, value, error = [], mode = 'show' }: Props = $props();
+  let hasError = $derived(error.length > 0);
+</script>
+
+{#if mode === 'show'}
+  <span>
+    {#if value}
+      <a href="mailto:{value}">{value}</a>
+    {:else}
+      —
+    {/if}
+  </span>
+{:else}
+  <div>
+    <input
+      type="email"
+      name={field.key}
+      id={field.key}
+      value={String(value ?? '')}
+      class="lite-input {hasError ? 'lite-input-error' : ''}"
+      placeholder={(field as any).placeholder ?? field.label}
+      {...field.required ? { required: true } : {}}
+    />
+    {#if hasError}
+      {#each error as err, _i (_i)}
+        <div class="lite-error-text">{err}</div>
+      {/each}
+    {/if}
+  </div>
+{/if}

package/dist/components/fields/LiteEmailField.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { FieldDefinition } from '@svadmin/core';
+interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+}
+declare const LiteEmailField: import("svelte").Component<Props, {}, "">;
+type LiteEmailField = ReturnType<typeof LiteEmailField>;
+export default LiteEmailField;

package/dist/components/fields/LiteFileField.svelte

@@ -0,0 +1,59 @@
+<script lang="ts">
+  import type { FieldDefinition } from '@svadmin/core';
+  import { toSafeHref } from '../../security';
+
+  interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+  }
+
+  let { field, value, error = [], mode = 'show' }: Props = $props();
+  let hasError = $derived(error.length > 0);
+
+  function getFiles(v: unknown): string[] {
+    if (!v) return [];
+    if (Array.isArray(v)) return v.map(String);
+    if (typeof v === 'string') return [v];
+    return [];
+  }
+</script>
+
+{#if mode === 'show'}
+  {@const files = getFiles(value)}
+  <div style="display:flex; flex-direction: column; gap: 4px;">
+    {#each files as f, _i (_i)}
+      {@const href = toSafeHref(f)}
+      {#if href}
+        <a {href} target="_blank" rel="noopener noreferrer">{f.split('/').pop() || 'Download'}</a>
+      {:else}
+        <span>{f}</span>
+      {/if}
+    {:else}
+      <span>—</span>
+    {/each}
+  </div>
+{:else}
+  {@const files = getFiles(value)}
+  <div>
+    {#if files.length > 0 && mode === 'edit'}
+      <div style="margin-bottom: 8px;">
+        <span style="font-size: 12px;">Current files: {files.length}</span>
+      </div>
+    {/if}
+    <input
+      type="file"
+      name={field.key}
+      id={field.key}
+      class="lite-input {hasError ? 'lite-input-error' : ''}"
+      {...(field.type as string) === 'files' ? { multiple: true } : {}}
+      {...field.required && !files.length ? { required: true } : {}}
+    />
+    {#if hasError}
+      {#each error as err, _i (_i)}
+        <div class="lite-error-text">{err}</div>
+      {/each}
+    {/if}
+  </div>
+{/if}

package/dist/components/fields/LiteFileField.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { FieldDefinition } from '@svadmin/core';
+interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+}
+declare const LiteFileField: import("svelte").Component<Props, {}, "">;
+type LiteFileField = ReturnType<typeof LiteFileField>;
+export default LiteFileField;

package/dist/components/fields/LiteImageField.svelte

@@ -0,0 +1,57 @@
+<script lang="ts">
+  import type { FieldDefinition } from '@svadmin/core';
+
+  interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+  }
+
+  let { field, value, error = [], mode = 'show' }: Props = $props();
+  let hasError = $derived(error.length > 0);
+  
+  function getUrls(v: unknown): string[] {
+    if (!v) return [];
+    if (Array.isArray(v)) return v.map(String);
+    if (typeof v === 'string') return [v];
+    return [];
+  }
+</script>
+
+{#if mode === 'show'}
+  {@const urls = getUrls(value)}
+  <div style="display:flex; gap: 8px; flex-wrap: wrap;">
+    {#each urls as url, _i (_i)}
+      <img src={url} alt={field.label} style="max-height: 100px; border-radius: 4px; border: 1px solid #e5e7eb;" />
+    {:else}
+      <span>—</span>
+    {/each}
+  </div>
+{:else}
+  {@const urls = getUrls(value)}
+  <div>
+    {#if urls.length > 0 && mode === 'edit'}
+      <div style="margin-bottom: 8px; display:flex; gap: 8px;">
+        {#each urls as url, _i (_i)}
+          <img src={url} alt="Current" style="height: 60px; border-radius: 4px; border: 1px solid #e5e7eb; opacity: 0.6;" />
+        {/each}
+      </div>
+      <p style="font-size: 11px; color:#6b7280; margin: 0 0 4px;">Uploading new ones will overwrite.</p>
+    {/if}
+    <input
+      type="file"
+      name={field.key}
+      id={field.key}
+      accept="image/*"
+      class="lite-input {hasError ? 'lite-input-error' : ''}"
+      {...(field.type as string) === 'images' ? { multiple: true } : {}}
+      {...field.required && !urls.length ? { required: true } : {}}
+    />
+    {#if hasError}
+      {#each error as err, _i (_i)}
+        <div class="lite-error-text">{err}</div>
+      {/each}
+    {/if}
+  </div>
+{/if}

package/dist/components/fields/LiteImageField.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { FieldDefinition } from '@svadmin/core';
+interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+}
+declare const LiteImageField: import("svelte").Component<Props, {}, "">;
+type LiteImageField = ReturnType<typeof LiteImageField>;
+export default LiteImageField;

package/dist/components/fields/LiteJsonField.svelte

@@ -0,0 +1,43 @@
+<script lang="ts">
+  import type { FieldDefinition } from '@svadmin/core';
+
+  interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+  }
+
+  let { field, value, error = [], mode = 'show' }: Props = $props();
+  let hasError = $derived(error.length > 0);
+  
+  function getJsonString(v: unknown): string {
+    if (v == null) return '';
+    if (typeof v === 'string') return v;
+    try {
+      return JSON.stringify(v, null, 2);
+    } catch {
+      return String(v);
+    }
+  }
+</script>
+
+{#if mode === 'show'}
+  <pre style="padding: 12px; background: #1e293b; color: #f8fafc; border-radius: 4px; overflow-x: auto; font-size: 13px;">{getJsonString(value)}</pre>
+{:else}
+  <div>
+    <textarea
+      name={field.key}
+      id={field.key}
+      class="lite-input {hasError ? 'lite-input-error' : ''}"
+      style="min-height: 150px; font-family: monospace;"
+      placeholder="&lbrace;&rbrace;"
+      {...field.required ? { required: true } : {}}
+    >{getJsonString(value)}</textarea>
+    {#if hasError}
+      {#each error as err, _i (_i)}
+        <div class="lite-error-text">{err}</div>
+      {/each}
+    {/if}
+  </div>
+{/if}

package/dist/components/fields/LiteJsonField.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { FieldDefinition } from '@svadmin/core';
+interface Props {
+    field: FieldDefinition;
+    value?: unknown;
+    error?: string[];
+    mode?: 'show' | 'edit' | 'create';
+}
+declare const LiteJsonField: import("svelte").Component<Props, {}, "">;
+type LiteJsonField = ReturnType<typeof LiteJsonField>;
+export default LiteJsonField;