@baloise/ds-core 20.0.0-next.7 → 20.0.0-next.8

package/dist/types/components.d.ts

@@ -225,6 +225,9 @@ export namespace Components {
           * @default false
          */
         "ready": boolean;
+        /**
+          * Sets focus on the given elements using the app's focus-visible handling.
+         */
         "setFocus": (elements: HTMLElement[]) => Promise<void>;
     }
     /**
@@ -233,19 +236,17 @@ export namespace Components {
     interface DsBadge {
         /**
           * Define the color for the badge.
-          * @default ''
          */
-        "color": BadgeColor;
+        "color"?: BadgeColor;
         /**
           * Name of the icon to show. If an icon is present, text should be hidden.
           * @default ''
          */
         "icon": string;
         /**
-          * If `true` the badge is added to the top right corner of the card.
-          * @default ''
+          * Defines where the badge is positioned relative to its host, e.g. the top right corner of a card.
          */
-        "position": BadgePosition;
+        "position"?: BadgePosition;
         /**
           * If `true` the badge is added to the top right corner of the card.
           * @default false
@@ -253,9 +254,8 @@ export namespace Components {
         "pulse": boolean;
         /**
           * Define the size of badge. Small is recommended for tabs.
-          * @default ''
          */
-        "size": BadgeSize;
+        "size"?: BadgeSize;
     }
     /**
      * Button provides a clickable element for triggering actions, submitting forms, or navigating — supporting text, icons, or both.
@@ -531,9 +531,8 @@ export namespace Components {
         "bold": boolean;
         /**
           * If `true` the card text color becomes white.
-          * @default ''
          */
-        "color": HeadingColor;
+        "color"?: HeadingColor;
         /**
           * If `true` the card text color becomes white.
           * @default false
@@ -556,9 +555,8 @@ export namespace Components {
         "level": HeadingLevel;
         /**
           * Make the visual style mimic a specific heading level. This option allows you to make e.g. h1 visually look like h3, but still keep it h1 in the markup.
-          * @default ''
          */
-        "visualLevel": HeadingVisualLevel;
+        "visualLevel"?: HeadingVisualLevel;
     }
     /**
      * Carousel coordinates ds-carousel-item children into a scrollable, accessible slide interface. Supports an image slider and a product tile strip.
@@ -833,9 +831,8 @@ export namespace Components {
         "button": boolean;
         /**
           * Defines the color of the button variant. Only applicable if `button` is `true`.
-          * @default ''
          */
-        "buttonColor": ButtonColor;
+        "buttonColor"?: ButtonColor;
         "configChanged": (state: DsConfigState) => Promise<void>;
         /**
           * If `true` the close component will be disabled and not interactive.
@@ -849,9 +846,8 @@ export namespace Components {
         "inverted": boolean;
         /**
           * Define the size of badge. Small is recommended for tabs.
-          * @default ''
          */
-        "size": CloseSize;
+        "size"?: CloseSize;
     }
     /**
      * Content arranges content with flexible layout, alignment, and spacing options for structural layouts.
@@ -859,33 +855,25 @@ export namespace Components {
     interface DsContent {
         /**
           * Defines the positioning like center, end or default to start.
-          * @default ''
          */
-        "align": ContentAlignment;
-        /**
-          * @default ''
-         */
-        "alignment": StackAlignment;
+        "align"?: ContentAlignment;
+        "alignment"?: StackAlignment;
         /**
           * Defines the direction of the child elements. Default is column.
-          * @default ''
          */
-        "direction": StackDirection;
+        "direction"?: StackDirection;
         /**
           * **Deprecated:** Use direction instead.
-          * @default ''
          */
-        "layout": StackLayout;
+        "layout"?: StackLayout;
         /**
           * Defines the space between the child elements. Default is xx-small.
-          * @default ''
          */
-        "space": ContentSpace;
+        "space"?: ContentSpace;
         /**
           * Defines the text positioning like center, right or default to left.
-          * @default ''
          */
-        "textAlign": ContentTextAlignment;
+        "textAlign"?: ContentTextAlignment;
     }
     /**
      * Data displays a list of label-value pairs in a organized, accessible format.
@@ -1286,14 +1274,12 @@ export namespace Components {
     interface DsHeading {
         /**
           * The actual heading level used in the HTML markup.
-          * @default ''
          */
-        "autoLevel": HeadingVisualLevel;
+        "autoLevel"?: HeadingVisualLevel;
         /**
           * The theme type of the toast.
-          * @default ''
          */
-        "color": HeadingColor;
+        "color"?: HeadingColor;
         /**
           * If `true` the color gets inverted for dark backgrounds
           * @default false
@@ -1316,9 +1302,8 @@ export namespace Components {
         "shadow": boolean;
         /**
           * Defines at which position the heading has spacing.
-          * @default ''
          */
-        "space": HeadingSpace;
+        "space"?: HeadingSpace;
         /**
           * If `true` the heading gets displayed slimmer.
           * @default false
@@ -1326,9 +1311,8 @@ export namespace Components {
         "subtitle": boolean;
         /**
           * Make the visual style mimic a specific heading level. This option allows you to make e.g. h1 visually look like h3, but still keep it h1 in the markup.
-          * @default ''
          */
-        "visualLevel": HeadingVisualLevel;
+        "visualLevel"?: HeadingVisualLevel;
     }
     /**
      * Hint displays contextual help via an info-circle trigger button.
@@ -2880,9 +2864,8 @@ export namespace Components {
         "labelPosition": SpinnerLabelPosition;
         /**
           * Defines the size of the spinner. If `sm` the spinner is smaller.
-          * @default ''
          */
-        "size": SpinnerSize;
+        "size"?: SpinnerSize;
         /**
           * **Deprecated:** Use size="sm" instead.
           * @default false
@@ -2900,18 +2883,13 @@ export namespace Components {
     interface DsStack {
         /**
           * Defines the text positioning like center, right or default to start.
-          * @default ''
          */
-        "align": StackAlignment;
-        /**
-          * @default ''
-         */
-        "alignment": StackAlignment;
+        "align"?: StackAlignment;
+        "alignment"?: StackAlignment;
         /**
           * Defines the direction of the child elements. Default is column.
-          * @default ''
          */
-        "direction": StackDirection;
+        "direction"?: StackDirection;
         /**
           * Defines the width of the stack to be exactly the width of the content.
           * @default false
@@ -5059,7 +5037,6 @@ declare namespace LocalJSX {
     interface DsBadge {
         /**
           * Define the color for the badge.
-          * @default ''
          */
         "color"?: BadgeColor;
         /**
@@ -5068,8 +5045,7 @@ declare namespace LocalJSX {
          */
         "icon"?: string;
         /**
-          * If `true` the badge is added to the top right corner of the card.
-          * @default ''
+          * Defines where the badge is positioned relative to its host, e.g. the top right corner of a card.
          */
         "position"?: BadgePosition;
         /**
@@ -5079,7 +5055,6 @@ declare namespace LocalJSX {
         "pulse"?: boolean;
         /**
           * Define the size of badge. Small is recommended for tabs.
-          * @default ''
          */
         "size"?: BadgeSize;
     }
@@ -5381,7 +5356,6 @@ declare namespace LocalJSX {
         "bold"?: boolean;
         /**
           * If `true` the card text color becomes white.
-          * @default ''
          */
         "color"?: HeadingColor;
         /**
@@ -5406,7 +5380,6 @@ declare namespace LocalJSX {
         "level"?: HeadingLevel;
         /**
           * Make the visual style mimic a specific heading level. This option allows you to make e.g. h1 visually look like h3, but still keep it h1 in the markup.
-          * @default ''
          */
         "visualLevel"?: HeadingVisualLevel;
     }
@@ -5699,7 +5672,6 @@ declare namespace LocalJSX {
         "button"?: boolean;
         /**
           * Defines the color of the button variant. Only applicable if `button` is `true`.
-          * @default ''
          */
         "buttonColor"?: ButtonColor;
         /**
@@ -5714,7 +5686,6 @@ declare namespace LocalJSX {
         "inverted"?: boolean;
         /**
           * Define the size of badge. Small is recommended for tabs.
-          * @default ''
          */
         "size"?: CloseSize;
     }
@@ -5724,27 +5695,22 @@ declare namespace LocalJSX {
     interface DsContent {
         /**
           * Defines the positioning like center, end or default to start.
-          * @default ''
          */
         "align"?: ContentAlignment;
         /**
           * Defines the direction of the child elements. Default is column.
-          * @default ''
          */
         "direction"?: StackDirection;
         /**
           * **Deprecated:** Use direction instead.
-          * @default ''
          */
         "layout"?: StackLayout;
         /**
           * Defines the space between the child elements. Default is xx-small.
-          * @default ''
          */
         "space"?: ContentSpace;
         /**
           * Defines the text positioning like center, right or default to left.
-          * @default ''
          */
         "textAlign"?: ContentTextAlignment;
     }
@@ -6190,12 +6156,10 @@ declare namespace LocalJSX {
     interface DsHeading {
         /**
           * The actual heading level used in the HTML markup.
-          * @default ''
          */
         "autoLevel"?: HeadingVisualLevel;
         /**
           * The theme type of the toast.
-          * @default ''
          */
         "color"?: HeadingColor;
         /**
@@ -6220,7 +6184,6 @@ declare namespace LocalJSX {
         "shadow"?: boolean;
         /**
           * Defines at which position the heading has spacing.
-          * @default ''
          */
         "space"?: HeadingSpace;
         /**
@@ -6230,7 +6193,6 @@ declare namespace LocalJSX {
         "subtitle"?: boolean;
         /**
           * Make the visual style mimic a specific heading level. This option allows you to make e.g. h1 visually look like h3, but still keep it h1 in the markup.
-          * @default ''
          */
         "visualLevel"?: HeadingVisualLevel;
     }
@@ -6603,7 +6565,7 @@ declare namespace LocalJSX {
          */
         "onDsBlur"?: (event: DsInputSliderCustomEvent<InputSliderBlurDetail>) => void;
         /**
-          * Emitted when the value is committed (noUiSlider `change`, not `blur` — see ADR-0006/ADR-0007). Fires once per discrete drag/step, independent of focus.
+          * Emitted when the value is committed (noUiSlider `change`, not `blur` — see ADR-0010/ADR-0007). Fires once per discrete drag/step, independent of focus.
          */
         "onDsChange"?: (event: DsInputSliderCustomEvent<InputSliderChangeDetail>) => void;
         /**
@@ -7850,7 +7812,6 @@ declare namespace LocalJSX {
         "labelPosition"?: SpinnerLabelPosition;
         /**
           * Defines the size of the spinner. If `sm` the spinner is smaller.
-          * @default ''
          */
         "size"?: SpinnerSize;
         /**
@@ -7870,12 +7831,10 @@ declare namespace LocalJSX {
     interface DsStack {
         /**
           * Defines the text positioning like center, right or default to start.
-          * @default ''
          */
         "align"?: StackAlignment;
         /**
           * Defines the direction of the child elements. Default is column.
-          * @default ''
          */
         "direction"?: StackDirection;
         /**

package/dist/types/global/token-preview.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Live token preview: applies token changes posted by an embedding parent window (Toky's live
+ * preview sidebar) directly to `document.documentElement.style`, so a component's rendered
+ * output reflects in-progress token edits without a rebuild. No-ops outside an iframe, so it
+ * never activates during normal component consumption or Playwright visual-regression runs.
+ * No origin allowlist yet - MVP is localhost-only (see packages/core/CONTEXT.md).
+ */
+export declare const initializeTokenPreview: (win?: Window) => void;

package/dist/types/global/token-preview.types.d.ts

@@ -0,0 +1,20 @@
+/** See ADR-0021 and docs/plans/toky-live-token-preview-plan.md for the full contract. */
+export type TokenPreviewMessage = {
+    source: 'ds-token-preview';
+    type: 'set-tokens';
+    tokens: {
+        name: string;
+        value: string | null;
+    }[];
+} | {
+    source: 'ds-token-preview';
+    type: 'set-brand';
+    brand: string | null;
+} | {
+    source: 'ds-token-preview';
+    type: 'reset';
+};
+export type TokenPreviewReadyMessage = {
+    source: 'ds-token-preview';
+    type: 'ready';
+};

package/dist/types/utils/index.d.ts

@@ -10,6 +10,7 @@ export * from './form-control';
 export * from './has-value';
 export * from './helpers';
 export * from './is-iso-date';
+export * from './invalid-text-slot';
 export * from './is-value-empty';
 export * from './log';
 export * from './number';

package/dist/types/utils/invalid-text-slot.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Watches the host's `slot="invalid-text"` light-DOM child for content, calling
+ * `onChange` whenever "has non-empty content" flips. Covers both the node being
+ * added/removed/replaced and its text being mutated in place (e.g. AEM writing a
+ * validation message into an otherwise-empty node it owns).
+ *
+ * Returns a disconnect function to call from `disconnectedCallback`.
+ */
+export declare function watchInvalidTextSlot(el: HTMLElement, onChange: (hasContent: boolean) => void): () => void;