@urbicon-ui/blocks 6.19.0 → 6.19.2

package/dist/components/CompositionBar/CompositionBar.svelte

@@ -406,7 +406,7 @@
   </div>
 
   <!-- Legend -->
-  {#if showLegend && legendPlacement !== 'none'}
+  {#if showLegend}
     <ul
       class={unstyled ? (slotClasses?.legend ?? '') : styles.legend({ class: slotClasses?.legend })}
     >

package/dist/components/CompositionBar/composition-bar.variants.d.ts

@@ -46,7 +46,6 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
         left: {
             wrapper: string;
         };
-        none: {};
     };
     isHovered: {
         true: {};
@@ -56,7 +55,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     wrapper: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -65,7 +64,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     barWrapper: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -74,7 +73,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     bar: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -83,7 +82,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     segment: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -92,7 +91,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     segmentRest: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -101,7 +100,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     tooltip: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -110,7 +109,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     tooltipLabel: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -119,7 +118,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     tooltipDetail: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -128,7 +127,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     legend: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -137,7 +136,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     legendItem: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -146,7 +145,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     legendDot: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -155,7 +154,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     legendLabel: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -164,7 +163,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     legendValue: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -173,7 +172,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     total: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
@@ -182,7 +181,7 @@ export declare const compositionBarVariants: (props?: import("../../utils/varian
     totalLabel: (props?: ({
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
-        legendPlacement?: "top" | "right" | "bottom" | "left" | "none" | undefined;
+        legendPlacement?: "top" | "right" | "bottom" | "left" | undefined;
         isHovered?: boolean | undefined;
     } & {
         class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;

package/dist/components/CompositionBar/composition-bar.variants.js

@@ -82,12 +82,14 @@ export const compositionBarVariants = tv({
                 legendDot: 'h-3 w-3'
             }
         },
+        // Where the legend sits relative to the bar. Whether it renders at all is a
+        // separate axis — the `showLegend` prop, consistent with the other charts —
+        // so there is deliberately no `none` here (it duplicated `showLegend={false}`).
         legendPlacement: {
             top: { wrapper: 'flex-col-reverse' },
             right: { wrapper: 'flex-row items-start gap-4' },
             bottom: { wrapper: 'flex-col' },
-            left: { wrapper: 'flex-row-reverse items-start gap-4' },
-            none: {}
+            left: { wrapper: 'flex-row-reverse items-start gap-4' }
         },
         isHovered: {
             true: {},

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

@@ -65,7 +65,7 @@ export interface CompositionBarProps extends Omit<CompositionBarVariants, 'isHov
     formatPercent?: (percent: number) => string;
     /** Default intent for items without their own `intent`/`color`. @default 'primary' */
     intent?: CompositionBarIntent;
-    /** Show the legend. @default true */
+    /** Show the legend. Position it with `legendPlacement`. @default true */
     showLegend?: boolean;
     /** Show percentages in legend and tooltip. @default true */
     showPercentages?: boolean;

package/dist/components/CurrencyInput/CurrencyInput.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
   import { Input } from '../../primitives/Input';
+  import { useI18n } from '@urbicon-ui/i18n';
   import type { CurrencyInputProps } from './index';
 
   let {
     value = $bindable(null),
-    locale = 'de-DE',
+    locale = 'auto',
     currency = 'EUR',
     symbolPosition = 'suffix',
     precision = 2,
@@ -15,9 +16,14 @@
     ...inputProps
   }: CurrencyInputProps = $props();
 
-  const resolvedLocale = $derived(
-    locale === 'auto' ? new Intl.NumberFormat().resolvedOptions().locale : locale
-  );
+  const i18n = useI18n();
+
+  // `'auto'` (the default) follows the active `<I18nProvider>` locale — SSR-safe
+  // (server and client resolve the same locale) and consistent with the rest of
+  // the library's number formatting (CompositionBar/Sankey read `i18n.locale`
+  // too). Falls back to the base locale (`en`) when no provider is mounted. An
+  // explicit BCP 47 string overrides it.
+  const resolvedLocale = $derived(locale === 'auto' ? i18n.locale : locale);
 
   const decimalSeparator = $derived(
     new Intl.NumberFormat(resolvedLocale).formatToParts(1.1).find((p) => p.type === 'decimal')

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

@@ -24,10 +24,11 @@ export type CurrencySymbolPosition = 'prefix' | 'suffix' | 'none';
  * @tag form
  * @related Input
  *
- * @example Default — Euro with German locale
+ * @example Default — follows the active i18n locale
  * ```svelte
  * <script>
- *   let priceCents = $state(1234_56); // 1.234,56 €
+ *   // "1.234,56 €" under a `de` provider, "1,234.56 €" under `en` (the default)
+ *   let priceCents = $state(1234_56);
  * </script>
  * <CurrencyInput label="Price" bind:value={priceCents} />
  * ```
@@ -68,15 +69,16 @@ export interface CurrencyInputProps extends Omit<InputProps, 'type' | 'value' |
      */
     name?: string;
     /**
-     * BCP 47 locale used for formatting (`Intl.NumberFormat`). Controls
-     * grouping separator (`.` vs `,`) and decimal separator. Pass `'auto'`
-     * to defer to the runtime locale (`Intl.NumberFormat().resolvedOptions().locale`)
-     * — i.e. the user's browser language. Note that the runtime locale on the
-     * server (Node) and in the browser typically differ, so SSR pages using
-     * `'auto'` may briefly show a different format on initial render before
-     * hydration. `currency` is intentionally **not** auto-detected, since it
-     * is orthogonal to locale (a `de-CH` user may still bill in EUR).
-     * @default 'de-DE'
+     * BCP 47 locale used for formatting (`Intl.NumberFormat`). Controls the
+     * grouping separator (`.` vs `,`) and decimal separator. Defaults to
+     * `'auto'`, which follows the active `<I18nProvider>` locale — SSR-safe
+     * (server and client resolve the same locale, no hydration flash) and
+     * consistent with the rest of the library's number formatting. Falls back
+     * to the base locale (`en`) when no provider is mounted. Pass an explicit
+     * BCP 47 string (e.g. `'de-DE'`, `'ja-JP'`) to override. `currency` is
+     * intentionally **not** auto-detected, since it is orthogonal to locale
+     * (a `de-CH` user may still bill in EUR).
+     * @default 'auto'
      */
     locale?: string;
     /**

package/dist/components/DatePicker/DatePicker.svelte

@@ -8,7 +8,7 @@
   import CalendarIconDefault from '../../icons/CalendarIcon.svelte';
   import CloseIconDefault from '../../icons/CloseIcon.svelte';
   import { useBlocksI18n } from '../..';
-  import { formatDate, parseDate, isDateAllowed } from './datepicker.engine';
+  import { formatDateInput, parseDateInput, isDateAllowed } from './datepicker.engine';
   import { coerceToDate, toDateInputValue } from '../../utils/date';
   import type { DatePickerProps } from '.';
 
@@ -65,7 +65,9 @@
   let parseError = $state<string | undefined>();
 
   const dateValue = $derived(coerceToDate(value));
-  const formattedValue = $derived(dateValue ? formatDate(dateValue, locale, displayFormat) : '');
+  const formattedValue = $derived(
+    dateValue ? formatDateInput(dateValue, locale, displayFormat) : ''
+  );
 
   // Single source of truth for what the input renders. The user-typed
   // draft sticks around while the input is focused *or* a parse error
@@ -136,7 +138,7 @@
       userDraft = null;
       return;
     }
-    const parsed = parseDate(trimmed, locale, displayFormat);
+    const parsed = parseDateInput(trimmed, locale, displayFormat);
     if (!parsed) {
       parseError = bt('datepicker.invalidDate');
       return;

package/dist/components/DatePicker/DateRangePicker.svelte

@@ -9,7 +9,7 @@
   import CalendarIconDefault from '../../icons/CalendarIcon.svelte';
   import CloseIconDefault from '../../icons/CloseIcon.svelte';
   import { useBlocksI18n } from '../..';
-  import { formatDateRange, parseDateRange, isDateAllowed } from './datepicker.engine';
+  import { formatDateRangeInput, parseDateRangeInput, isDateAllowed } from './datepicker.engine';
   import { toDateInputValue } from '../../utils/date';
   import type { DateRangePickerProps } from '.';
 
@@ -66,7 +66,7 @@
   let parseError = $state<string | undefined>();
 
   const formattedValue = $derived(
-    value ? formatDateRange(value.start, value.end, locale, displayFormat) : ''
+    value ? formatDateRangeInput(value.start, value.end, locale, displayFormat) : ''
   );
 
   const inputValue = $derived(
@@ -154,7 +154,7 @@
       userDraft = null;
       return;
     }
-    const parsed = parseDateRange(trimmed, locale, displayFormat);
+    const parsed = parseDateRangeInput(trimmed, locale, displayFormat);
     if (!parsed) {
       parseError = bt('datepicker.invalidRange');
       return;

package/dist/components/DatePicker/datepicker.engine.d.ts

@@ -14,7 +14,7 @@ export type DateFormatOptions = Intl.DateTimeFormatOptions;
  * Format a Date as a locale-aware string. Guards Invalid Date and Intl
  * errors with logging instead of silent fallback.
  */
-export declare function formatDate(date: Date, locale: string, options?: DateFormatOptions): string;
+export declare function formatDateInput(date: Date, locale: string, options?: DateFormatOptions): string;
 /**
  * Format a date range. Deliberately concatenates the two halves with a
  * fixed " – " (U+2013, en-dash with spaces) separator instead of
@@ -22,9 +22,9 @@ export declare function formatDate(date: Date, locale: string, options?: DateFor
  * shared components (year/month) and break round-trip parsing — the
  * range "Mar 15 – 22, 2026" cannot be split back into two valid dates
  * because the first half has no year. The fixed separator keeps
- * `formatDateRange` and `parseDateRange` symmetric.
+ * `formatDateRangeInput` and `parseDateRangeInput` symmetric.
  */
-export declare function formatDateRange(start: Date, end: Date, locale: string, options?: DateFormatOptions): string;
+export declare function formatDateRangeInput(start: Date, end: Date, locale: string, options?: DateFormatOptions): string;
 /**
  * Parse a single date from user input. Tries the locale's formatted mask
  * first (built via `Intl.DateTimeFormat#formatToParts`), then a strict
@@ -36,14 +36,14 @@ export declare function formatDateRange(start: Date, end: Date, locale: string,
  * weekday literals, or non-Gregorian calendars are NOT parseable — the
  * caller should rely on calendar-picker UX or accept ISO input only.
  */
-export declare function parseDate(input: string, locale: string, options?: DateFormatOptions): Date | null;
+export declare function parseDateInput(input: string, locale: string, options?: DateFormatOptions): Date | null;
 /**
  * Parse a date range string like "15.03.2026 – 22.03.2026". Splits on
- * the locale-aware range separator and parses each half with `parseDate`.
+ * the locale-aware range separator and parses each half with `parseDateInput`.
  * A single date with no separator is accepted as a single-day range
  * (`{ start: d, end: d }`). Rejects inverted ranges (start after end).
  */
-export declare function parseDateRange(input: string, locale: string, options?: DateFormatOptions): DateRange | null;
+export declare function parseDateRangeInput(input: string, locale: string, options?: DateFormatOptions): DateRange | null;
 export interface DateConstraints {
     minDate?: Date;
     maxDate?: Date;

package/dist/components/DatePicker/datepicker.engine.js

@@ -25,9 +25,9 @@ function isSameDay(a, b) {
  * Format a Date as a locale-aware string. Guards Invalid Date and Intl
  * errors with logging instead of silent fallback.
  */
-export function formatDate(date, locale, options) {
+export function formatDateInput(date, locale, options) {
     if (!isValid(date)) {
-        console.warn('[DatePicker] formatDate received Invalid Date', { date, locale });
+        console.warn('[DatePicker] formatDateInput received Invalid Date', { date, locale });
         return '';
     }
     try {
@@ -49,16 +49,16 @@ export function formatDate(date, locale, options) {
  * shared components (year/month) and break round-trip parsing — the
  * range "Mar 15 – 22, 2026" cannot be split back into two valid dates
  * because the first half has no year. The fixed separator keeps
- * `formatDateRange` and `parseDateRange` symmetric.
+ * `formatDateRangeInput` and `parseDateRangeInput` symmetric.
  */
-export function formatDateRange(start, end, locale, options) {
+export function formatDateRangeInput(start, end, locale, options) {
     if (!isValid(start) || !isValid(end)) {
-        console.warn('[DatePicker] formatDateRange received Invalid Date', { start, end, locale });
+        console.warn('[DatePicker] formatDateRangeInput received Invalid Date', { start, end, locale });
         return '';
     }
     const fmt = options ?? defaultFormat;
-    const s = formatDate(start, locale, fmt);
-    const e = formatDate(end, locale, fmt);
+    const s = formatDateInput(start, locale, fmt);
+    const e = formatDateInput(end, locale, fmt);
     if (!s || !e)
         return '';
     return `${s} – ${e}`;
@@ -191,7 +191,7 @@ function parseLocaleDate(input, locale, options) {
  * weekday literals, or non-Gregorian calendars are NOT parseable — the
  * caller should rely on calendar-picker UX or accept ISO input only.
  */
-export function parseDate(input, locale, options) {
+export function parseDateInput(input, locale, options) {
     const trimmed = input.trim();
     if (!trimmed)
         return null;
@@ -223,23 +223,23 @@ export function parseDate(input, locale, options) {
 const rangeSeparator = /\s+(?:-|\/|bis|to)\s+|\s*,\s+|\s*[–—−]\s*/i;
 /**
  * Parse a date range string like "15.03.2026 – 22.03.2026". Splits on
- * the locale-aware range separator and parses each half with `parseDate`.
+ * the locale-aware range separator and parses each half with `parseDateInput`.
  * A single date with no separator is accepted as a single-day range
  * (`{ start: d, end: d }`). Rejects inverted ranges (start after end).
  */
-export function parseDateRange(input, locale, options) {
+export function parseDateRangeInput(input, locale, options) {
     const trimmed = input.trim();
     if (!trimmed)
         return null;
     const parts = trimmed.split(rangeSeparator);
     if (parts.length === 1) {
-        const single = parseDate(parts[0], locale, options);
+        const single = parseDateInput(parts[0], locale, options);
         return single ? { start: single, end: single } : null;
     }
     if (parts.length !== 2)
         return null;
-    const start = parseDate(parts[0], locale, options);
-    const end = parseDate(parts[1], locale, options);
+    const start = parseDateInput(parts[0], locale, options);
+    const end = parseDateInput(parts[1], locale, options);
     if (!start || !end)
         return null;
     if (start.getTime() > end.getTime())

package/dist/components/DonutChart/DonutChart.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { getBlocksConfig, resolveSlotClasses } from '../../provider';
+  import { useBlocksI18n } from '../..';
   import type { DonutChartProps } from './index';
   import { chartSlotResolver } from '../../internal/charts/variants';
   import { arcPath, seriesColor, numberFormatter } from '../../internal/charts/utils';
@@ -23,6 +24,7 @@
   }: DonutChartProps = $props();
 
   const blocksConfig = getBlocksConfig();
+  const bt = useBlocksI18n();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
   const slotClasses = $derived(
     resolveSlotClasses(blocksConfig, 'DonutChart', preset, {}, slotClassesProp)
@@ -136,9 +138,9 @@
       <caption>{resolvedAriaLabel}</caption>
       <thead>
         <tr>
-          <th scope="col">Segment</th>
-          <th scope="col">Value</th>
-          <th scope="col">Share</th>
+          <th scope="col">{bt('chart.segment')}</th>
+          <th scope="col">{bt('chart.value')}</th>
+          <th scope="col">{bt('chart.share')}</th>
         </tr>
       </thead>
       <tbody>

package/dist/components/LineChart/LineChart.svelte

@@ -13,6 +13,7 @@
   } from '../../internal/charts/utils';
   import type { ChartPoint } from '../../internal/charts/utils';
   import ChartFrame from '../ChartFrame/ChartFrame.svelte';
+  import { useBlocksI18n } from '../..';
 
   let {
     data,
@@ -35,6 +36,7 @@
   }: LineChartProps = $props();
 
   const blocksConfig = getBlocksConfig();
+  const bt = useBlocksI18n();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
   const slotClasses = $derived(
     resolveSlotClasses(blocksConfig, 'LineChart', preset, {}, slotClassesProp)
@@ -47,7 +49,9 @@
   const resolvedSeries = $derived<ChartSeries[]>(
     seriesProp && seriesProp.length > 0
       ? seriesProp
-      : Array.from({ length: seriesCount }, (_, i) => ({ label: `Series ${i + 1}` }))
+      : Array.from({ length: seriesCount }, (_, i) => ({
+          label: bt('chart.series', { index: i + 1 })
+        }))
   );
 
   const fmt = $derived(formatValue ?? numberFormatter(locale));
@@ -174,9 +178,9 @@
       <caption>{resolvedAriaLabel}</caption>
       <thead>
         <tr>
-          <th scope="col">Category</th>
+          <th scope="col">{bt('chart.category')}</th>
           {#each resolvedSeries as s, i (s.label + ' ' + i)}
-            <th scope="col">{s.label || `Series ${i + 1}`}</th>
+            <th scope="col">{s.label || bt('chart.series', { index: i + 1 })}</th>
           {/each}
         </tr>
       </thead>

package/dist/components/Planner/Planner.svelte

@@ -154,8 +154,8 @@
   $effect(() => {
     const _today = controller.today;
     if (typeof window === 'undefined') return;
-    const now = new Date(); // eslint-disable-line svelte/prefer-svelte-reactivity
-    const midnight = new Date(now); // eslint-disable-line svelte/prefer-svelte-reactivity
+    const now = new Date();
+    const midnight = new Date(now);
     midnight.setHours(24, 0, 0, 0);
     const timeout = setTimeout(() => controller.refreshToday(), midnight.getTime() - now.getTime());
     return () => clearTimeout(timeout);
@@ -220,7 +220,8 @@
     goToToday: () => controller.goToToday(),
     goTo: (date) => controller.goTo(date),
     canGoBack: controller.canGoBack,
-    canGoForward: controller.canGoForward
+    canGoForward: controller.canGoForward,
+    canGoToToday: controller.canGoToToday
   });
 
   // --- Contexts: the controller IS the date-grid context the Scaffold reads;
@@ -249,6 +250,9 @@
     get canGoForward() {
       return controller.canGoForward;
     },
+    get canGoToToday() {
+      return controller.canGoToToday;
+    },
     get locale() {
       return locale;
     },

package/dist/components/Planner/PlannerHeader.svelte

@@ -60,7 +60,7 @@
         mint="none"
         class={ctx.slot('navButton')}
         onclick={() => ctx.goToToday()}
-        disabled={ctx.disabled}
+        disabled={!ctx.canGoToToday || ctx.disabled}
         aria-label={bt('planner.today')}
       >
         <CalendarDaysIcon size={16} />

package/dist/components/Planner/planner.types.d.ts

@@ -77,6 +77,8 @@ export interface PlannerHeaderContext {
     canGoBack: boolean;
     /** Whether forward-navigation is within bounds. */
     canGoForward: boolean;
+    /** Whether today is within `[minDate, maxDate]`; gate a custom Today control on it. */
+    canGoToToday: boolean;
 }
 /** Every styleable slot Planner exposes through `slotClasses`. */
 export type PlannerSlotName = 'base' | 'header' | 'headerTitle' | 'nav' | 'navButton' | 'grid' | 'weekdayHeader' | 'weekday' | 'weekNumber' | 'week' | 'cell' | 'cellHeader' | 'cellWeekday' | 'cellDate' | 'cellItems' | 'empty';
@@ -93,6 +95,7 @@ export interface PlannerContext {
     readonly weekNumber: number;
     readonly canGoBack: boolean;
     readonly canGoForward: boolean;
+    readonly canGoToToday: boolean;
     readonly locale: string;
     readonly disabled: boolean;
     navigate(delta: number): void;

package/dist/date/compare.d.ts

@@ -21,6 +21,14 @@ export declare function isSameDay(a: Date, b: Date): boolean;
 export declare function isWeekend(date: Date): boolean;
 /** Check whether a date falls within a range (inclusive on both ends, order-independent). */
 export declare function isInRange(date: Date, start: Date, end: Date): boolean;
+/**
+ * Clamp a date into optional `[minDate, maxDate]` day boundaries — the
+ * day-level sibling of `clampMonth`. Comparison is on calendar days (time is
+ * stripped from both sides), so a date already inside the range is returned
+ * unchanged (keeping its own time-of-day) while an out-of-range date snaps to
+ * local midnight of the nearest boundary. Either bound may be omitted.
+ */
+export declare function clampDate(date: Date, minDate?: Date, maxDate?: Date): Date;
 /** Check whether a date belongs to the given month and year. */
 export declare function isInMonth(date: Date, month: number, year: number): boolean;
 /**

package/dist/date/compare.js

@@ -35,6 +35,21 @@ export function isInRange(date, start, end) {
     const e = stripTime(end).getTime();
     return d >= Math.min(s, e) && d <= Math.max(s, e);
 }
+/**
+ * Clamp a date into optional `[minDate, maxDate]` day boundaries — the
+ * day-level sibling of `clampMonth`. Comparison is on calendar days (time is
+ * stripped from both sides), so a date already inside the range is returned
+ * unchanged (keeping its own time-of-day) while an out-of-range date snaps to
+ * local midnight of the nearest boundary. Either bound may be omitted.
+ */
+export function clampDate(date, minDate, maxDate) {
+    const day = stripTime(date);
+    if (minDate && day < stripTime(minDate))
+        return stripTime(minDate);
+    if (maxDate && day > stripTime(maxDate))
+        return stripTime(maxDate);
+    return date;
+}
 /** Check whether a date belongs to the given month and year. */
 export function isInMonth(date, month, year) {
     return date.getMonth() === month && date.getFullYear() === year;

package/dist/date/index.d.ts

@@ -12,7 +12,7 @@
  * import { getWeekNumber, eachDayOfRange, toIso } from '@urbicon-ui/blocks/date';
  * ```
  */
-export { daysBetween, isInMonth, isInRange, isSameDay, isWeekend, stripTime } from './compare.js';
+export { clampDate, daysBetween, isInMonth, isInRange, isSameDay, isWeekend, stripTime } from './compare.js';
 export { formatDate, formatDateFull, formatDateRange, formatDayTitle, formatMonthShort, formatMonthYear, formatWeekRange, formatWeekTitle, getWeekdayNames } from './format.js';
 export { clampMonth, daysInMonth, getMonthGrid, getWeekDates, getWeekNumber, getYearMonths } from './geometry.js';
 export { addDays, eachDayOfRange, endOfWeek, isoToDate, startOfWeek, toIso } from './range.js';

package/dist/date/index.js

@@ -12,7 +12,7 @@
  * import { getWeekNumber, eachDayOfRange, toIso } from '@urbicon-ui/blocks/date';
  * ```
  */
-export { daysBetween, isInMonth, isInRange, isSameDay, isWeekend, stripTime } from './compare.js';
+export { clampDate, daysBetween, isInMonth, isInRange, isSameDay, isWeekend, stripTime } from './compare.js';
 export { formatDate, formatDateFull, formatDateRange, formatDayTitle, formatMonthShort, formatMonthYear, formatWeekRange, formatWeekTitle, getWeekdayNames } from './format.js';
 export { clampMonth, daysInMonth, getMonthGrid, getWeekDates, getWeekNumber, getYearMonths } from './geometry.js';
 export { addDays, eachDayOfRange, endOfWeek, isoToDate, startOfWeek, toIso } from './range.js';