@kosdev-code/base-ui-components 0.0.3

package/styles/tokens/index.d.ts

@@ -0,0 +1,623 @@
+import { TagColor, COMPONENT_TOKENS } from './component-tokens';
+import { ExtractTokenString } from './common/types';
+import { getGlobalToken, getSemanticToken } from './common/token-getters';
+
+export { getGlobalToken, getSemanticToken };
+export { TagColor };
+export declare const getComponentTokenHelpers: <T extends readonly ("link" | "multi-select" | "shell-icon-button" | "file-picker" | "resizable-panels" | "table" | "artifact-store-settings" | "branded-header" | "ingredient-card" | "error-list-item" | "named-list-item" | "shell-menu" | "select-view-list" | "radio-button" | "combobox" | "version-list-container" | "version-list-header" | "toggle-container" | "toggle-track" | "toggle-thumb" | "textarea" | "tag" | "tab" | "text" | "label" | "label-with-action" | "label-with-content-link" | "button" | "select" | "option" | "segmented" | "named-section" | "named-section-header" | "modal" | "input" | "image-config-page-header" | "icon" | "icon-button" | "horizontal-rule" | "form" | "drawer" | "collapsible-list-container" | "collapsible-list-header-container" | "collapsible-list-toggled-container" | "collapsible-artifact" | "collapsible-artifact-version" | "checkbox" | "artifact-drawer" | "app-shell" | "actionable-blurb")[]>(namespaces: [...T]) => { [Key in keyof T]: (key: ExtractTokenString<{
+    readonly "multi-select": {
+        readonly "list-padding": string;
+        readonly "padding-x": string;
+        readonly "padding-y": string;
+        readonly "border-radius": string;
+        readonly border: string;
+        readonly "border-color": string;
+        readonly "select-all-border-color": string;
+        readonly "hover-border-color": string;
+        readonly gap: string;
+        readonly background: string;
+        readonly "item-padding-x": string;
+        readonly "item-padding-y": string;
+        readonly "item-gap": string;
+        readonly "item-hover-bg": string;
+        readonly "selected-item-padding-y": string;
+        readonly "selected-item-padding-x": string;
+        readonly "selected-item-gap": string;
+        readonly "selected-item-background": string;
+        readonly "selected-item-background-hover": string;
+        readonly "selected-item-radius": string;
+    };
+    readonly "shell-icon-button": {
+        padding: string;
+    };
+    readonly "file-picker": {
+        "background-color": string;
+        "background-color-accent": string;
+        "selected-background": string;
+        "header-x-padding": string;
+        "header-y-padding": string;
+        "header-border-size": string;
+        "header-gap": string;
+        "header-border-color": string;
+        "footer-padding-x": string;
+        "footer-padding-y": string;
+        "footer-controls-gap": string;
+        "footer-border-size": string;
+        "footer-border-color": string;
+        "search-bar-height": string;
+        "search-bar-border-size": string;
+        "search-bar-border-color": string;
+        "search-bar-nav-buttons-gap": string;
+        "search-bar-padding-x": string;
+        "search-bar-padding-y": string;
+        "search-bar-radius": string;
+        "search-bar-edit-button-width": string;
+        "search-bar-breadcrumb-padding-x": string;
+        "search-bar-breadcrumb-hover-border": string;
+        "search-bar-export-button-radius": string;
+        "search-bar-export-button-background": string;
+        "search-bar-export-button-background-disabled": string;
+        "nav-panel-y-padding": string;
+        "nav-panel-x-padding": string;
+        "nav-panel-gap": string;
+        "nav-panel-header-bottom-margin": string;
+        "nav-panel-section-gap": string;
+        "nav-panel-item-gap": string;
+        "nav-panel-item-y-padding": string;
+        "explorer-panel-right-gutter-size": string;
+        "explorer-panel-padding-y": string;
+        "explorer-panel-padding-x": string;
+        "explorer-panel-gap": string;
+        "explorer-panel-item-padding-x": string;
+        "explorer-panel-item-padding-y": string;
+        "explorer-panel-item-icon-gap-left": string;
+        "explorer-panel-item-icon-gap-right": string;
+        "explorer-panel-kab-background": string;
+        "preview-details-gap": string;
+        "preview-details-gap-small": string;
+        "preview-icon-size": string;
+        "preview-icon-y-padding": string;
+        "preview-icon-y-padding-small": string;
+        "preview-details-x-padding": string;
+        "preview-details-x-padding-small": string;
+        "preview-details-y-padding": string;
+        "preview-details-item-gap": string;
+        "preview-details-collapsible-bg": string;
+        "preview-details-collapsible-gap": string;
+        "preview-details-collapsible-y-padding": string;
+        "preview-details-collapsible-border-color": string;
+    };
+    readonly "resizable-panels": {
+        readonly "border-color": string;
+        readonly "border-color-hover": string;
+        readonly "border-color-drag": string;
+        readonly "handle-width": string;
+    };
+    readonly table: {
+        readonly "row-border-bottom-size": string;
+        readonly "border-color": string;
+        readonly "header-background-color-hover": string;
+        readonly "header-background-color": string;
+        readonly "cell-padding-x": string;
+        readonly "cell-padding-y": "11px";
+        readonly "cell-padding-right-sortable": string;
+        readonly "head-gap-sortable": string;
+        readonly "background-color": string;
+        readonly "head-font-size": string;
+        readonly "head-color": string;
+        readonly "head-font-weight": string;
+        readonly "cell-font-size": string;
+        readonly "cell-color": string;
+        readonly "cell-font-weight": string;
+        readonly "font-family": string;
+    };
+    readonly "artifact-store-settings": {
+        "row-columns-published": string;
+        "row-columns-market": string;
+        "row-divider-color": string;
+        "row-gap": string;
+        "header-padding": string;
+        "cell-padding": string;
+        "name-column-gap": string;
+    };
+    readonly "branded-header": {
+        "startColor-settings": string;
+        "startColor-devices": string;
+        "startColor-tools": string;
+        "startColor-performance": string;
+        "endColor-viewBrowse": string;
+        "endColor-configure": string;
+        "endColor-manage": string;
+        "endColor-troubleshoot": string;
+        "endColor-store": string;
+        "endColor-main": string;
+        "border-bottom-size": string;
+        "border-bottom-color": string;
+        "background-color": string;
+        "column-gap": string;
+        "padding-x": string;
+        "padding-y": string;
+        "badge-size": string;
+        "badge-radius": string;
+        "line-height": string;
+        "info-column-gap": string;
+        "text-wrapper-gap": string;
+    };
+    readonly "ingredient-card": {
+        border: string;
+        "border-color": string;
+        "border-color-selected": string;
+        padding: string;
+        "padding-small": string;
+        "border-radius": string;
+        "row-gap": string;
+        "column-gap": string;
+    };
+    readonly "error-list-item": {
+        "row-gap": string;
+        "icon-column-width": string;
+        "padding-x": string;
+        "padding-y": string;
+        "background-color": string;
+        "background-color-overview": string;
+        "background-color-hover": string;
+        "background-color-overview-hover": string;
+        "border-color": string;
+        "border-radius": string;
+    };
+    readonly "named-list-item": {
+        readonly "column-gap": string;
+        readonly "row-gap": string;
+        readonly "color-selected": string;
+        readonly "background-color-selected": string;
+        readonly "padding-y": string;
+        readonly "padding-right": string;
+        readonly "padding-left": string;
+        readonly "subtext-padding-with-icon": string;
+    };
+    readonly "shell-menu": {
+        readonly "padding-x": string;
+        readonly "link-gap": string;
+        readonly "section-gap": string;
+        readonly "link-padding-y": string;
+        readonly "link-padding-x": string;
+    };
+    readonly "select-view-list": {
+        readonly "item-height": string;
+        readonly "padding-left": string;
+        readonly "padding-right": string;
+        readonly "border-width": string;
+        readonly "border-color": string;
+        readonly "background-color": string;
+        readonly "background-color-viewing": string;
+        readonly gap: string;
+    };
+    readonly "radio-button": {
+        readonly size: string;
+        readonly "check-size": string;
+        readonly "border-color": string;
+        readonly "background-color": string;
+        readonly "border-width": string;
+        readonly "border-radius": "50%";
+        readonly "border-color-checked": string;
+        readonly "background-color-disabled": string;
+    };
+    readonly combobox: {
+        "background-color-active": string;
+        "background-color-selected": string;
+        "background-color": string;
+        "border-radius": string;
+        "box-shadow": string;
+        "input-border-radius": string;
+        "option-column-gap": string;
+        "row-gap": string;
+        "selection-border-radius": string;
+        height: string;
+        padding: string;
+    };
+    readonly "version-list-container": {
+        gap: string;
+    };
+    readonly "version-list-header": {
+        gap: string;
+        itemBorderBottom: string;
+        itemBgColor: string;
+    };
+    readonly "toggle-container": {
+        gap: string;
+    };
+    readonly "toggle-track": {
+        "background-color-checked-disabled": string;
+        "background-color-checked-enabled": string;
+        "background-color-unchecked-disabled": string;
+        "background-color-unchecked-enabled": string;
+        "border-radius": string;
+        "padding-horizontal": string;
+        "padding-vertical": string;
+        "transition-duration": string;
+    };
+    readonly "toggle-thumb": {
+        "background-color-checked-enabled": string;
+        "background-color-checked-disabled": string;
+        "background-color-unchecked-enabled": string;
+        "background-color-unchecked-disabled": string;
+        "border-radius": string;
+        "box-shadow": string;
+        height: string;
+        width: string;
+        "transition-duration": string;
+    };
+    readonly textarea: {
+        padding: string;
+        "background-color": string;
+        "font-size": string;
+        "font-family": string;
+        "font-weight": string;
+        color: string;
+        "border-width": string;
+        "border-color": string;
+        "min-height": string;
+        "border-color-active": string;
+        "border-radius": string;
+        "border-color-invalid": string;
+        "background-color-disabled": string;
+        "color-disabled": string;
+    };
+    readonly tag: {
+        readonly "font-family": string;
+        readonly "bg-color-orange": string;
+        readonly "bg-color-light": string;
+        readonly "bg-color-green": string;
+        readonly "bg-color-red": string;
+        readonly "bg-color-purple": string;
+        readonly "bg-color-blue": string;
+        readonly "bg-color-disabled": string;
+        readonly "color-light": string;
+        readonly "color-dark": string;
+        readonly "color-disabled": string;
+        readonly "border-radius": string;
+        readonly "border-color": string;
+        readonly height: string;
+        readonly padding: "0px 4px";
+    };
+    readonly tab: {
+        readonly "trigger-padding-y": string;
+        readonly "trigger-padding-x": "0";
+        readonly "column-gap": string;
+        readonly "indicator-height": string;
+        readonly "indicator-color": string;
+        readonly "trigger-list-underline-color": string;
+        readonly "trigger-list-underline-height": string;
+    };
+    readonly text: {
+        readonly "font-family": string;
+        readonly "line-height": string;
+        readonly "h1-size": string;
+        readonly "h2-size": string;
+        readonly "body-size": string;
+        readonly "small-size": string;
+        readonly "font-weight-bold": string;
+        readonly "font-weight-normal": string;
+        readonly "color-dark": string;
+        readonly "color-light": string;
+        readonly "color-green": string;
+        readonly "color-red": string;
+        readonly "color-blue": string;
+        readonly "color-grey": string;
+        readonly "color-disabled": string;
+        readonly "color-yellow": string;
+        readonly "color-orange": string;
+    };
+    readonly label: {
+        gap: string;
+    };
+    readonly "label-with-action": {
+        gap: string;
+    };
+    readonly "label-with-content-link": {
+        color: string;
+    };
+    readonly button: {
+        xpadding: string;
+        ypadding: string;
+        br: string;
+        cursor: string;
+        "line-height": string;
+        "font-size": string;
+        "ypadding-small": string;
+        "border-width": string;
+        "font-weight": string;
+        "icon-margin": string;
+        "flex-direction": string;
+        bg: string;
+        "bg-hover": string;
+        "bg-active": string;
+        "bg-disabled": string;
+        border: string;
+        "border-hover": string;
+        "border-active": string;
+        "border-disabled": string;
+        color: string;
+        "color-hover": string;
+        "color-active": string;
+        "color-disabled": string;
+        "bg-secondary": string;
+        "bg-hover-secondary": string;
+        "bg-active-secondary": string;
+        "bg-disabled-secondary": string;
+        "border-secondary": string;
+        "border-hover-secondary": string;
+        "border-active-secondary": string;
+        "border-disabled-secondary": string;
+        "color-secondary": string;
+        "color-hover-secondary": string;
+        "color-active-secondary": string;
+        "color-disabled-secondary": string;
+        "bg-borderless": string;
+        "bg-hover-borderless": string;
+        "bg-active-borderless": string;
+        "bg-disabled-borderless": string;
+        "border-borderless": string;
+        "border-hover-borderless": string;
+        "border-active-borderless": string;
+        "border-disabled-borderless": string;
+        "color-borderless": string;
+        "color-hover-borderless": string;
+        "color-active-borderless": string;
+        "color-disabled-borderless": string;
+    };
+    readonly select: {
+        "font-size": string;
+        "border-size": string;
+        "border-color": string;
+    };
+    readonly option: {
+        "column-gap": string;
+        "font-family": string;
+        "font-size": string;
+        "bg-color-active": string;
+        "bg-color": string;
+        "font-weight-selected": string;
+        color: string;
+        "color-disabled": string;
+        padding: string;
+    };
+    readonly segmented: {
+        readonly "border-width": string;
+        readonly "border-radius": string;
+        readonly padding: string;
+        readonly "background-color": string;
+        readonly "border-color": string;
+        readonly "button-color": string;
+        readonly "button-color-disabled": string;
+        readonly "button-background-color": string;
+        readonly "button-background-color-hover": string;
+        readonly "button-background-color-active": string;
+        readonly "button-padding-y": "5px";
+        readonly "button-padding-x": "11px";
+        readonly "button-border-width": string;
+        readonly "button-border-color": "transparent";
+        readonly "button-font-size": string;
+        readonly "button-font-weight": string;
+        readonly "button-font-family": string;
+        readonly "button-gap": string;
+        readonly "indicator-background-color": string;
+        readonly "indicator-color": string;
+    };
+    readonly "named-section": {
+        readonly "border-radius": "2px";
+        readonly "border-width": "0.5px";
+        readonly "selected-border-width": "2px";
+        readonly "hover-border-width": string;
+        readonly "border-color": string;
+        readonly "selected-border-color": string;
+    };
+    readonly "named-section-header": {
+        readonly bg: string;
+        readonly "border-width": "0.5px";
+        readonly "border-color": string;
+        readonly "border-radius": "2px";
+        readonly padding: "8px 10px";
+        readonly gap: string;
+        readonly "row-gap": string;
+    };
+    readonly modal: {
+        "overlay-background": string;
+        "background-color": string;
+        headerPadding: string;
+        headerGap: string;
+        contentYPadding: string;
+        contentXPadding: string;
+        footerYPadding: string;
+        footerXPadding: string;
+        footerGap: string;
+        "border-width": string;
+        "border-color": string;
+    };
+    readonly link: {
+        "font-size-med": string;
+        "font-size-sm": string;
+        "font-size-lrg": string;
+        "font-size-xlrg": string;
+        "font-family": string;
+        "font-weight": string;
+        "line-height": string;
+        color: string;
+        "color-hover": string;
+        "color-active": string;
+        "color-disabled": string;
+    };
+    readonly input: {
+        "background-color-disabled": string;
+        "background-color": string;
+        "border-color-active": string;
+        "border-color-invalid": string;
+        "border-color": string;
+        "border-radius": string;
+        "border-width": string;
+        "color-disabled": string;
+        "font-family": string;
+        "font-size-small": string;
+        "font-size": string;
+        "font-weight": string;
+        "icon-left": string;
+        "line-height": string;
+        "padding-left-icon": string;
+        "padding-right-icon": string;
+        "padding-x": string;
+        "padding-y-small": string;
+        "padding-y": string;
+        color: string;
+        height: string;
+    };
+    readonly "image-config-page-header": {
+        gap: string;
+        "padding-bottom": string;
+        "title-gap": string;
+        bg: string;
+    };
+    readonly icon: {
+        "fill-black": string;
+        "fill-blue": string;
+        "fill-green": string;
+        "fill-grey": string;
+        "fill-orange": string;
+        "fill-purple": string;
+        "fill-red": string;
+        "fill-white": string;
+        "fill-yellow": string;
+        "size-lrg": string;
+        "size-med": string;
+        "size-sm": string;
+        "size-xlrg": string;
+        "size-xsm": string;
+        "size-xxlrg": string;
+        "size-xxsm": string;
+    };
+    readonly "icon-button": {
+        padding: string;
+        "border-radius": string;
+        "background-color": string;
+        "border-color": string;
+        cursor: string;
+        "disabled-cursor": string;
+        "badge-fill-black": string;
+        "badge-fill-blue": string;
+        "badge-fill-green": string;
+        "badge-fill-grey": string;
+        "badge-fill-orange": string;
+        "badge-fill-purple": string;
+        "badge-fill-red": string;
+        "badge-fill-white": string;
+        "badge-fill-yellow": string;
+        "badge-right": string;
+        "badge-top": string;
+        "active-background-color": string;
+    };
+    readonly "horizontal-rule": {
+        readonly "border-width": "0.5px";
+        readonly "border-color": string;
+    };
+    readonly form: {
+        "access-toggle-gap": string;
+        "access-toggle-height": string;
+        "error-message-top-margin": string;
+        "label-column-gap": string;
+        "label-error-color": string;
+        "label-font-family": string;
+        "label-font-size": string;
+        "label-font-weight": string;
+        "label-height": string;
+        "label-line-height": string;
+        "label-star-padding": string;
+        "label-width": string;
+        "label-area-padding": string;
+    };
+    readonly drawer: {
+        "header-height": string;
+        "header-bg": string;
+        "header-border-size": string;
+        "header-border-color": string;
+        "header-x-padding": string;
+        "border-width": string;
+        "border-color": string;
+        "left-drop-shadow": string;
+        "right-drop-shadow": string;
+    };
+    readonly "collapsible-list-container": {
+        "border-radius": string;
+        "border-width": string;
+        "border-color": string;
+    };
+    readonly "collapsible-list-header-container": {
+        "background-color": string;
+        gap: string;
+        padding: string;
+    };
+    readonly "collapsible-list-toggled-container": {
+        "background-color": string;
+        gap: string;
+        padding: string;
+    };
+    readonly "collapsible-artifact": {
+        "background-color": string;
+        "border-color": string;
+        "border-radius": string;
+        "border-width": string;
+        "button-left-or-right": string;
+        "button-top": string;
+        "name-and-desc-spacing": string;
+        "name-and-selected-spacing": string;
+        padding: string;
+    };
+    readonly "collapsible-artifact-version": {
+        "background-color-hover": string;
+        "background-color-inherited": string;
+        "background-color-selected": string;
+        "background-color": string;
+        "border-color-hover": string;
+        "border-color-inherited": string;
+        "border-color-selected": string;
+        "border-color": string;
+        "border-radius": string;
+        "border-width": string;
+        padding: string;
+    };
+    readonly checkbox: {
+        "background-color": string;
+        "border-color": string;
+        "background-color-disabled": string;
+        "background-color-checked": string;
+        "border-color-checked": string;
+        "background-color-checked-disabled": string;
+        "border-color-checked-disabled": string;
+        size: string;
+        "border-radius": string;
+        "border-width": string;
+    };
+    readonly "artifact-drawer": {
+        "background-color": string;
+        "border-color": string;
+        "border-width": string;
+        "padding-x": string;
+        "branch-padding-x": string;
+        "artifact-list-y-padding": string;
+        "artifact-items-gap": string;
+        "version-items-gap": string;
+        "version-list-padding": string;
+    };
+    readonly "app-shell": {
+        "bg-default": string;
+        "bg-offline": string;
+        "bg-locked": string;
+        color: string;
+    };
+    readonly "actionable-blurb": {
+        "row-gap": string;
+        "icon-column-width": string;
+    };
+}[T[Key]]>, asKey?: boolean) => string; };
+export declare const semanticStudioTokenCss: import('@emotion/utils').SerializedStyles;
+export declare const globalStudioTokenCss: import('@emotion/utils').SerializedStyles;
+export declare const componentStudioTokenCss: import('@emotion/utils').SerializedStyles;
+//# sourceMappingURL=index.d.ts.map

package/styles/tokens/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/libraries/base-ui-components/src/styles/tokens/index.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,cAAc,EACd,gBAAgB,EAEjB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAItD,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,CAAC;AACpB,eAAO,MAAM,wBAAwB,m7BAGvB,CAAC,GAAG,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBAIR,OAAO,KACZ,MAAM,GAMV,CAAC;AAeJ,eAAO,MAAM,sBAAsB,2CAIlC,CAAC;AAEF,eAAO,MAAM,oBAAoB,2CAQhC,CAAC;AAEF,eAAO,MAAM,uBAAuB,2CAMnC,CAAC"}

package/styles/tokens/semantic-tokens/color/index.d.ts

@@ -0,0 +1,28 @@
+export declare const SEMANTIC_COLOR_DEFINITION: {
+    readonly color: {
+        readonly white: string;
+        readonly grey10: string;
+        readonly grey15: string;
+        readonly grey20: string;
+        readonly grey30: string;
+        readonly grey40: string;
+        readonly grey50: string;
+        readonly grey60: string;
+        readonly grey65: string;
+        readonly grey70: string;
+        readonly grey80: string;
+        readonly black: string;
+        readonly primary: string;
+        readonly primaryLight: string;
+        readonly additional1: string;
+        readonly additional2: string;
+        readonly additional3: string;
+        readonly green: string;
+        readonly orange: string;
+        readonly red: string;
+        readonly purple: string;
+        readonly blue: string;
+        readonly yellow: string;
+    };
+};
+//# sourceMappingURL=index.d.ts.map

package/styles/tokens/semantic-tokens/color/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/libraries/base-ui-components/src/styles/tokens/semantic-tokens/color/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;CA4B5B,CAAC"}