@knime/kds-styles 2.2.0 → 2.4.0

package/dist/tokens/ts/fake-border.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly, this file was auto-generated
+ * from the design token sources in src/tokens.
+ */
+import type { KdsShadow } from "./types.js";
+export type KdsFakeBorderTokens = {
+    /**
+     * 0.5px inner border implemented as shadow for proper alignment in layout. re-uses the muted border color for light and dark. Used in value switch, array, preview list for a11y.
+     */
+    readonly "xs-muted": KdsShadow;
+};
+export declare const fakeBorder: KdsFakeBorderTokens;

package/dist/tokens/ts/fake-border.js

@@ -0,0 +1,24 @@
+/**
+ * Do not edit directly, this file was auto-generated
+ * from the design token sources in src/tokens.
+ */
+export const fakeBorder = {
+    "xs-muted": {
+        layers: [
+            {
+                offsetX: { value: 0, unit: "px" },
+                offsetY: { value: 0, unit: "px" },
+                blur: { value: 0, unit: "px" },
+                spread: { value: 0.5, unit: "px" },
+                color: {
+                    light: { h: 330, s: 0, l: 10.2, alpha: 0.2 },
+                    dark: { h: 330, s: 0, l: 99, alpha: 0.2 },
+                },
+            },
+        ],
+        css: {
+            value: "0 0 0 0.5px light-dark(hsl(330 0% 10.2% / 0.2), hsl(330 0% 99% / 0.2))",
+            variable: "var(--kds-fake-border-xs-muted)",
+        },
+    },
+};

package/dist/tokens/ts/font.d.ts

@@ -0,0 +1,278 @@
+/**
+ * Do not edit directly, this file was auto-generated
+ * from the design token sources in src/tokens.
+ */
+import type { KdsTypography } from "./types.js";
+export type KdsFontTokens = {
+    readonly base: {
+        readonly display: {
+            /**
+             * Can be used for large headlines in components that require a multi-line setup (xsmall).
+             */
+            readonly xsmall: KdsTypography;
+            /**
+             * Main Headlines on Hub and Website. Only used on fullscreen, not used inside Sidepanels (small).
+             */
+            readonly small: KdsTypography;
+            /**
+             * Main Headlines on Hub and Website. Only used on fullscreen, not used inside Sidepanels (medium).
+             */
+            readonly medium: KdsTypography;
+            /**
+             * Main Headlines on Hub and Website. Only used on fullscreen, not used inside Sidepanels (large).
+             */
+            readonly large: KdsTypography;
+            /**
+             * Main Headlines on Hub and Website. Only used on fullscreen, not used inside Sidepanels (xlarge).
+             */
+            readonly xlarge: KdsTypography;
+        };
+        readonly title: {
+            /**
+             * Single-line text, used inside component headers (xsmall).
+             */
+            readonly xsmall: KdsTypography;
+            /**
+             * Single-line text, used inside component headers (small).
+             */
+            readonly small: KdsTypography;
+            /**
+             * Single-line text, used inside component headers (small-strong).
+             */
+            readonly "small-strong": KdsTypography;
+            /**
+             * Single-line text, used inside component headers (medium).
+             */
+            readonly medium: KdsTypography;
+            /**
+             * Single-line text, used inside component headers (medium-strong).
+             */
+            readonly "medium-strong": KdsTypography;
+            /**
+             * Single-line text, used inside component headers (large).
+             */
+            readonly large: KdsTypography;
+            /**
+             * Single-line text, used inside component headers (large-strong).
+             */
+            readonly "large-strong": KdsTypography;
+        };
+        readonly body: {
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (small).
+             */
+            readonly small: KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (small-italic).
+             */
+            readonly "small-italic": KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (small-strong).
+             */
+            readonly "small-strong": KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (small-strong-italic).
+             */
+            readonly "small-strong-italic": KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (medium).
+             */
+            readonly medium: KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (medium).
+             */
+            readonly "medium-strong": KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (large).
+             */
+            readonly large: KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (large).
+             */
+            readonly "large-strong": KdsTypography;
+            /**
+             * Multiline text, used for paragraphs inside components, pages or panels (xlarge).
+             */
+            readonly xlarge: KdsTypography;
+        };
+        readonly subtext: {
+            /**
+             * Caption is used for disclosing extra information or smaller items in hierarchical relationships of text. Examples: Input helping Text, Character Count, # Columns in Twinlist, Datatypes (xsmall).
+             */
+            readonly xsmall: KdsTypography;
+            /**
+             * Caption is used for disclosing extra information or smaller items in hierarchical relationships of text. Examples: Input helping Text, Character Count, # Columns in Twinlist, Datatypes (small).
+             */
+            readonly small: KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (medium).
+             */
+            readonly medium: KdsTypography;
+        };
+        readonly interactive: {
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (xsmall-strong).
+             */
+            readonly "xsmall-strong": KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (small).
+             */
+            readonly small: KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (small-italic).
+             */
+            readonly "small-italic": KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (small-strong).
+             */
+            readonly "small-strong": KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (medium).
+             */
+            readonly medium: KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (medium-strong).
+             */
+            readonly "medium-strong": KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (large).
+             */
+            readonly large: KdsTypography;
+            /**
+             * Singleline text, used for button labels, breadcrumbs, chips and everything that is clickable (large-strong).
+             */
+            readonly "large-strong": KdsTypography;
+        };
+        readonly code: {
+            /**
+             * Singleline code, used for code snippets (xsmall).
+             */
+            readonly xsmall: KdsTypography;
+            /**
+             * Code blocks (small).
+             */
+            readonly small: KdsTypography;
+        };
+    };
+    readonly workflow: {
+        readonly annotation: {
+            readonly headline: {
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly H1: KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly H2: KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly H3: KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly H4: KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly H5: KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "H1-italic": KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "H2-italic": KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "H3-italic": KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "H4-italic": KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "H5-italic": KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly H6: KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "H6-italic": KdsTypography;
+            };
+            readonly body: {
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly small: KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "small-italic": KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "small-strong": KdsTypography;
+                /**
+                 * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+                 */
+                readonly "small-strong-Italic": KdsTypography;
+            };
+        };
+        readonly node: {
+            /**
+             * Typography for workflow node names.
+             */
+            readonly name: KdsTypography;
+            /**
+             * Typography for workflow node labels.
+             */
+            readonly label: KdsTypography;
+            /**
+             * Typography for workflow node status text.
+             */
+            readonly status: KdsTypography;
+        };
+    };
+    readonly dataapp: {
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly H1: KdsTypography;
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly H2: KdsTypography;
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly H3: KdsTypography;
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly H4: KdsTypography;
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly H5: KdsTypography;
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly H6: KdsTypography;
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly body: KdsTypography;
+        /**
+         * Fixed Fontformats for Workflow annotations and in Rich Text editor and Data Apps. Properties of this tokengroup cannot be changed easily because of their impact in layout of Workflows and Data Apps.
+         */
+        readonly "body-small": KdsTypography;
+    };
+};
+export declare const font: KdsFontTokens;