survey-creator-core 1.12.6 → 1.12.7

package/themes/themes/index.d.ts

@@ -0,0 +1,177 @@
+export declare const DefaultLight: {
+    themeName: string;
+    isLight: boolean;
+    cssVariables: {
+        "--sjs-layer-1-background-500": string;
+        "--sjs-layer-1-background-400": string;
+        "--sjs-layer-1-foreground-100": string;
+        "--sjs-layer-1-foreground-50": string;
+        "--sjs-layer-3-background-500": string;
+        "--sjs-layer-3-foreground-100": string;
+        "--sjs-layer-3-foreground-50": string;
+        "--sjs-layer-2-background-500": string;
+        "--sjs-layer-2-background-400": string;
+        "--sjs-special-haze": string;
+        "--sjs-border-25": string;
+        "--sjs-border-10": string;
+        "--sjs-primary-background-500": string;
+        "--sjs-primary-background-10": string;
+        "--sjs-primary-background-400": string;
+        "--sjs-primary-foreground-100": string;
+        "--sjs-primary-foreground-25": string;
+        "--sjs-secondary-background-500": string;
+        "--sjs-secondary-background-25": string;
+        "--sjs-secondary-background-10": string;
+        "--sjs-secondary-foreground-100": string;
+        "--sjs-secondary-forecolor-25": string;
+        "--sjs-semantic-red-background-500": string;
+        "--sjs-semantic-red-background-10": string;
+        "--sjs-semantic-red-foreground-100": string;
+        "--sjs-semantic-green-background-500": string;
+        "--sjs-semantic-green-background-10": string;
+        "--sjs-semantic-green-foreground-100": string;
+        "--sjs-semantic-blue-background-500": string;
+        "--sjs-semantic-blue-background-10": string;
+        "--sjs-semantic-blue-foreground-100": string;
+        "--sjs-semantic-yellow-background-500": string;
+        "--sjs-semantic-yellow-background-10": string;
+        "--sjs-semantic-yellow-foreground-100": string;
+        "--sjs-semantic-white-background-500": string;
+        "--sjs-code-gray-700": string;
+        "--sjs-code-blue-500": string;
+        "--sjs-code-gray-300": string;
+        "--sjs-code-green-500": string;
+        "--sjs-code-red-500": string;
+        "--sjs-code-purple-500": string;
+        "--sjs-code-yellow-500": string;
+        "--sjs-code-gray-500": string;
+        "--sjs-special-background": string;
+        "--sjs-layer-1-foreground-75": string;
+        "--sjs-layer-3-background-400": string;
+        "--sjs-special-glow": string;
+        "--sjs-special-shadow": string;
+        "--sjs-layer-3-foreground-75": string;
+        "--sjs-layer-2-foreground-100": string;
+        "--sjs-layer-2-foreground-75": string;
+        "--sjs-layer-2-foreground-50": string;
+        "--sjs-border-25-overlay": string;
+    };
+};
+export declare const DefaultDark: {
+    themeName: string;
+    isLight: boolean;
+    cssVariables: {
+        "--sjs-layer-1-background-500": string;
+        "--sjs-layer-1-background-400": string;
+        "--sjs-layer-1-foreground-100": string;
+        "--sjs-layer-1-foreground-50": string;
+        "--sjs-layer-3-background-500": string;
+        "--sjs-layer-3-foreground-100": string;
+        "--sjs-layer-3-foreground-50": string;
+        "--sjs-layer-2-background-500": string;
+        "--sjs-layer-2-background-400": string;
+        "--sjs-special-haze": string;
+        "--sjs-border-25": string;
+        "--sjs-border-10": string;
+        "--sjs-primary-background-500": string;
+        "--sjs-primary-background-10": string;
+        "--sjs-primary-background-400": string;
+        "--sjs-primary-foreground-100": string;
+        "--sjs-primary-foreground-25": string;
+        "--sjs-secondary-background-500": string;
+        "--sjs-secondary-background-25": string;
+        "--sjs-secondary-background-10": string;
+        "--sjs-secondary-foreground-100": string;
+        "--sjs-secondary-forecolor-25": string;
+        "--sjs-semantic-red-background-500": string;
+        "--sjs-semantic-red-background-10": string;
+        "--sjs-semantic-red-foreground-100": string;
+        "--sjs-semantic-green-background-500": string;
+        "--sjs-semantic-green-background-10": string;
+        "--sjs-semantic-green-foreground-100": string;
+        "--sjs-semantic-blue-background-500": string;
+        "--sjs-semantic-blue-background-10": string;
+        "--sjs-semantic-blue-foreground-100": string;
+        "--sjs-semantic-yellow-background-500": string;
+        "--sjs-semantic-yellow-background-10": string;
+        "--sjs-semantic-yellow-foreground-100": string;
+        "--sjs-semantic-white-background-500": string;
+        "--sjs-code-gray-700": string;
+        "--sjs-code-blue-500": string;
+        "--sjs-code-gray-300": string;
+        "--sjs-code-green-500": string;
+        "--sjs-code-red-500": string;
+        "--sjs-code-purple-500": string;
+        "--sjs-code-yellow-500": string;
+        "--sjs-code-gray-500": string;
+        "--sjs-special-background": string;
+        "--sjs-layer-1-foreground-75": string;
+        "--sjs-layer-3-background-400": string;
+        "--sjs-special-glow": string;
+        "--sjs-special-shadow": string;
+        "--sjs-layer-3-foreground-75": string;
+        "--sjs-layer-2-foreground-100": string;
+        "--sjs-layer-2-foreground-75": string;
+        "--sjs-layer-2-foreground-50": string;
+        "--sjs-border-25-overlay": string;
+    };
+};
+export declare const DefaultContrast: {
+    themeName: string;
+    isLight: boolean;
+    cssVariables: {
+        "--sjs-layer-1-background-500": string;
+        "--sjs-layer-1-background-400": string;
+        "--sjs-layer-1-foreground-100": string;
+        "--sjs-layer-1-foreground-50": string;
+        "--sjs-layer-3-background-500": string;
+        "--sjs-layer-3-foreground-100": string;
+        "--sjs-layer-3-foreground-50": string;
+        "--sjs-layer-2-background-500": string;
+        "--sjs-layer-2-background-400": string;
+        "--sjs-special-haze": string;
+        "--sjs-border-25": string;
+        "--sjs-border-10": string;
+        "--sjs-primary-background-500": string;
+        "--sjs-primary-background-10": string;
+        "--sjs-primary-background-400": string;
+        "--sjs-primary-foreground-100": string;
+        "--sjs-primary-foreground-25": string;
+        "--sjs-secondary-background-500": string;
+        "--sjs-secondary-background-25": string;
+        "--sjs-secondary-background-10": string;
+        "--sjs-secondary-foreground-100": string;
+        "--sjs-secondary-forecolor-25": string;
+        "--sjs-semantic-red-background-500": string;
+        "--sjs-semantic-red-background-10": string;
+        "--sjs-semantic-red-foreground-100": string;
+        "--sjs-semantic-green-background-500": string;
+        "--sjs-semantic-green-background-10": string;
+        "--sjs-semantic-green-foreground-100": string;
+        "--sjs-semantic-blue-background-500": string;
+        "--sjs-semantic-blue-background-10": string;
+        "--sjs-semantic-blue-foreground-100": string;
+        "--sjs-semantic-yellow-background-500": string;
+        "--sjs-semantic-yellow-background-10": string;
+        "--sjs-semantic-yellow-foreground-100": string;
+        "--sjs-semantic-white-background-500": string;
+        "--sjs-code-gray-700": string;
+        "--sjs-code-blue-500": string;
+        "--sjs-code-gray-300": string;
+        "--sjs-code-green-500": string;
+        "--sjs-code-red-500": string;
+        "--sjs-code-purple-500": string;
+        "--sjs-code-yellow-500": string;
+        "--sjs-code-gray-500": string;
+        "--sjs-special-background": string;
+        "--sjs-layer-1-foreground-75": string;
+        "--sjs-layer-3-background-400": string;
+        "--sjs-special-glow": string;
+        "--sjs-special-shadow": string;
+        "--sjs-layer-3-foreground-75": string;
+        "--sjs-layer-2-foreground-100": string;
+        "--sjs-layer-2-foreground-75": string;
+        "--sjs-layer-2-foreground-50": string;
+        "--sjs-border-25-overlay": string;
+    };
+};

package/themes/themes/utils.d.ts

@@ -0,0 +1,4 @@
+export declare function trimEmptyFields(object: {
+    [index: string]: string;
+}): void;
+export declare function assign(...inputs: Array<any>): void;

package/typings/components/action-container-view-model.d.ts

@@ -57,7 +57,8 @@ export declare class SurveyElementAdornerBase<T extends SurveyElement = SurveyEl
     dispose(): void;
     protected onElementSelectedChanged(isSelected: boolean): void;
     protected getExpandCollapseAction(): IAction;
-    protected updateActionsContainer(surveyElement: SurveyElement, clear?: boolean): void;
+    protected cleanActionsContainer(): void;
+    protected updateActionsContainer(surveyElement: SurveyElement): void;
     protected updateActionsProperties(): void;
     protected getAllowDragging(options: any): boolean;
     protected getAllowExpandCollapse(options: any): boolean;

package/typings/components/page.d.ts

@@ -16,14 +16,13 @@ export declare class PageAdorner extends SurveyElementAdornerBase<PageModel> {
     private updateShowPlaceholder;
     constructor(creator: SurveyCreatorModel, page: PageModel);
     protected updateActionVisibility(id: string, isVisible: boolean): void;
-    protected updateActionsContainer(surveyElement: SurveyElement, clear?: boolean): void;
+    protected updateActionsContainer(surveyElement: SurveyElement): void;
     protected get dragInsideCollapsedContainer(): boolean;
     protected getAllowExpandCollapse(options: any): boolean;
     protected attachElement(surveyElement: PageModel): void;
     protected detachElement(surveyElement: PageModel): void;
     protected onElementSelectedChanged(isSelected: boolean): void;
     private patchPageForDragDrop;
-    dispose(): void;
     protected calcIsGhostPage(page: PageModel): boolean;
     get isGhost(): boolean;
     get placeholderText(): string;

package/typings/components/side-bar/side-bar-header-model.d.ts

@@ -6,6 +6,6 @@ export declare class SidebarHeaderModel extends Base {
     componentData: any;
     componentName: string;
     get component(): string;
-    get componentModel(): string;
+    get componentModel(): any;
     reset(): void;
 }

package/typings/components/side-bar/side-bar-model.d.ts

@@ -50,4 +50,5 @@ export declare class SidebarModel extends Base {
     dispose(): void;
     initResizeManager(container: HTMLDivElement): void;
     resetResizeManager(): void;
+    get toolbar(): import("survey-core").AdaptiveActionContainer<Action>;
 }

package/typings/components/side-bar/side-bar-page-model.d.ts

@@ -7,5 +7,6 @@ export declare class SidebarPageModel extends Base {
     visible: boolean;
     componentData: any;
     componentName: string;
+    deactivateCallback: () => void;
     constructor(id: string, sidePanel: SidebarModel, componentName?: string, componentData?: any);
 }

package/typings/components/tabs/designer-plugin.d.ts

@@ -13,6 +13,9 @@ export declare class TabDesignerPlugin implements ICreatorPlugin {
     private propertyGridTab;
     private toolboxTab;
     private propertyGridPlaceholderPage;
+    private themeModel;
+    private themePropertyGrid;
+    private themePropertyGridTab;
     private surveySettingsAction;
     private saveSurveyAction;
     previewAction: Action;
@@ -27,8 +30,13 @@ export declare class TabDesignerPlugin implements ICreatorPlugin {
     private updateHeaderComponent;
     private updateActivePage;
     private setPropertyGridIsActivePage;
+    private setActivePage;
     get showOneCategoryInPropertyGrid(): boolean;
     set showOneCategoryInPropertyGrid(newValue: boolean);
+    private syncTheme;
+    private updatePredefinedColorChoices;
+    updateThemeSettings(): void;
+    private createCreatorThemeSettingsPage;
     constructor(creator: SurveyCreatorModel);
     private updateTabControlActions;
     activate(): void;

package/typings/components/tabs/theme-plugin.d.ts

@@ -59,7 +59,6 @@ export declare class ThemeTabPlugin implements ICreatorPlugin {
     private addSubGroupTitle;
     private updateSubGroups;
     private updatePropertyGridEditorsAvailability;
-    private getPredefinedColorsItemValues;
     private updatePropertyGridColorEditorWithPredefinedColors;
     private _setPGEditorPropertyValue;
     private setCoverPropertiesFromSurvey;
@@ -69,6 +68,7 @@ export declare class ThemeTabPlugin implements ICreatorPlugin {
     private updateTabControl;
     constructor(creator: SurveyCreatorModel);
     activate(): void;
+    private expandCategoryIfNeeded;
     private updateTabControlActions;
     update(): void;
     private updateAllowModifyTheme;

package/typings/components/tabs/themes.d.ts

@@ -1,4 +1,4 @@
-import { ITheme } from "survey-core";
+import { ItemValue, ITheme } from "survey-core";
 export declare const Themes: {
     [index: string]: ITheme;
 };
@@ -23,3 +23,4 @@ export declare const PredefinedColors: {
         green: string;
     };
 };
+export declare function getPredefinedColorsItemValues(colorPalette?: string): ItemValue[];

package/typings/creator-base.d.ts

@@ -16,6 +16,7 @@ import { DragDropSurveyElements } from "./survey-elements";
 import { PageAdorner } from "./components/page";
 import { ElementDeletingEvent, PropertyGetReadOnlyEvent, ElementGetDisplayNameEvent, HtmlToMarkdownEvent, ElementAllowOperationsEvent, ElementGetActionsEvent, PropertyAddingEvent, PropertyGridSurveyCreatedEvent, PropertyEditorCreatedEvent, PropertyEditorUpdateTitleActionsEvent, PropertyGridShowPopupEvent, CollectionItemAllowOperationsEvent, CollectionItemAddedEvent, FastEntryItemsEvent as FastEntryFinishedEvent, MatrixColumnAddedEvent, ConfigureTablePropertyEditorEvent, PropertyDisplayCustomErrorEvent, PropertyValueChangingEvent, PropertyValueChangedEvent, ConditionGetQuestionListEvent, GetConditionOperatorEvent, LogicRuleGetDisplayTextEvent, ModifiedEvent, QuestionAddedEvent, PanelAddedEvent, PageAddedEvent, QuestionConvertingEvent, PageGetFooterActionsEvent, SurveyInstanceCreatedEvent, DesignerSurveyCreatedEvent, PreviewSurveyCreatedEvent, NotifyEvent, ElementFocusingEvent, ElementFocusedEvent, OpenFileChooserEvent, UploadFileEvent, TranslationStringVisibilityEvent, TranslationImportItemEvent, TranslationImportedEvent, TranslationExportItemEvent, MachineTranslateEvent, TranslationItemChangingEvent, DragDropAllowEvent, CreateCustomMessagePanelEvent, ActiveTabChangingEvent, ActiveTabChangedEvent, BeforeUndoEvent, BeforeRedoEvent, PageAddingEvent, DragStartEndEvent } from "./creator-events-api";
 import { ExpandCollapseManager } from "./expand-collapse-manager";
+import { ICreatorTheme } from "./creator-theme/creator-themes";
 import { TabbedMenuContainer, TabbedMenuItem } from "./tabbed-menu";
 export interface IKeyboardShortcut {
     name?: string;
@@ -87,6 +88,7 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
      * @see saveThemeFunc
      */
     showThemeTab: boolean;
+    showCreatorThemeSettings: boolean;
     /**
      * Specifies whether to display the Translation tab.
      *
@@ -1223,7 +1225,6 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
     private propertyGridDefinition;
     getPropertyGridDefinition(): any;
     setPropertyGridDefinition(val: any): void;
-    private getPropertyGridExpandedCategory;
     expandCategoryIfNeeded(): void;
     private selectionChanged;
     private getCurrentPageByElement;
@@ -1419,6 +1420,12 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
     dispose(): void;
     enableLinkFileEditor: boolean;
     getRootCss(): string;
+    themeVariables: {
+        [index: string]: string;
+    };
+    creatorTheme: ICreatorTheme;
+    applyTheme(theme: ICreatorTheme): void;
+    syncTheme(theme: ICreatorTheme): void;
     allowDragPages: boolean;
     collapsePagesOnDrag: boolean;
 }

package/typings/creator-options.d.ts

@@ -52,6 +52,7 @@ export interface ICreatorOptions {
      * [Theme Editor](https://surveyjs.io/survey-creator/documentation/theme-editor (linkStyle))
      */
     showThemeTab?: boolean;
+    showCreatorThemeSettings?: boolean;
     /**
      * Specifies whether to call the [`saveSurveyFunc`](https://surveyjs.io/Documentation/Survey-Creator?id=surveycreator#saveSurveyFunc) and [`saveThemeFunc`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#saveThemeFunc) functions each time survey or theme settings are changed.
      *

package/typings/creator-theme/creator-theme-model-definition.d.ts

@@ -0,0 +1,5 @@
+import { ISurveyPropertiesDefinition, ISurveyPropertyGridDefinition } from "../question-editor/definition";
+export declare const creatorThemeModelPropertyGridDefinition: ISurveyPropertyGridDefinition;
+export declare class creatorThemeModelEditorDefinition {
+    static definition: ISurveyPropertiesDefinition;
+}

package/typings/creator-theme/creator-theme-model.d.ts

@@ -0,0 +1,43 @@
+import { Base, EventBase, ILoadFromJSONOptions, ISaveToJSONOptions } from "survey-core";
+import { ICreatorTheme } from "./creator-themes";
+export declare class CreatorThemeModel extends Base implements ICreatorTheme {
+    static defautlThemeName: string;
+    initialCssVariables: {
+        [index: string]: string;
+    };
+    themeCssVariablesChanges?: {
+        [index: string]: string;
+    };
+    unitDictionary: {
+        [index: string]: number;
+    };
+    themeName: string;
+    scale: number;
+    fontScale: number;
+    surfaceScale: number;
+    isLight: boolean;
+    onThemeSelected: EventBase<CreatorThemeModel, {
+        theme: ICreatorTheme;
+    }>;
+    onThemePropertyChanged: EventBase<CreatorThemeModel, {
+        name: string;
+        value: any;
+    }>;
+    constructor();
+    getType(): string;
+    get cssVariables(): {
+        [index: string]: string;
+    };
+    private setThemeCssVariablesChanges;
+    private onThemePropertyValueChangedCallback;
+    private scalePropertiesChanged;
+    private scalingProperties;
+    private scaleValue;
+    private scaleCssVariables;
+    private getScaleFactor;
+    private updateScaleProperties;
+    private blockThemeChangedNotifications;
+    loadTheme(theme?: ICreatorTheme): void;
+    fromJSON(json: ICreatorTheme, options?: ILoadFromJSONOptions): void;
+    toJSON(options?: ISaveToJSONOptions): ICreatorTheme;
+}

package/typings/creator-theme/creator-themes.d.ts

@@ -0,0 +1,10 @@
+export interface ICreatorTheme {
+    themeName?: string;
+    cssVariables?: {
+        [index: string]: string;
+    };
+}
+export declare const PredefinedCreatorThemes: string[];
+export declare const CreatorThemes: {
+    [index: string]: ICreatorTheme;
+};

package/typings/editorLocalization.d.ts

@@ -112,6 +112,7 @@ export declare var defaultStrings: {
         surveySettingsTooltip: string;
         themeSettings: string;
         themeSettingsTooltip: string;
+        creatorSettingTitle: string;
         showPanel: string;
         hidePanel: string;
         prevSelected: string;
@@ -1730,4 +1731,17 @@ export declare var defaultStrings: {
             green: string;
         };
     };
+    creatortheme: {
+        "--sjs-special-background": string;
+        "--sjs-primary-background-500": string;
+        surfaceScale: string;
+        userInterfaceBaseUnit: string;
+        fontScale: string;
+        names: {
+            sc2020: string;
+            "default-light": string;
+            "default-dark": string;
+            "default-contrast": string;
+        };
+    };
 };

package/typings/entries/index.d.ts

@@ -85,6 +85,8 @@ export * from "../utils/resizer";
 export * from "../plugins/undo-redo";
 export * from "../plugins/undo-redo/undo-redo-manager";
 export * from "../pages-controller";
+export * from "../creator-theme/creator-theme-model-definition";
+export * from "../creator-theme/creator-theme-model";
 export * from "../presets/presets-base";
 export * from "../presets/presets";
 export * from "../presets/presets-properties";

package/typings/localization/english.d.ts

@@ -64,6 +64,7 @@ export declare var enStrings: {
         surveySettingsTooltip: string;
         themeSettings: string;
         themeSettingsTooltip: string;
+        creatorSettingTitle: string;
         showPanel: string;
         hidePanel: string;
         prevSelected: string;
@@ -1682,4 +1683,17 @@ export declare var enStrings: {
             green: string;
         };
     };
+    creatortheme: {
+        "--sjs-special-background": string;
+        "--sjs-primary-background-500": string;
+        surfaceScale: string;
+        userInterfaceBaseUnit: string;
+        fontScale: string;
+        names: {
+            sc2020: string;
+            "default-light": string;
+            "default-dark": string;
+            "default-contrast": string;
+        };
+    };
 };

package/typings/property-grid/index.d.ts

@@ -139,6 +139,8 @@ export declare class PropertyGridModel {
     expandCategory(name: string): void;
     collapseAllCategories(): void;
     expandAllCategories(): void;
+    expandCategoryIfNeeded(): void;
+    private getPropertyGridExpandedCategory;
     private collapseOtherPanels;
     private collapseAllCategoriesExcept;
     surveyInstanceCreatedArea: string;
@@ -219,6 +221,7 @@ export declare class PropertyGridLinkEditor extends PropertyGridEditor {
 export declare class PropertyGridEditorColor extends PropertyGridEditor {
     fit(prop: JsonObjectProperty): boolean;
     getJSON(obj: Base, prop: JsonObjectProperty, options: ISurveyCreatorOptions): any;
+    onCreated(obj: Base, question: Question, prop: JsonObjectProperty): void;
 }
 export declare class PropertyGridEditorColorWithAlpha extends PropertyGridEditor {
     fit(prop: JsonObjectProperty): boolean;

package/typings/property-grid/property-grid-view-model.d.ts

@@ -18,6 +18,7 @@ export declare class PropertyGridViewModel extends Base {
     searchEnabled: boolean;
     showPlaceholder: boolean;
     constructor(propertyGridModel: PropertyGridModel, creator: SurveyCreatorModel);
+    get rootCss(): string;
     protected onPropertyValueChanged(name: string, oldValue: any, newValue: any): void;
     private get selectionController();
     private onSurveyChanged;

package/typings/themes/default-contrast.d.ts

@@ -0,0 +1,119 @@
+declare const Theme: {
+    themeName: string;
+    isLight: boolean;
+    cssVariables: {
+        "--sjs-layer-1-background-500": string;
+        "--sjs-layer-1-background-400": string;
+        "--sjs-layer-1-foreground-100": string;
+        "--sjs-layer-1-foreground-50": string;
+        "--sjs-layer-3-background-500": string;
+        "--sjs-layer-3-foreground-100": string;
+        "--sjs-layer-3-foreground-50": string;
+        "--sjs-layer-2-background-500": string;
+        "--sjs-layer-2-background-400": string;
+        "--sjs-special-haze": string;
+        "--sjs-border-25": string;
+        "--sjs-border-10": string;
+        "--sjs-primary-background-500": string;
+        "--sjs-primary-background-10": string;
+        "--sjs-primary-background-400": string;
+        "--sjs-primary-foreground-100": string;
+        "--sjs-primary-foreground-25": string;
+        "--sjs-secondary-background-500": string;
+        "--sjs-secondary-background-25": string;
+        "--sjs-secondary-background-10": string;
+        "--sjs-secondary-foreground-100": string;
+        "--sjs-secondary-forecolor-25": string;
+        "--sjs-semantic-red-background-500": string;
+        "--sjs-semantic-red-background-10": string;
+        "--sjs-semantic-red-foreground-100": string;
+        "--sjs-semantic-green-background-500": string;
+        "--sjs-semantic-green-background-10": string;
+        "--sjs-semantic-green-foreground-100": string;
+        "--sjs-semantic-blue-background-500": string;
+        "--sjs-semantic-blue-background-10": string;
+        "--sjs-semantic-blue-foreground-100": string;
+        "--sjs-semantic-yellow-background-500": string;
+        "--sjs-semantic-yellow-background-10": string;
+        "--sjs-semantic-yellow-foreground-100": string;
+        "--sjs-semantic-white-background-500": string;
+        "--sjs-code-gray-700": string;
+        "--sjs-code-blue-500": string;
+        "--sjs-code-gray-300": string;
+        "--sjs-code-green-500": string;
+        "--sjs-code-red-500": string;
+        "--sjs-code-purple-500": string;
+        "--sjs-code-yellow-500": string;
+        "--sjs-code-gray-500": string;
+        "--sjs-special-background": string;
+        "--sjs-layer-1-foreground-75": string;
+        "--sjs-layer-3-background-400": string;
+        "--sjs-special-glow": string;
+        "--sjs-special-shadow": string;
+        "--sjs-layer-3-foreground-75": string;
+        "--sjs-layer-2-foreground-100": string;
+        "--sjs-layer-2-foreground-75": string;
+        "--sjs-layer-2-foreground-50": string;
+        "--sjs-border-25-overlay": string;
+    };
+};
+export default Theme;
+export declare const DefaultContrast: {
+    themeName: string;
+    isLight: boolean;
+    cssVariables: {
+        "--sjs-layer-1-background-500": string;
+        "--sjs-layer-1-background-400": string;
+        "--sjs-layer-1-foreground-100": string;
+        "--sjs-layer-1-foreground-50": string;
+        "--sjs-layer-3-background-500": string;
+        "--sjs-layer-3-foreground-100": string;
+        "--sjs-layer-3-foreground-50": string;
+        "--sjs-layer-2-background-500": string;
+        "--sjs-layer-2-background-400": string;
+        "--sjs-special-haze": string;
+        "--sjs-border-25": string;
+        "--sjs-border-10": string;
+        "--sjs-primary-background-500": string;
+        "--sjs-primary-background-10": string;
+        "--sjs-primary-background-400": string;
+        "--sjs-primary-foreground-100": string;
+        "--sjs-primary-foreground-25": string;
+        "--sjs-secondary-background-500": string;
+        "--sjs-secondary-background-25": string;
+        "--sjs-secondary-background-10": string;
+        "--sjs-secondary-foreground-100": string;
+        "--sjs-secondary-forecolor-25": string;
+        "--sjs-semantic-red-background-500": string;
+        "--sjs-semantic-red-background-10": string;
+        "--sjs-semantic-red-foreground-100": string;
+        "--sjs-semantic-green-background-500": string;
+        "--sjs-semantic-green-background-10": string;
+        "--sjs-semantic-green-foreground-100": string;
+        "--sjs-semantic-blue-background-500": string;
+        "--sjs-semantic-blue-background-10": string;
+        "--sjs-semantic-blue-foreground-100": string;
+        "--sjs-semantic-yellow-background-500": string;
+        "--sjs-semantic-yellow-background-10": string;
+        "--sjs-semantic-yellow-foreground-100": string;
+        "--sjs-semantic-white-background-500": string;
+        "--sjs-code-gray-700": string;
+        "--sjs-code-blue-500": string;
+        "--sjs-code-gray-300": string;
+        "--sjs-code-green-500": string;
+        "--sjs-code-red-500": string;
+        "--sjs-code-purple-500": string;
+        "--sjs-code-yellow-500": string;
+        "--sjs-code-gray-500": string;
+        "--sjs-special-background": string;
+        "--sjs-layer-1-foreground-75": string;
+        "--sjs-layer-3-background-400": string;
+        "--sjs-special-glow": string;
+        "--sjs-special-shadow": string;
+        "--sjs-layer-3-foreground-75": string;
+        "--sjs-layer-2-foreground-100": string;
+        "--sjs-layer-2-foreground-75": string;
+        "--sjs-layer-2-foreground-50": string;
+        "--sjs-border-25-overlay": string;
+    };
+};