@quen-ui/theme 0.0.14 → 1.0.1

package/dist/componentTokens/generateDropdownTokens.d.ts

@@ -0,0 +1,18 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IDropdownTokens {
+    /** Background color of the dropdown panel */
+    background: string;
+    /**  Border radius applied to the dropdown panel corners */
+    radius: string;
+    /** Border color of the dropdown container */
+    borderColor: string;
+    /** Background color of a disabled dropdown item */
+    disabledBackground: string;
+    /** Text color of a disabled dropdown item */
+    disabledColor: string;
+    /** eft border color that appears on hover for active dropdown items */
+    borderLeftColor: string;
+    /** Background color of a dropdown item when hovered */
+    hoverBackground: string;
+}
+export declare const generateDropdownTokens: (theme: IQuenUITheme) => IDropdownTokens;

package/dist/componentTokens/generateDropdownTokens.es.js

@@ -0,0 +1,12 @@
+const generateDropdownTokens = (theme) => ({
+  radius: theme.components.Dropdown?.radius ?? theme.control.radius,
+  background: theme.components.Dropdown?.background ?? theme.colors.grayViolet[1],
+  borderColor: theme.components.Dropdown?.borderColor ?? theme.commonColorTokens.borderColor,
+  disabledBackground: theme.components.Dropdown?.disabledBackground ?? theme.commonColorTokens.disabledBackground,
+  disabledColor: theme.components.Dropdown?.disabledColor ?? theme.commonColorTokens.disabledColor,
+  borderLeftColor: theme.components.Dropdown?.borderLeftColor ?? theme.commonColorTokens.primaryBackground,
+  hoverBackground: theme.components.Dropdown?.hoverBackground ?? theme.colors.grayViolet[5]
+});
+export {
+  generateDropdownTokens
+};

package/dist/componentTokens/generateImageTokens.cjs.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateImageTokens = (theme) => ({
+  overlayBackground: theme.components.Image?.overlayBackground ?? theme.commonColorTokens.overlayBackground,
+  color: theme.components.Image?.color ?? "white"
+});
+exports.generateImageTokens = generateImageTokens;

package/dist/componentTokens/generateImageTokens.d.ts

@@ -0,0 +1,8 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IImageTokens {
+    /** Background color of the image overlay */
+    overlayBackground: string;
+    /** Text or icon color displayed over the image */
+    color: string;
+}
+export declare const generateImageTokens: (theme: IQuenUITheme) => IImageTokens;

package/dist/componentTokens/generateImageTokens.es.js

@@ -0,0 +1,7 @@
+const generateImageTokens = (theme) => ({
+  overlayBackground: theme.components.Image?.overlayBackground ?? theme.commonColorTokens.overlayBackground,
+  color: theme.components.Image?.color ?? "white"
+});
+export {
+  generateImageTokens
+};

package/dist/componentTokens/generateInputTokens.cjs.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateInputTokens = (theme) => ({
+  errorColor: theme.components.Input?.errorColor ?? theme.commonColorTokens.dangerColor,
+  disabledBackground: theme.components.Input?.disabledBackground ?? theme.commonColorTokens.disabledBackground,
+  disabledColor: theme.components.Input?.disabledColor ?? theme.commonColorTokens.disabledColor,
+  iconColor: theme.components.Input?.iconColor ?? theme.colors.gray[9],
+  borderColor: theme.components.Input?.borderColor ?? theme.commonColorTokens.borderColor,
+  color: theme.components.Input?.color ?? theme.textColor
+});
+exports.generateInputTokens = generateInputTokens;

package/dist/componentTokens/generateInputTokens.d.ts

@@ -0,0 +1,16 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IInputTokens {
+    /** Color used to indicate an error state */
+    errorColor: string;
+    /** Text color used when the input is disabled */
+    disabledColor: string;
+    /** Background color used when the input is disabled */
+    disabledBackground: string;
+    /** Color of icons displayed inside the input */
+    iconColor: string;
+    /** Default border color of the input */
+    borderColor: string;
+    /** Default text color inside the input  */
+    color: string;
+}
+export declare const generateInputTokens: (theme: IQuenUITheme) => IInputTokens;

package/dist/componentTokens/generateInputTokens.es.js

@@ -0,0 +1,11 @@
+const generateInputTokens = (theme) => ({
+  errorColor: theme.components.Input?.errorColor ?? theme.commonColorTokens.dangerColor,
+  disabledBackground: theme.components.Input?.disabledBackground ?? theme.commonColorTokens.disabledBackground,
+  disabledColor: theme.components.Input?.disabledColor ?? theme.commonColorTokens.disabledColor,
+  iconColor: theme.components.Input?.iconColor ?? theme.colors.gray[9],
+  borderColor: theme.components.Input?.borderColor ?? theme.commonColorTokens.borderColor,
+  color: theme.components.Input?.color ?? theme.textColor
+});
+export {
+  generateInputTokens
+};

package/dist/componentTokens/generateLayoutTokens.cjs.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateLayoutTokens = (theme) => ({
+  headerBackground: theme.components.Layout?.backgroundHeader ?? theme.colors[theme.primaryColor][7],
+  iconColor: theme.components.Layout?.iconColor ?? theme.colors.grayViolet[9],
+  borderColor: theme.components.Layout?.borderColor ?? theme.commonColorTokens.borderColor,
+  sidebarBackground: theme.components.Layout?.sidebarBackground ?? theme.colors.grayViolet[2]
+});
+exports.generateLayoutTokens = generateLayoutTokens;

package/dist/componentTokens/generateLayoutTokens.d.ts

@@ -0,0 +1,12 @@
+import { IQuenUITheme } from '../theme/types';
+export interface ILayoutTokens {
+    /**  Background color of the header section */
+    headerBackground: string;
+    /** Color of icons displayed in the layout */
+    iconColor: string;
+    /** Border color used throughout the layout */
+    borderColor: string;
+    /** Background color of the sidebar section  */
+    sidebarBackground: string;
+}
+export declare const generateLayoutTokens: (theme: IQuenUITheme) => ILayoutTokens;

package/dist/componentTokens/generateLayoutTokens.es.js

@@ -0,0 +1,9 @@
+const generateLayoutTokens = (theme) => ({
+  headerBackground: theme.components.Layout?.backgroundHeader ?? theme.colors[theme.primaryColor][7],
+  iconColor: theme.components.Layout?.iconColor ?? theme.colors.grayViolet[9],
+  borderColor: theme.components.Layout?.borderColor ?? theme.commonColorTokens.borderColor,
+  sidebarBackground: theme.components.Layout?.sidebarBackground ?? theme.colors.grayViolet[2]
+});
+export {
+  generateLayoutTokens
+};

package/dist/componentTokens/generateLoaderTokens.cjs.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateLoaderTokens = (theme) => ({
+  color: theme.components.Loader?.color ?? theme.colors[theme.primaryColor][5]
+});
+exports.generateLoaderTokens = generateLoaderTokens;

package/dist/componentTokens/generateLoaderTokens.d.ts

@@ -0,0 +1,6 @@
+import { IQuenUITheme } from '../theme/types';
+export interface ILoaderTokens {
+    /** The primary color used for the loader animation or indicator */
+    color: string;
+}
+export declare const generateLoaderTokens: (theme: IQuenUITheme) => ILoaderTokens;

package/dist/componentTokens/generateLoaderTokens.es.js

@@ -0,0 +1,6 @@
+const generateLoaderTokens = (theme) => ({
+  color: theme.components.Loader?.color ?? theme.colors[theme.primaryColor][5]
+});
+export {
+  generateLoaderTokens
+};

package/dist/componentTokens/generateLoadingOverlayTokens.cjs.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateLoadingOverlayTokens = (theme) => ({
+  background: theme.components.LoadingOverlay?.background ?? theme.commonColorTokens.overlayBackground,
+  blur: theme.components.LoadingOverlay?.blur ?? "blur(2px)"
+});
+exports.generateLoadingOverlayTokens = generateLoadingOverlayTokens;

package/dist/componentTokens/generateLoadingOverlayTokens.d.ts

@@ -0,0 +1,8 @@
+import { IQuenUITheme } from '../theme/types';
+export interface ILoadingOverlayTokens {
+    /** Background color of the overlay */
+    background: string;
+    /** Blur style of the overlay */
+    blur: string;
+}
+export declare const generateLoadingOverlayTokens: (theme: IQuenUITheme) => ILoadingOverlayTokens;

package/dist/componentTokens/generateLoadingOverlayTokens.es.js

@@ -0,0 +1,7 @@
+const generateLoadingOverlayTokens = (theme) => ({
+  background: theme.components.LoadingOverlay?.background ?? theme.commonColorTokens.overlayBackground,
+  blur: theme.components.LoadingOverlay?.blur ?? "blur(2px)"
+});
+export {
+  generateLoadingOverlayTokens
+};

package/dist/componentTokens/generateMenuTokens.cjs.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateMenuTokens = (theme) => ({
+  color: theme.components.Menu?.color ?? theme.textColor,
+  disabledColor: theme.components.Menu?.disabledColor ?? theme.commonColorTokens.disabledColor,
+  hoverBackground: theme.components.Menu?.hoverColor ?? theme.commonColorTokens.hoverBackground,
+  activeBackground: theme.components.Menu?.activeBackground ?? theme.commonColorTokens.activeBackground
+});
+exports.generateMenuTokens = generateMenuTokens;

package/dist/componentTokens/generateMenuTokens.d.ts

@@ -0,0 +1,12 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IMenuTokens {
+    /**  Default text color for menu items */
+    color: string;
+    /** Text color for disabled menu items */
+    disabledColor: string;
+    /** Background color for menu items when hovered */
+    hoverBackground: string;
+    /** Background color for active or selected menu items */
+    activeBackground: string;
+}
+export declare const generateMenuTokens: (theme: IQuenUITheme) => IMenuTokens;

package/dist/componentTokens/generateMenuTokens.es.js

@@ -0,0 +1,9 @@
+const generateMenuTokens = (theme) => ({
+  color: theme.components.Menu?.color ?? theme.textColor,
+  disabledColor: theme.components.Menu?.disabledColor ?? theme.commonColorTokens.disabledColor,
+  hoverBackground: theme.components.Menu?.hoverColor ?? theme.commonColorTokens.hoverBackground,
+  activeBackground: theme.components.Menu?.activeBackground ?? theme.commonColorTokens.activeBackground
+});
+export {
+  generateMenuTokens
+};

package/dist/componentTokens/generateMessageTokens.cjs.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateMessageTokens = (theme) => ({
+  radius: theme.components.Message?.radius ?? theme.control.radius,
+  borderColor: theme.components.Message?.borderColor ?? theme.commonColorTokens.borderColor,
+  padding: theme.components.Message?.padding ?? "0.5rem 1rem",
+  background: theme.components.Message?.background ?? theme.commonColorTokens.overlayBackground,
+  iconSuccessColor: theme.components.Message?.iconSuccessColor ?? theme.commonColorTokens.successColor,
+  iconWarningColor: theme.components.Message?.iconWarningColor ?? theme.commonColorTokens.warningColor,
+  iconErrorColor: theme.components.Message?.iconErrorColor ?? theme.commonColorTokens.dangerColor,
+  iconInfoColor: theme.components.Message?.iconInfoColor ?? theme.commonColorTokens.primaryBackground
+});
+exports.generateMessageTokens = generateMessageTokens;

package/dist/componentTokens/generateMessageTokens.d.ts

@@ -0,0 +1,20 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IMessageTokens {
+    /** Border radius of the tag */
+    radius: string;
+    /** Border color of the tag */
+    borderColor: string;
+    /** Padding applied inside the message */
+    padding: string;
+    /** Background color of the message */
+    background: string;
+    /** Color of the success icon inside the message */
+    iconSuccessColor: string;
+    /** Color of the warning icon inside the message */
+    iconWarningColor: string;
+    /** Color of the error icon inside the message */
+    iconErrorColor: string;
+    /** Color of the info icon inside the message */
+    iconInfoColor: string;
+}
+export declare const generateMessageTokens: (theme: IQuenUITheme) => IMessageTokens;

package/dist/componentTokens/generateMessageTokens.es.js

@@ -0,0 +1,13 @@
+const generateMessageTokens = (theme) => ({
+  radius: theme.components.Message?.radius ?? theme.control.radius,
+  borderColor: theme.components.Message?.borderColor ?? theme.commonColorTokens.borderColor,
+  padding: theme.components.Message?.padding ?? "0.5rem 1rem",
+  background: theme.components.Message?.background ?? theme.commonColorTokens.overlayBackground,
+  iconSuccessColor: theme.components.Message?.iconSuccessColor ?? theme.commonColorTokens.successColor,
+  iconWarningColor: theme.components.Message?.iconWarningColor ?? theme.commonColorTokens.warningColor,
+  iconErrorColor: theme.components.Message?.iconErrorColor ?? theme.commonColorTokens.dangerColor,
+  iconInfoColor: theme.components.Message?.iconInfoColor ?? theme.commonColorTokens.primaryBackground
+});
+export {
+  generateMessageTokens
+};

package/dist/componentTokens/generateModalTokens.cjs.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateModalTokens = (theme) => ({
+  overlayBackground: theme.components.Modal?.overlayBackground ?? theme.commonColorTokens.overlayBackground,
+  backgroundColor: theme.components.Modal?.backgroundColor ?? theme.colors.grayViolet[2]
+});
+exports.generateModalTokens = generateModalTokens;

package/dist/componentTokens/generateModalTokens.d.ts

@@ -0,0 +1,8 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IModalTokens {
+    /** Background color of the overlay layer behind the modal */
+    overlayBackground: string;
+    /** Background color of the modal content area */
+    backgroundColor: string;
+}
+export declare const generateModalTokens: (theme: IQuenUITheme) => IModalTokens;

package/dist/componentTokens/generateModalTokens.es.js

@@ -0,0 +1,7 @@
+const generateModalTokens = (theme) => ({
+  overlayBackground: theme.components.Modal?.overlayBackground ?? theme.commonColorTokens.overlayBackground,
+  backgroundColor: theme.components.Modal?.backgroundColor ?? theme.colors.grayViolet[2]
+});
+export {
+  generateModalTokens
+};

package/dist/componentTokens/generateNotificationTokens.cjs.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateNotificationTokens = (theme) => ({
+  background: theme.components.Modal?.backgroundColor ?? theme.colors.grayViolet[2],
+  radius: theme.components.Notification?.radius ?? theme.control.radius,
+  successColor: theme.components.Notification?.successColor ?? theme.commonColorTokens.successColor,
+  warningColor: theme.components.Notification?.warningColor ?? theme.commonColorTokens.warningColor,
+  errorColor: theme.components.Notification?.errorColor ?? theme.commonColorTokens.dangerColor,
+  infoColor: theme.components.Notification?.infoColor ?? theme.colors[theme.primaryColor][9]
+});
+exports.generateNotificationTokens = generateNotificationTokens;

package/dist/componentTokens/generateNotificationTokens.d.ts

@@ -0,0 +1,16 @@
+import { IQuenUITheme } from '../theme/types';
+export interface INotificationTokens {
+    /** The background color of the notification container */
+    background: string;
+    /** The border radius applied to the notification box */
+    radius: string;
+    /** The color used for success notifications */
+    successColor: string;
+    /** The color used for warning notifications */
+    warningColor: string;
+    /** The color used for error notifications */
+    errorColor: string;
+    /** The color used for informational notifications */
+    infoColor: string;
+}
+export declare const generateNotificationTokens: (theme: IQuenUITheme) => INotificationTokens;

package/dist/componentTokens/generateNotificationTokens.es.js

@@ -0,0 +1,11 @@
+const generateNotificationTokens = (theme) => ({
+  background: theme.components.Modal?.backgroundColor ?? theme.colors.grayViolet[2],
+  radius: theme.components.Notification?.radius ?? theme.control.radius,
+  successColor: theme.components.Notification?.successColor ?? theme.commonColorTokens.successColor,
+  warningColor: theme.components.Notification?.warningColor ?? theme.commonColorTokens.warningColor,
+  errorColor: theme.components.Notification?.errorColor ?? theme.commonColorTokens.dangerColor,
+  infoColor: theme.components.Notification?.infoColor ?? theme.colors[theme.primaryColor][9]
+});
+export {
+  generateNotificationTokens
+};

package/dist/componentTokens/generatePaginationTokens.cjs.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generatePaginationTokens = (theme) => ({
+  color: theme.components.Pagination?.color ?? theme.textColor,
+  borderColor: theme.components.Pagination?.borderColor ?? theme.commonColorTokens.borderColor,
+  radius: theme.components.Pagination?.radius ?? theme.control.radius,
+  activeBackground: theme.components.Pagination?.activeBackground ?? theme.commonColorTokens.activeBackground,
+  background: theme.components.Pagination?.background ?? theme.colors.grayViolet[3],
+  hoverBackground: theme.components.Pagination?.hoverBackground ?? theme.commonColorTokens.hoverBackground
+});
+exports.generatePaginationTokens = generatePaginationTokens;

package/dist/componentTokens/generatePaginationTokens.d.ts

@@ -0,0 +1,16 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IPaginationTokens {
+    /** The text color of pagination items */
+    color: string;
+    /** The border color of pagination items */
+    borderColor: string;
+    /** The border radius of pagination items */
+    radius: string;
+    /** The background color for the active pagination item */
+    activeBackground: string;
+    /** The default background color for pagination items */
+    background: string;
+    /** The background color when hovering over a pagination item */
+    hoverBackground: string;
+}
+export declare const generatePaginationTokens: (theme: IQuenUITheme) => IPaginationTokens;

package/dist/componentTokens/generatePaginationTokens.es.js

@@ -0,0 +1,11 @@
+const generatePaginationTokens = (theme) => ({
+  color: theme.components.Pagination?.color ?? theme.textColor,
+  borderColor: theme.components.Pagination?.borderColor ?? theme.commonColorTokens.borderColor,
+  radius: theme.components.Pagination?.radius ?? theme.control.radius,
+  activeBackground: theme.components.Pagination?.activeBackground ?? theme.commonColorTokens.activeBackground,
+  background: theme.components.Pagination?.background ?? theme.colors.grayViolet[3],
+  hoverBackground: theme.components.Pagination?.hoverBackground ?? theme.commonColorTokens.hoverBackground
+});
+export {
+  generatePaginationTokens
+};

package/dist/componentTokens/generateProgressTokens.cjs.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateProgressTokens = (theme) => ({
+  radius: theme.components.Progress?.radius ?? theme.control.radius
+});
+exports.generateProgressTokens = generateProgressTokens;

package/dist/componentTokens/generateProgressTokens.d.ts

@@ -0,0 +1,6 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IProgressTokens {
+    /** The border radius of the progress bar */
+    radius: string;
+}
+export declare const generateProgressTokens: (theme: IQuenUITheme) => IProgressTokens;

package/dist/componentTokens/generateProgressTokens.es.js

@@ -0,0 +1,6 @@
+const generateProgressTokens = (theme) => ({
+  radius: theme.components.Progress?.radius ?? theme.control.radius
+});
+export {
+  generateProgressTokens
+};

package/dist/componentTokens/generateRadioButtonTokens.cjs.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateRadioButtonTokens = (theme) => ({
+  radius: theme.components.Progress?.radius ?? theme.control.radius,
+  borderColor: theme.components.RadioButton?.borderColor ?? theme.commonColorTokens.borderColor,
+  disabledBackground: theme.components.RadioButton?.disabledBackground ?? theme.commonColorTokens.disabledBackground,
+  checkedBorderColor: theme.components.RadioButton?.checkedBorderColor ?? theme.commonColorTokens.primaryBackground,
+  disabledCheckedBorderColor: theme.components.RadioButton?.disabledCheckedBorderColor ?? theme.colors[theme.primaryColor][5],
+  checkedBackground: theme.components.RadioButton?.checkedBackground ?? theme.colors.grayViolet[4],
+  hoverBorderColor: theme.components.RadioButton?.hoverBorderColor ?? theme.commonColorTokens.hoverBackground,
+  errorColor: theme.components.RadioButton?.errorColor ?? theme.commonColorTokens.dangerColor,
+  borderErrorColor: theme.components.RadioButton?.borderErrorColor ?? theme.commonColorTokens.dangerBackground
+});
+exports.generateRadioButtonTokens = generateRadioButtonTokens;

package/dist/componentTokens/generateRadioButtonTokens.d.ts

@@ -0,0 +1,22 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IRadioButtonTokens {
+    /** The border radius of the radio button */
+    radius: string;
+    /** The default border color of the radio button */
+    borderColor: string;
+    /** Background color when the radio button is disabled */
+    disabledBackground: string;
+    /** Border color when the radio button is checked */
+    checkedBorderColor: string;
+    /** Border color when the radio button is checked and disabled */
+    disabledCheckedBorderColor: string;
+    /** Background color when the radio button is checked */
+    checkedBackground: string;
+    /** Border color when hovering over the radio button */
+    hoverBorderColor: string;
+    /** Color representing an error state */
+    errorColor: string;
+    /** Border color representing an error state */
+    borderErrorColor: string;
+}
+export declare const generateRadioButtonTokens: (theme: IQuenUITheme) => IRadioButtonTokens;

package/dist/componentTokens/generateRadioButtonTokens.es.js

@@ -0,0 +1,14 @@
+const generateRadioButtonTokens = (theme) => ({
+  radius: theme.components.Progress?.radius ?? theme.control.radius,
+  borderColor: theme.components.RadioButton?.borderColor ?? theme.commonColorTokens.borderColor,
+  disabledBackground: theme.components.RadioButton?.disabledBackground ?? theme.commonColorTokens.disabledBackground,
+  checkedBorderColor: theme.components.RadioButton?.checkedBorderColor ?? theme.commonColorTokens.primaryBackground,
+  disabledCheckedBorderColor: theme.components.RadioButton?.disabledCheckedBorderColor ?? theme.colors[theme.primaryColor][5],
+  checkedBackground: theme.components.RadioButton?.checkedBackground ?? theme.colors.grayViolet[4],
+  hoverBorderColor: theme.components.RadioButton?.hoverBorderColor ?? theme.commonColorTokens.hoverBackground,
+  errorColor: theme.components.RadioButton?.errorColor ?? theme.commonColorTokens.dangerColor,
+  borderErrorColor: theme.components.RadioButton?.borderErrorColor ?? theme.commonColorTokens.dangerBackground
+});
+export {
+  generateRadioButtonTokens
+};

package/dist/componentTokens/generateRichTextEditorTokens.cjs.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateRichTextEditorTokens = (theme) => ({
+  radius: theme.components.RichTextEditor?.radius ?? theme.control.radius,
+  padding: theme.components.RichTextEditor?.padding ?? "0.75rem",
+  borderColor: theme.components.RichTextEditor?.borderColor ?? theme.commonColorTokens.borderColor,
+  background: theme.components.RichTextEditor?.background ?? theme.colorBody
+});
+exports.generateRichTextEditorTokens = generateRichTextEditorTokens;

package/dist/componentTokens/generateRichTextEditorTokens.d.ts

@@ -0,0 +1,9 @@
+import { IQuenUITheme } from '../theme/types';
+export interface IRichTextEditorTokens {
+    /** Container corner radius */
+    radius: string;
+    padding: string;
+    borderColor: string;
+    background: string;
+}
+export declare const generateRichTextEditorTokens: (theme: IQuenUITheme) => IRichTextEditorTokens;

package/dist/componentTokens/generateRichTextEditorTokens.es.js

@@ -0,0 +1,9 @@
+const generateRichTextEditorTokens = (theme) => ({
+  radius: theme.components.RichTextEditor?.radius ?? theme.control.radius,
+  padding: theme.components.RichTextEditor?.padding ?? "0.75rem",
+  borderColor: theme.components.RichTextEditor?.borderColor ?? theme.commonColorTokens.borderColor,
+  background: theme.components.RichTextEditor?.background ?? theme.colorBody
+});
+export {
+  generateRichTextEditorTokens
+};

package/dist/componentTokens/generateSkeletonTokens.cjs.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateSkeletonTokens = (theme) => ({
+  background: theme.components.Skeleton?.background ?? theme.colors.grayViolet[5]
+});
+exports.generateSkeletonTokens = generateSkeletonTokens;

package/dist/componentTokens/generateSkeletonTokens.d.ts

@@ -0,0 +1,6 @@
+import { IQuenUITheme } from '../theme/types';
+export interface ISkeletonTokens {
+    /** Default background color of the skeleton */
+    background: string;
+}
+export declare const generateSkeletonTokens: (theme: IQuenUITheme) => ISkeletonTokens;

package/dist/componentTokens/generateSkeletonTokens.es.js

@@ -0,0 +1,6 @@
+const generateSkeletonTokens = (theme) => ({
+  background: theme.components.Skeleton?.background ?? theme.colors.grayViolet[5]
+});
+export {
+  generateSkeletonTokens
+};

package/dist/componentTokens/generateSliderTokens.cjs.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateSliderTokens = (theme) => ({
+  radius: theme.components.Slider?.radius ?? theme.control.radius,
+  trackBackgroundColor: theme.components.Slider?.trackBackground ?? theme.colors.grayViolet[5],
+  trackDisabledBackgroundColor: theme.components.Slider?.trackDisabledBackgroundColor ?? theme.commonColorTokens.disabledBackground,
+  progressDisabledBackgroundColor: theme.components.Slider?.progressDisabledBackgroundColor ?? theme.commonColorTokens.disabledColor,
+  height: theme.components.Slider?.height ?? "0.375rem",
+  markColor: theme.components.Slider?.markColor ?? theme.colors.grayViolet[9]
+});
+exports.generateSliderTokens = generateSliderTokens;

package/dist/componentTokens/generateSliderTokens.d.ts

@@ -0,0 +1,16 @@
+import { IQuenUITheme } from '../theme/types';
+export interface ISliderTokens {
+    /** Container corner radius */
+    radius: string;
+    /** Background track */
+    trackBackgroundColor: string;
+    /** Background track of disabled state */
+    trackDisabledBackgroundColor: string;
+    /** Background progress of disabled state */
+    progressDisabledBackgroundColor: string;
+    /** Height slider */
+    height: number;
+    /** Mark color */
+    markColor: string;
+}
+export declare const generateSliderTokens: (theme: IQuenUITheme) => ISliderTokens;

package/dist/componentTokens/generateSliderTokens.es.js

@@ -0,0 +1,11 @@
+const generateSliderTokens = (theme) => ({
+  radius: theme.components.Slider?.radius ?? theme.control.radius,
+  trackBackgroundColor: theme.components.Slider?.trackBackground ?? theme.colors.grayViolet[5],
+  trackDisabledBackgroundColor: theme.components.Slider?.trackDisabledBackgroundColor ?? theme.commonColorTokens.disabledBackground,
+  progressDisabledBackgroundColor: theme.components.Slider?.progressDisabledBackgroundColor ?? theme.commonColorTokens.disabledColor,
+  height: theme.components.Slider?.height ?? "0.375rem",
+  markColor: theme.components.Slider?.markColor ?? theme.colors.grayViolet[9]
+});
+export {
+  generateSliderTokens
+};

package/dist/componentTokens/generateSwitchTokens.cjs.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const generateSwitchTokens = (theme) => ({
+  radius: theme.components.Switch?.radius ?? theme.control.radius,
+  background: theme.components.Switch?.background ?? theme.commonColorTokens.secondaryBackground,
+  borderColor: theme.components.Switch?.borderColor ?? theme.commonColorTokens.borderColor,
+  checkedBackground: theme.components.Switch?.checkedBackground ?? theme.commonColorTokens.primaryBackground,
+  disabledColor: theme.components.Switch?.disabledColor ?? theme.commonColorTokens.disabledColor,
+  disabledBackground: theme.components.Switch?.disabledBackground ?? theme.commonColorTokens.disabledBackground,
+  backgroundBefore: theme.components.Switch?.backgroundBefore ?? theme.colors.grayViolet[9]
+});
+exports.generateSwitchTokens = generateSwitchTokens;

package/dist/componentTokens/generateSwitchTokens.d.ts

@@ -0,0 +1,18 @@
+import { IQuenUITheme } from '../theme/types';
+export interface ISwitchTokens {
+    /** The border radius of the switch */
+    radius: string;
+    /** The default background color of the switch */
+    background: string;
+    /** The border color of the switch */
+    borderColor: string;
+    /** Background color when the switch is checked */
+    checkedBackground: string;
+    /** Color used when the switch is disabled */
+    disabledColor: string;
+    /** Background color used when the switch is disabled */
+    disabledBackground: string;
+    /** Background color of the switch before being toggled */
+    backgroundBefore: string;
+}
+export declare const generateSwitchTokens: (theme: IQuenUITheme) => ISwitchTokens;

package/dist/componentTokens/generateSwitchTokens.es.js

@@ -0,0 +1,12 @@
+const generateSwitchTokens = (theme) => ({
+  radius: theme.components.Switch?.radius ?? theme.control.radius,
+  background: theme.components.Switch?.background ?? theme.commonColorTokens.secondaryBackground,
+  borderColor: theme.components.Switch?.borderColor ?? theme.commonColorTokens.borderColor,
+  checkedBackground: theme.components.Switch?.checkedBackground ?? theme.commonColorTokens.primaryBackground,
+  disabledColor: theme.components.Switch?.disabledColor ?? theme.commonColorTokens.disabledColor,
+  disabledBackground: theme.components.Switch?.disabledBackground ?? theme.commonColorTokens.disabledBackground,
+  backgroundBefore: theme.components.Switch?.backgroundBefore ?? theme.colors.grayViolet[9]
+});
+export {
+  generateSwitchTokens
+};