@happyvertical/smrt-ui 0.54.4 → 0.55.1

package/AGENTS.md

@@ -53,6 +53,7 @@ components are exempt — they *are* the primitives.
 | `./calendar` | `CalendarView` (time-zone-aware month/week grids + phone agenda) and its Svelte-free date model (`toEntries`, `layoutMonth`, `layoutWeek`, `dateKeyInZone`, …); deprecated `Calendar`, `DayView` |
 | `./chat` | `MessageBubble`, `ReactionPicker`, `TypingIndicator` |
 | `./forms` | Provider-free fields, choice controls, sliders/ranges, combobox/listbox/multiselect/tags, date/time/file controls, `CameraCapture`/`SignaturePad` capture, plus the transport-neutral control interaction registry |
+| `.` permissions | `PermissionCheck` and the domain-agnostic `PermissionPicker` for grouped, searchable native role-grant forms over host-supplied catalog records |
 | `./form-retry` | **Svelte-free** form retry (#3291): submission key, in-flight refusal, conditional reset, opt-in restore-after-reload, browser `runOnce()` digest. Also re-exported from `./forms`. Framework-free TS typed structurally against SvelteKit's `SubmitFunction` — never import `@sveltejs/kit` here. Guide: `docs/content/form-retry.md` |
 | `./i18n` | i18n **client**: `useI18n`, `<Trans>`, `defineMessages`, `renderTemplate` (no `smrt-languages` import — the server resolver stays in `smrt-svelte/i18n/server`) |
 | `./registry` | `ModuleUIRegistry` for cross-package component discovery |

package/README.md

@@ -14,6 +14,8 @@ pnpm add @happyvertical/smrt-ui
   import { ThemeProvider } from '@happyvertical/smrt-ui/themes';
   import { Button } from '@happyvertical/smrt-ui/ui';
   import { Form, FormGroup, Input, Switch } from '@happyvertical/smrt-ui/forms';
+  import '@happyvertical/smrt-ui/themes/styles/base.css';
+  import '@happyvertical/smrt-ui/themes/styles/material.css';
 </script>
 
 <ThemeProvider preset="material" colorScheme="system">
@@ -38,7 +40,7 @@ pnpm add @happyvertical/smrt-ui
 | Disclosure and overlays | `Popover`, `Disclosure`, `Accordion`/`AccordionItem`, `Modal`, `Drawer`/`Sheet`, `PhoneSheet`, `ConfirmDialog` |
 | Feedback | `Alert`, `ToastViewport`, `Progress`, `Meter`, `Spinner`, `LoadingOverlay`, `WorkingStrip` |
 | Collections | `CollectionToolbar`, `CollectionList`/`ContentList`, `DataTable`, `Pagination` |
-| Layout and navigation | `Container`, `Grid`, `Header`, `Footer`, `PageHeader`, `EmptyState`, `Tabs`, `FilterChips` |
+| Layout and navigation | `Container`, `PageLayout`, `Grid`, `ActionGroup`, `Header`, `Footer`, `PageHeader`, `EmptyState`, `Tabs`, `FilterChips` |
 | Calendar | `CalendarView` (deprecated: `Calendar`, `DayView`) |
 
 ### Phone surfaces
@@ -93,11 +95,15 @@ under the phone top bar. Pair it with `useLinkSurface` (smrt-svelte) so
 agents can switch tabs too.
 
 Use the focused subpaths (`/forms`, `/form-retry`, `/ui`, `/feedback`, `/data`,
-`/data-surface`, `/layout`, `/themes`) to keep imports explicit. The
+`/data-surface`, `/currency`, `/layout`, `/themes`) to keep imports explicit. The
 Svelte-free `/data-surface` entry exposes the registry contracts and shared
 protocol limits for server adapters; the Svelte-free `/form-retry` entry
-exposes the form-retry helper. The package root remains a compatibility
-barrel.
+exposes the form-retry helper. The Svelte-free `/currency` entry exposes
+`ISO_4217_MINOR_UNITS`, the shared ISO 4217 registry used for deterministic
+minor-unit scaling. A missing code is unsupported; a `null` value is a valid
+ISO fund, metal, test, or no-currency code without a defined minor unit, so
+callers handling integer minor-unit money must reject both cases rather than
+inventing a decimal precision. The package root remains a compatibility barrel.
 
 ### Calendar dates and shop time
 
@@ -944,6 +950,7 @@ hand-authored, and every text pairing clears WCAG AA.
 ```svelte
 <script>
   import { ThemeProvider } from '@happyvertical/smrt-ui/themes';
+  import '@happyvertical/smrt-ui/themes/styles/base.css';
   import '@happyvertical/smrt-ui/themes/styles/all.css';
   import '@happyvertical/smrt-ui/themes/styles/fonts.css';
 </script>
@@ -953,6 +960,33 @@ hand-authored, and every text pairing clears WCAG AA.
 </ThemeProvider>
 ```
 
+The application baseline is intentionally separate from theme tokens. Import
+`base.css` once at the app entry point to remove the browser body margin, use
+border-box sizing, apply the active theme to the document, and make native form
+controls inherit the app typeface. It does not reset lists or content margins.
+
+PageLayout keeps wide tables and tab rows within the available page width,
+including when nested inside a semantic section. Their own scroll containers
+remain scrollable. Place visual sections directly under PageLayout to use its
+vertical gap.
+
+Use `PageLayout` inside an application shell to give each route responsive
+gutters, block padding, vertical rhythm, and the width appropriate to its
+content. It never creates a scroll container or claims viewport height.
+Use `ActionGroup` for adjacent page or card actions; it wraps with token spacing
+and can justify actions at the start or end without form-specific behavior.
+
+```svelte
+<script>
+  import { PageHeader, PageLayout } from '@happyvertical/smrt-ui/layout';
+</script>
+
+<PageLayout maxWidth="xl" gap="md">
+  <PageHeader title="Projects" subtitle="Plan and track active work" />
+  <!-- collection, cards, form, or detail content -->
+</PageLayout>
+```
+
 Run the shared playground to inspect the full catalog under every preset and
 light/dark scheme.
 

package/dist/components/layout/ActionGroup.svelte

@@ -0,0 +1,55 @@
+<script lang="ts">
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+
+type Gap = 'sm' | 'md';
+type Justify = 'start' | 'end';
+
+export interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+  /** Space between actions. */
+  gap?: Gap;
+  /** Horizontal alignment when the row has spare space. */
+  justify?: Justify;
+  /** CSS classes appended to the action group. */
+  class?: string;
+  /** Buttons, button links, or other compact actions. */
+  children: Snippet;
+}
+
+const {
+  gap = 'sm',
+  justify = 'start',
+  class: className = '',
+  children,
+  ...rest
+}: Props = $props();
+</script>
+
+<div class="action-group gap-{gap} justify-{justify} {className}" {...rest}>
+  {@render children()}
+</div>
+
+<style>
+  .action-group {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    min-inline-size: 0;
+  }
+
+  .gap-sm {
+    gap: var(--smrt-spacing-2);
+  }
+
+  .gap-md {
+    gap: var(--smrt-spacing-3);
+  }
+
+  .justify-start {
+    justify-content: flex-start;
+  }
+
+  .justify-end {
+    justify-content: flex-end;
+  }
+</style>

package/dist/components/layout/ActionGroup.svelte.d.ts

@@ -0,0 +1,18 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type Gap = 'sm' | 'md';
+type Justify = 'start' | 'end';
+export interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+    /** Space between actions. */
+    gap?: Gap;
+    /** Horizontal alignment when the row has spare space. */
+    justify?: Justify;
+    /** CSS classes appended to the action group. */
+    class?: string;
+    /** Buttons, button links, or other compact actions. */
+    children: Snippet;
+}
+declare const ActionGroup: import("svelte").Component<Props, {}, "">;
+type ActionGroup = ReturnType<typeof ActionGroup>;
+export default ActionGroup;
+//# sourceMappingURL=ActionGroup.svelte.d.ts.map

package/dist/components/layout/ActionGroup.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionGroup.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/layout/ActionGroup.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGtD,KAAK,GAAG,GAAG,IAAI,GAAG,IAAI,CAAC;AACvB,KAAK,OAAO,GAAG,OAAO,GAAG,KAAK,CAAC;AAE/B,MAAM,WAAW,KAAM,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC1E,6BAA6B;IAC7B,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uDAAuD;IACvD,QAAQ,EAAE,OAAO,CAAC;CACnB;AAyBD,QAAA,MAAM,WAAW,2CAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}

package/dist/components/layout/Container.svelte

@@ -20,6 +20,7 @@ const { maxWidth = 'lg', children, ...rest }: Props = $props();
 
 <style>
   .container {
+    box-sizing: border-box;
     width: 100%;
     margin: 0 auto;
     padding-left: var(--smrt-spacing-4);

package/dist/components/layout/Grid.svelte

@@ -74,7 +74,7 @@ const isResponsive = $derived(
 const _gridColumns = $derived.by(() => {
   if (isResponsive) return undefined;
   if (columns === 'auto') {
-    return 'repeat(auto-fill, minmax(300px, 1fr))';
+    return 'repeat(auto-fill, minmax(min(300px, 100%), 1fr))';
   }
   return `repeat(${columns}, 1fr)`;
 });
@@ -158,6 +158,7 @@ const gridClasses = $derived.by(() => {
 <style>
   .grid {
     display: grid;
+    min-width: 0;
   }
 
   .grid-header {

package/dist/components/layout/PageHeader.svelte

@@ -11,9 +11,9 @@
  *   title (for its phone top bar). smrt-svelte's `shellPageTrailFor()`
  *   computes such a trail from a nav.
  * - The crumb row carries `data-shell-breadcrumbs` and the title
- *   `data-shell-page-title`: on phones AdminShell hides the crumbs and
- *   visually hides the title, because its phone top bar shows the back arrow
- *   and the title instead.
+ *   `data-shell-page-title`: on phones AdminShell hides crumbs only when its
+ *   top bar declares `data-shell-page-navigation-replacement`, and visually
+ *   hides the title only with `data-shell-page-title-replacement`.
  * - No in-page back link: the crumbs (and the phone top bar) are the way
  *   back. `backHref` is kept only for pages outside such a shell.
  * - An editable title (`titleField`, e.g. an article's headline) renders

package/dist/components/layout/PageHeader.svelte.d.ts

@@ -10,9 +10,9 @@
  *   title (for its phone top bar). smrt-svelte's `shellPageTrailFor()`
  *   computes such a trail from a nav.
  * - The crumb row carries `data-shell-breadcrumbs` and the title
- *   `data-shell-page-title`: on phones AdminShell hides the crumbs and
- *   visually hides the title, because its phone top bar shows the back arrow
- *   and the title instead.
+ *   `data-shell-page-title`: on phones AdminShell hides crumbs only when its
+ *   top bar declares `data-shell-page-navigation-replacement`, and visually
+ *   hides the title only with `data-shell-page-title-replacement`.
  * - No in-page back link: the crumbs (and the phone top bar) are the way
  *   back. `backHref` is kept only for pages outside such a shell.
  * - An editable title (`titleField`, e.g. an article's headline) renders

package/dist/components/layout/PageLayout.svelte

@@ -0,0 +1,61 @@
+<script lang="ts">
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+import Container from './Container.svelte';
+
+type MaxWidth = 'sm' | 'md' | 'lg' | 'xl' | 'full';
+type Gap = 'sm' | 'md' | 'lg';
+
+export interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+  /** Maximum width of the page content. */
+  maxWidth?: MaxWidth;
+  /** Vertical space between the page's direct children. */
+  gap?: Gap;
+  /** CSS classes appended to the page content element. */
+  class?: string;
+  /** Page content. */
+  children: Snippet;
+}
+
+const {
+  maxWidth = 'lg',
+  gap = 'md',
+  class: className = '',
+  children,
+  ...rest
+}: Props = $props();
+</script>
+
+<Container {maxWidth} data-page-layout-container>
+  <div class="page-layout gap-{gap} {className}" data-page-layout {...rest}>
+    {@render children()}
+  </div>
+</Container>
+
+<style>
+  .page-layout {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr);
+    min-inline-size: 0;
+    padding-block: var(--smrt-spacing-5) var(--smrt-spacing-8);
+    overflow-wrap: anywhere;
+  }
+
+  .gap-sm {
+    gap: var(--smrt-spacing-3);
+  }
+
+  .gap-md {
+    gap: var(--smrt-spacing-5);
+  }
+
+  .gap-lg {
+    gap: var(--smrt-spacing-8);
+  }
+
+  @media (min-width: 640px) {
+    .page-layout {
+      padding-block: var(--smrt-spacing-6) var(--smrt-spacing-10);
+    }
+  }
+</style>

package/dist/components/layout/PageLayout.svelte.d.ts

@@ -0,0 +1,18 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type MaxWidth = 'sm' | 'md' | 'lg' | 'xl' | 'full';
+type Gap = 'sm' | 'md' | 'lg';
+export interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+    /** Maximum width of the page content. */
+    maxWidth?: MaxWidth;
+    /** Vertical space between the page's direct children. */
+    gap?: Gap;
+    /** CSS classes appended to the page content element. */
+    class?: string;
+    /** Page content. */
+    children: Snippet;
+}
+declare const PageLayout: import("svelte").Component<Props, {}, "">;
+type PageLayout = ReturnType<typeof PageLayout>;
+export default PageLayout;
+//# sourceMappingURL=PageLayout.svelte.d.ts.map

package/dist/components/layout/PageLayout.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLayout.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/layout/PageLayout.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAItD,KAAK,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AACnD,KAAK,GAAG,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9B,MAAM,WAAW,KAAM,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC1E,yCAAyC;IACzC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,yDAAyD;IACzD,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,QAAQ,EAAE,OAAO,CAAC;CACnB;AA4BD,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/components/layout/index.d.ts

@@ -1,6 +1,7 @@
 /**
  * Layout components - Page structure and containers
  */
+export { default as ActionGroup } from './ActionGroup.svelte';
 export { default as Container } from './Container.svelte';
 export { default as EmptyState } from './EmptyState.svelte';
 export { default as Footer } from './Footer.svelte';
@@ -8,6 +9,7 @@ export { default as Grid } from './Grid.svelte';
 export { default as Header } from './Header.svelte';
 export { default as Masthead } from './Masthead.svelte';
 export { default as PageHeader } from './PageHeader.svelte';
+export { default as PageLayout } from './PageLayout.svelte';
 export { getPageHeaderContext, type PageHeaderContext, type PageHeaderCrumb, type PageHeaderReport, setPageHeaderContext, } from './page-header-context.js';
 export { default as SummaryCard } from './SummaryCard.svelte';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/layout/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EACL,oBAAoB,EACpB,KAAK,iBAAiB,EACtB,KAAK,eAAe,EACpB,KAAK,gBAAgB,EACrB,oBAAoB,GACrB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/layout/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EACL,oBAAoB,EACpB,KAAK,iBAAiB,EACtB,KAAK,eAAe,EACpB,KAAK,gBAAgB,EACrB,oBAAoB,GACrB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/components/layout/index.js

@@ -1,6 +1,7 @@
 /**
  * Layout components - Page structure and containers
  */
+export { default as ActionGroup } from './ActionGroup.svelte';
 export { default as Container } from './Container.svelte';
 export { default as EmptyState } from './EmptyState.svelte';
 export { default as Footer } from './Footer.svelte';
@@ -8,5 +9,6 @@ export { default as Grid } from './Grid.svelte';
 export { default as Header } from './Header.svelte';
 export { default as Masthead } from './Masthead.svelte';
 export { default as PageHeader } from './PageHeader.svelte';
+export { default as PageLayout } from './PageLayout.svelte';
 export { getPageHeaderContext, setPageHeaderContext, } from './page-header-context.js';
 export { default as SummaryCard } from './SummaryCard.svelte';

package/dist/components/permissions/PermissionPicker.svelte

@@ -0,0 +1,213 @@
+<script lang="ts">
+import Checkbox from '../forms/Checkbox.svelte';
+import Input from '../forms/Input.svelte';
+
+export interface PermissionPickerItem {
+  id?: string;
+  slug: string;
+  name?: string;
+  description?: string;
+  category?: string;
+}
+
+export interface Props {
+  /** Permission catalog the host has authorized this actor to assign. */
+  permissions: readonly PermissionPickerItem[];
+  /** Permission slugs checked on first render or a server-validation retry. */
+  selected?: readonly string[];
+  /** Repeated native form field name. */
+  name?: string;
+  /** Visible label for the catalog. */
+  label?: string;
+  /** Supporting text below the label. */
+  description?: string;
+  /** Accessible label and placeholder for the progressive search. */
+  searchLabel?: string;
+  /** Prevents changes and native form submission while retaining readable state. */
+  disabled?: boolean;
+}
+
+interface PermissionGroup {
+  id: string;
+  label: string;
+  items: readonly PermissionPickerItem[];
+}
+
+let {
+  permissions,
+  selected = [],
+  name = 'permission',
+  label = 'Permissions',
+  description,
+  searchLabel = 'Search permissions',
+  disabled = false,
+}: Props = $props();
+
+let query = $state('');
+let localSelection = $state.raw<{
+  source: readonly string[];
+  slugs: Set<string>;
+} | null>(null);
+const instanceId = $props.id();
+const labelId = `permission-picker-label-${instanceId}`;
+const selectedSlugs = $derived(new Set(selected));
+const currentSelectedSlugs = $derived(
+  localSelection?.source === selected ? localSelection.slugs : selectedSlugs,
+);
+const normalizedQuery = $derived(normalize(query));
+const groups = $derived(groupPermissions(permissions));
+const visibleCount = $derived(
+  groups.reduce(
+    (count, group) =>
+      count +
+      group.items.filter((permission) => matches(permission, group.label))
+        .length,
+    0,
+  ),
+);
+
+function updateSelection(slug: string, checked: boolean): void {
+  const next = new Set(currentSelectedSlugs);
+  if (checked) next.add(slug);
+  else next.delete(slug);
+  localSelection = { source: selected, slugs: next };
+}
+
+function normalize(value: string): string {
+  return value.trim().replace(/\s+/g, ' ').toLocaleLowerCase();
+}
+
+function words(value: string): string {
+  const spaced = value
+    .replace(/[._-]+/g, ' ')
+    .replace(/([a-z])([A-Z])/g, '$1 $2');
+  return spaced
+    ? spaced.charAt(0).toLocaleUpperCase() + spaced.slice(1)
+    : 'Other';
+}
+
+function categoryOf(permission: PermissionPickerItem): string {
+  const category = permission.category?.trim();
+  if (category) return category;
+  return words(permission.slug.split('.')[0] ?? '');
+}
+
+function groupPermissions(
+  catalog: readonly PermissionPickerItem[],
+): PermissionGroup[] {
+  const byCategory = new Map<string, PermissionPickerItem[]>();
+  for (const permission of catalog) {
+    const category = categoryOf(permission);
+    const group = byCategory.get(category) ?? [];
+    group.push(permission);
+    byCategory.set(category, group);
+  }
+  return [...byCategory.entries()]
+    .sort(([left], [right]) => left.localeCompare(right))
+    .map(([category, items], index) => ({
+      id: `permission-group-${index}`,
+      label: category,
+      items: [...items].sort((left, right) =>
+        left.slug.localeCompare(right.slug),
+      ),
+    }));
+}
+
+function displayName(permission: PermissionPickerItem): string {
+  return permission.name?.trim() || words(permission.slug);
+}
+
+function matches(permission: PermissionPickerItem, category: string): boolean {
+  if (!normalizedQuery) return true;
+  return normalize(
+    [
+      displayName(permission),
+      permission.slug,
+      permission.description ?? '',
+      category,
+    ].join(' '),
+  ).includes(normalizedQuery);
+}
+</script>
+
+<section class="permission-picker" aria-labelledby={labelId}>
+  <div class="heading">
+    <div>
+      <h2 id={labelId}>{label}</h2>
+      {#if description}<p>{description}</p>{/if}
+    </div>
+    <label class="search">
+      <span>{searchLabel}</span>
+      <Input
+        type="search"
+        value={query}
+        oninput={(event) => (query = event.currentTarget.value)}
+        placeholder={searchLabel}
+        autocomplete="off"
+      />
+    </label>
+  </div>
+
+  {#key selected}
+  <fieldset {disabled}>
+    <legend class="visually-hidden">{label}</legend>
+    <div class="groups">
+      {#each groups as group (group.label)}
+        {@const groupVisible = group.items.some((permission) => matches(permission, group.label))}
+        {@const selectedCount = group.items.filter((permission) => currentSelectedSlugs.has(permission.slug)).length}
+        <details class="group" open={normalizedQuery ? groupVisible : undefined} hidden={!groupVisible}>
+          <summary id={group.id}>
+            <span>{group.label}</span>
+            <span class="selected-count">{selectedCount} selected</span>
+          </summary>
+          <div class="choices">
+            {#each group.items as permission (permission.id ?? permission.slug)}
+              <div class="choice" hidden={!matches(permission, group.label)}>
+                <Checkbox
+                  {name}
+                  value={permission.slug}
+                  checked={selectedSlugs.has(permission.slug)}
+                  onchange={(event) => updateSelection(permission.slug, event.currentTarget.checked)}
+                  label={displayName(permission)}
+                  {disabled}
+                />
+                <code>{permission.slug}</code>
+                {#if permission.description}<p>{permission.description}</p>{/if}
+              </div>
+            {/each}
+          </div>
+        </details>
+      {/each}
+    </div>
+  </fieldset>
+  {/key}
+
+  {#if normalizedQuery && visibleCount === 0}
+    <p class="no-results" role="status">No permissions match “{query.trim()}”.</p>
+  {/if}
+</section>
+
+<style>
+  .permission-picker { display: grid; gap: var(--smrt-spacing-4); min-inline-size: 0; }
+  .heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--smrt-spacing-4); }
+  h2, p { margin: 0; }
+  h2 { color: var(--smrt-color-on-surface); font: var(--smrt-typography-title-large-font); }
+  .heading p, .choice p, code, .no-results { color: var(--smrt-color-on-surface-variant); font: var(--smrt-typography-body-small-font); }
+  .heading p { margin-block-start: var(--smrt-spacing-1); }
+  .search { display: grid; flex: 1 1 16rem; max-inline-size: 28rem; gap: var(--smrt-spacing-1); color: var(--smrt-color-on-surface); font: var(--smrt-typography-label-medium-font); }
+  fieldset { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
+  .groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr)); gap: var(--smrt-spacing-4); align-items: start; }
+  .group { min-inline-size: 0; border: 1px solid var(--smrt-color-outline-variant); border-radius: var(--smrt-radius-medium); background: var(--smrt-color-surface); }
+  summary { display: flex; min-block-size: 2.75rem; align-items: center; justify-content: space-between; gap: var(--smrt-spacing-3); padding: var(--smrt-spacing-3) var(--smrt-spacing-4); color: var(--smrt-color-on-surface); font: var(--smrt-typography-title-medium-font); cursor: pointer; }
+  summary:focus-visible { outline: 2px solid var(--smrt-color-primary); outline-offset: 2px; }
+  .selected-count { flex: 0 0 auto; color: var(--smrt-color-on-surface-variant); font: var(--smrt-typography-label-medium-font); }
+  .choices { display: grid; gap: var(--smrt-spacing-4); padding: 0 var(--smrt-spacing-4) var(--smrt-spacing-4); border-block-start: 1px solid var(--smrt-color-outline-variant); padding-block-start: var(--smrt-spacing-4); }
+  .choice { display: grid; min-inline-size: 0; gap: var(--smrt-spacing-1); }
+  .choice :global(.checkbox) { min-inline-size: 0; }
+  .choice :global(.checkbox__label), code, .choice p { overflow-wrap: anywhere; }
+  code { padding-inline-start: calc(1.125rem + var(--smrt-spacing-2)); }
+  .choice p { padding-inline-start: calc(1.125rem + var(--smrt-spacing-2)); }
+  .no-results { padding: var(--smrt-spacing-4); border-radius: var(--smrt-radius-medium); background: var(--smrt-color-surface-container-low); }
+  .visually-hidden { position: absolute; inline-size: 1px; block-size: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
+  [hidden] { display: none; }
+</style>

package/dist/components/permissions/PermissionPicker.svelte.d.ts

@@ -0,0 +1,27 @@
+export interface PermissionPickerItem {
+    id?: string;
+    slug: string;
+    name?: string;
+    description?: string;
+    category?: string;
+}
+export interface Props {
+    /** Permission catalog the host has authorized this actor to assign. */
+    permissions: readonly PermissionPickerItem[];
+    /** Permission slugs checked on first render or a server-validation retry. */
+    selected?: readonly string[];
+    /** Repeated native form field name. */
+    name?: string;
+    /** Visible label for the catalog. */
+    label?: string;
+    /** Supporting text below the label. */
+    description?: string;
+    /** Accessible label and placeholder for the progressive search. */
+    searchLabel?: string;
+    /** Prevents changes and native form submission while retaining readable state. */
+    disabled?: boolean;
+}
+declare const PermissionPicker: import("svelte").Component<Props, {}, "">;
+type PermissionPicker = ReturnType<typeof PermissionPicker>;
+export default PermissionPicker;
+//# sourceMappingURL=PermissionPicker.svelte.d.ts.map

package/dist/components/permissions/PermissionPicker.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionPicker.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/permissions/PermissionPicker.svelte.ts"],"names":[],"mappings":"AAOA,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,KAAK;IACpB,uEAAuE;IACvE,WAAW,EAAE,SAAS,oBAAoB,EAAE,CAAC;IAC7C,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC7B,uCAAuC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mEAAmE;IACnE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA+JD,QAAA,MAAM,gBAAgB,2CAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/currency.d.ts

@@ -0,0 +1,3 @@
+/** ISO 4217 currency metadata shared by domain packages and UI components. */
+export { ISO_4217_MINOR_UNITS } from './components/display/currency-metadata.js';
+//# sourceMappingURL=currency.d.ts.map

package/dist/currency.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"currency.d.ts","sourceRoot":"","sources":["../src/currency.ts"],"names":[],"mappings":"AAAA,8EAA8E;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC"}

package/dist/currency.js

@@ -0,0 +1,2 @@
+/** ISO 4217 currency metadata shared by domain packages and UI components. */
+export { ISO_4217_MINOR_UNITS } from './components/display/currency-metadata.js';

package/dist/index.d.ts

@@ -18,6 +18,7 @@ export { default as MembershipCard } from './components/memberships/MembershipCa
 export { default as MembershipList } from './components/memberships/MembershipList.svelte';
 export * from './components/nav/index.js';
 export { default as PermissionCheck } from './components/permissions/PermissionCheck.svelte';
+export { default as PermissionPicker } from './components/permissions/PermissionPicker.svelte';
 export { default as RoleBadge } from './components/roles/RoleBadge.svelte';
 export { default as RoleSelector } from './components/roles/RoleSelector.svelte';
 export * from './components/ui/index.js';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,EACL,iBAAiB,EACjB,gBAAgB,EAChB,aAAa,EACb,UAAU,GACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,cAAc,gCAAgC,CAAC;AAE/C,cAAc,4BAA4B,CAAC;AAE3C,cAAc,+BAA+B,CAAC;AAE9C,cAAc,gCAAgC,CAAC;AAE/C,cAAc,8BAA8B,CAAC;AAE7C,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,gDAAgD,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,gDAAgD,CAAC;AAE3F,cAAc,2BAA2B,CAAC;AAE1C,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,iDAAiD,CAAC;AAE7F,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAEjF,cAAc,0BAA0B,CAAC;AAEzC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,kBAAkB,CAAC;AAEjC,YAAY,EAAE,WAAW,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAElE,mBAAmB,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,EACL,iBAAiB,EACjB,gBAAgB,EAChB,aAAa,EACb,UAAU,GACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,cAAc,gCAAgC,CAAC;AAE/C,cAAc,4BAA4B,CAAC;AAE3C,cAAc,+BAA+B,CAAC;AAE9C,cAAc,gCAAgC,CAAC;AAE/C,cAAc,8BAA8B,CAAC;AAE7C,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,gDAAgD,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,gDAAgD,CAAC;AAE3F,cAAc,2BAA2B,CAAC;AAE1C,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,iDAAiD,CAAC;AAC7F,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,kDAAkD,CAAC;AAE/F,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAEjF,cAAc,0BAA0B,CAAC;AAEzC,cAAc,qBAAqB,CAAC;AAEpC,cAAc,kBAAkB,CAAC;AAEjC,YAAY,EAAE,WAAW,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAElE,mBAAmB,oBAAoB,CAAC"}

package/dist/index.js

@@ -27,6 +27,7 @@ export { default as MembershipList } from './components/memberships/MembershipLi
 export * from './components/nav/index.js';
 // Permission components
 export { default as PermissionCheck } from './components/permissions/PermissionCheck.svelte';
+export { default as PermissionPicker } from './components/permissions/PermissionPicker.svelte';
 // Role components (domain-agnostic — typed against smrt-types contracts)
 export { default as RoleBadge } from './components/roles/RoleBadge.svelte';
 export { default as RoleSelector } from './components/roles/RoleSelector.svelte';

package/dist/svelte/playground/PermissionPickerPreview.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+import PermissionPicker from '../../components/permissions/PermissionPicker.svelte';
+
+const permissions = [
+  { slug: 'projects.read', name: 'View projects', category: 'Projects' },
+  { slug: 'projects.update', name: 'Update projects', category: 'Projects' },
+  {
+    slug: 'tenant.settings.read',
+    name: 'View workspace settings',
+    description: 'Review the active workspace configuration.',
+    category: 'Workspace',
+  },
+  {
+    slug: 'tenant.settings.manage',
+    name: 'Manage workspace settings',
+    category: 'Workspace',
+  },
+];
+</script>
+
+<form>
+  <PermissionPicker
+    {permissions}
+    selected={['projects.read', 'tenant.settings.read']}
+    description="Choose the capabilities assigned to this role."
+  />
+</form>

package/dist/svelte/playground/PermissionPickerPreview.svelte.d.ts

@@ -0,0 +1,19 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const PermissionPickerPreview: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type PermissionPickerPreview = InstanceType<typeof PermissionPickerPreview>;
+export default PermissionPickerPreview;
+//# sourceMappingURL=PermissionPickerPreview.svelte.d.ts.map

package/dist/svelte/playground/PermissionPickerPreview.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionPickerPreview.svelte.d.ts","sourceRoot":"","sources":["../../../src/svelte/playground/PermissionPickerPreview.svelte.ts"],"names":[],"mappings":"AA+BA,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,uBAAuB;;kBAA+E,CAAC;AAC3F,KAAK,uBAAuB,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,CAAC;AAC9E,eAAe,uBAAuB,CAAC"}

package/dist/svelte/playground.d.ts

@@ -2,7 +2,19 @@ declare const _default: {
     packageName: string;
     displayName: string;
     description: string;
-    entries: {
+    entries: ({
+        id: string;
+        title: string;
+        description: string;
+        loadComponent: () => Promise<typeof import("./playground/PermissionPickerPreview.svelte")>;
+        order: number;
+        tags: string[];
+        modes: {
+            mock: {
+                label: string;
+            };
+        };
+    } | {
         id: string;
         title: string;
         description: string;
@@ -14,7 +26,7 @@ declare const _default: {
                 label: string;
             };
         };
-    }[];
+    })[];
 };
 export default _default;
 //# sourceMappingURL=playground.d.ts.map

package/dist/svelte/playground.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"playground.d.ts","sourceRoot":"","sources":["../../src/svelte/playground.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAUA,wBA+FE"}
+{"version":3,"file":"playground.d.ts","sourceRoot":"","sources":["../../src/svelte/playground.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,wBAyGE"}

package/dist/svelte/playground.js

@@ -5,11 +5,21 @@ const loadFeedback = () => import('./playground/FeedbackPreview.svelte');
 const loadCollections = () => import('./playground/CollectionsPreview.svelte');
 const loadCalendar = () => import('./playground/CalendarPreview.svelte');
 const loadCapture = () => import('./playground/CapturePreview.svelte');
+const loadPermissionPicker = () => import('./playground/PermissionPickerPreview.svelte');
 export default {
     packageName: '@happyvertical/smrt-ui',
     displayName: 'UI Foundation',
     description: 'Provider-free controls and data primitives rendered in the active s-m-r-t theme.',
     entries: [
+        {
+            id: 'permission-picker',
+            title: 'Permission Picker',
+            description: 'Grouped, searchable native-form permission grants with retained server retry selections.',
+            loadComponent: loadPermissionPicker,
+            order: 9,
+            tags: ['forms', 'permissions', 'roles', 'search'],
+            modes: { mock: { label: 'Interactive' } },
+        },
         {
             id: 'code-selectors',
             title: 'Currency, Country & Province',

package/dist/themes/README.md

@@ -55,6 +55,7 @@ export { brandTheme };
 <!-- +layout.svelte -->
 <script>
   import { ThemeProvider } from '@happyvertical/smrt-ui/themes';
+  import '@happyvertical/smrt-ui/themes/styles/base.css';
   import '@happyvertical/smrt-ui/themes/styles/all.css';
   import '$lib/themes/brand'; // Import to register
 </script>
@@ -244,6 +245,7 @@ Best for static sites or when you want minimal JavaScript overhead.
 <!-- +layout.svelte -->
 <script>
   // Import only the theme you need
+  import '@happyvertical/smrt-ui/themes/styles/base.css';
   import '@happyvertical/smrt-ui/themes/styles/material.css';
 </script>
 
@@ -276,6 +278,9 @@ For maximum performance, use CSS only with media queries:
 Import the theme styles in your app entry point:
 
 ```ts
+// Recommended application sizing, surface, and typography defaults
+import '@happyvertical/smrt-ui/themes/styles/base.css';
+
 // Import all themes (for runtime switching)
 import '@happyvertical/smrt-ui/themes/styles/all.css';
 

package/dist/themes/styles/base.css

@@ -0,0 +1,31 @@
+/**
+ * Application baseline for SMRT interfaces.
+ *
+ * Import this once at an application entry point, alongside the selected
+ * theme stylesheet. Components remain independently usable without it.
+ */
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+html,
+body {
+  min-block-size: 100%;
+  margin: 0;
+}
+
+body {
+  background: var(--smrt-color-background);
+  color: var(--smrt-color-on-background);
+  font-family: var(--smrt-font-family, Inter, system-ui, sans-serif);
+}
+
+button,
+input,
+select,
+textarea {
+  font: inherit;
+}

package/dist/themes/styles/index.d.ts

@@ -14,6 +14,8 @@
  * ```
  */
 export declare const themeStyles: {
+    /** Application sizing, surface, typography, and form-control baseline. */
+    readonly base: "./base.css";
     readonly material: "./material.css";
     readonly glass: "./glass.css";
     readonly studio: "./studio.css";

package/dist/themes/styles/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/themes/styles/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAKH,eAAO,MAAM,WAAW;;;;;;IAMtB,2FAA2F;;IAE3F,wFAAwF;;;CAGhF,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/themes/styles/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAKH,eAAO,MAAM,WAAW;IACtB,0EAA0E;;;;;;;IAO1E,2FAA2F;;IAE3F,wFAAwF;;;CAGhF,CAAC"}

package/dist/themes/styles/index.js

@@ -16,6 +16,8 @@
 // Note: CSS imports are handled by your bundler (Vite, Webpack, etc.)
 // These exports are for TypeScript module resolution
 export const themeStyles = {
+    /** Application sizing, surface, typography, and form-control baseline. */
+    base: './base.css',
     material: './material.css',
     glass: './glass.css',
     studio: './studio.css',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@happyvertical/smrt-ui",
-  "version": "0.54.4",
+  "version": "0.55.1",
   "smrtJsdoc": "strict",
   "description": "Domain-agnostic Svelte 5 UI runtime for SMRT: primitives, i18n client, theme system, and module UI registry",
   "type": "module",
@@ -70,6 +70,11 @@
       "import": "./dist/components/forms/form-retry/index.js",
       "default": "./dist/components/forms/form-retry/index.js"
     },
+    "./currency": {
+      "types": "./dist/currency.d.ts",
+      "import": "./dist/currency.js",
+      "default": "./dist/currency.js"
+    },
     "./i18n": {
       "types": "./dist/i18n/index.d.ts",
       "svelte": "./dist/i18n/index.js",
@@ -134,7 +139,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@happyvertical/smrt-types": "0.54.4",
+    "@happyvertical/smrt-types": "0.55.1",
     "esm-env": "^1.2.2"
   },
   "peerDependencies": {