@sk-web-gui/core 3.0.0 → 3.1.0

package/dist/types/core/src/components/table-autotable.d.ts

@@ -1,5 +1,6 @@
 export declare const TableAutoTable: () => {
     '.sk-table-wrapper': {
+        '@apply text-base': {};
         '@apply rounded-groups': {};
         '@apply border-1 border-divider': {};
         '@apply bg-background-content': {};
@@ -45,7 +46,7 @@ export declare const TableAutoTable: () => {
                 '@apply text-label-small': {};
             };
             '.sk-table-th': {
-                '@apply h-[5.6rem]': {};
+                '@apply h-56': {};
                 '@apply p-0': {};
                 '&:first-of-type': {
                     '.sk-table-sticky-col': {
@@ -124,8 +125,8 @@ export declare const TableAutoTable: () => {
             '&-td, .sk-table-th': {
                 '@apply p-0': {};
                 '@apply text-small': {};
-                '@apply h-[6.3rem]': {};
-                '@apply min-h-[6.3rem]': {};
+                '@apply h-64-1': {};
+                '@apply min-h-64-1': {};
                 '@apply focus-visible:shadow-insetring': {};
                 '.sk-table-col-content': {
                     '@apply py-8 px-18': {};
@@ -146,13 +147,13 @@ export declare const TableAutoTable: () => {
                 };
                 '&-thead': {
                     th: {
-                        '@apply h-[4.8rem]': {};
+                        '@apply h-48': {};
                     };
                 };
                 '&-tbody': {
                     '&-td, .sk-table-th': {
-                        '@apply h-[4.7rem]': {};
-                        '@apply min-h-[4.7rem]': {};
+                        '@apply h-48-1': {};
+                        '@apply min-h-48-1': {};
                     };
                 };
             };
@@ -183,7 +184,7 @@ export declare const TableAutoTable: () => {
             };
         };
         '&-paginationwrapper': {
-            '@apply max-w-[60rem]': {};
+            '@apply max-w-[37.5em]': {};
             '@apply shrink grow': {};
             '@apply hidden @screen-md/footer:flex': {};
         };

package/dist/types/core/src/components/tooltip.d.ts

@@ -12,7 +12,7 @@ export declare const Tooltip: () => {
             '@apply font-bold': {};
             '@apply w-fit h-fit': {};
             '@apply grow-0': {};
-            '@apply min-h-[3.4rem]': {};
+            '@apply min-h-34': {};
         };
         '&::after, &::before': {
             '@apply h-0 w-0 overflow-hidden': {};
@@ -21,7 +21,7 @@ export declare const Tooltip: () => {
             '@apply flex-col': {};
             '@apply pb-2': {};
             '&::after': {
-                '@apply content-[""] border-solid border-[0.6rem] border-b-0': {};
+                '@apply content-[""] border-solid border-6 border-b-0': {};
                 '@apply border-t-primary-surface border-r-transparent border-b-transparent border-l-transparent': {};
             };
         };
@@ -29,23 +29,23 @@ export declare const Tooltip: () => {
             '@apply flex-col': {};
             '@apply pt-2': {};
             '&::before': {
-                '@apply content-[""] border-solid border-[0.6rem] border-t-0': {};
+                '@apply content-[""] border-solid border-6 border-t-0': {};
                 '@apply border-t-transparent border-r-transparent border-b-primary-surface border-l-transparent': {};
             };
         };
         '&[data-position="left"]': {
             '@apply flex-row': {};
-            '@apply pr-2 py-[0.3rem]': {};
+            '@apply pr-2 py-3': {};
             '&::after': {
-                '@apply content-[""] border-solid border-[0.6rem] border-r-0': {};
+                '@apply content-[""] border-solid border-6 border-r-0': {};
                 '@apply border-t-transparent border-r-transparent border-b-transparent border-l-primary-surface': {};
             };
         };
         '&[data-position="right"]': {
             '@apply flex-row': {};
-            '@apply pl-2 py-[0.3rem]': {};
+            '@apply pl-2 py-3': {};
             '&::before': {
-                '@apply content-[""] border-solid border-[0.6rem] border-l-0': {};
+                '@apply content-[""] border-solid border-6 border-l-0': {};
                 '@apply border-t-transparent border-r-primary-surface border-b-transparent border-l-transparent': {};
             };
         };

package/dist/types/core/src/units.d.ts

@@ -1,24 +1,55 @@
 declare const _units: {
     spacing: {
         '0': string;
+        '0.25': string;
+        '0.5': string;
+        '0.75': string;
+        '1': string;
         '2': string;
+        '3': string;
         '4': string;
+        '5': string;
         '6': string;
+        '7': string;
         '8': string;
+        '9': string;
         '10': string;
+        '11': string;
         '12': string;
+        '13': string;
         '14': string;
+        '15': string;
         '16': string;
+        '17': string;
         '18': string;
+        '19': string;
         '20': string;
+        '22': string;
         '24': string;
+        '26': string;
+        '28': string;
+        '30': string;
         '32': string;
+        '34': string;
+        '36': string;
+        '38': string;
         '40': string;
+        '42': string;
+        '44': string;
+        '46': string;
         '48': string;
+        '50': string;
+        '52': string;
+        '54': string;
         '56': string;
+        '58': string;
+        '60': string;
+        '62': string;
         '64': string;
+        '68': string;
         '72': string;
         '80': string;
+        '100': string;
     };
     fontSizes: {
         'display-1': (string | {
@@ -157,6 +188,10 @@ declare const _units: {
             lineHeight: string;
             fontWeight: number;
         })[];
+        'logo-header': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
         lead: string[];
         base: string[];
         large: string[];
@@ -197,6 +232,7 @@ declare const _units: {
         'input-large': string;
         'input-medium': string;
         'input-small': string;
+        'logo-header': string;
         lead: string;
         base: string;
         large: string;

package/dist/types/data-plugin.d.ts

@@ -0,0 +1,4 @@
+export declare const DataAttributes: {
+    handler: import("tailwindcss/types/config").PluginCreator;
+    config?: Partial<import("tailwindcss/types/config").Config> | undefined;
+};

package/dist/types/index.d.ts

@@ -0,0 +1,6 @@
+import preset from './preset';
+import plugin from './plugin';
+import { AriaAttributes } from './aria-plugin';
+import { DataAttributes } from './data-plugin';
+export { preset, plugin, DataAttributes, AriaAttributes };
+export default plugin;

package/dist/types/plugin.d.ts

@@ -0,0 +1,12 @@
+interface PluginOptions {
+    colors: string[];
+    cssBase: boolean;
+}
+declare const plugin: {
+    (options: PluginOptions): {
+        handler: import("tailwindcss/types/config").PluginCreator;
+        config?: Partial<import("tailwindcss/types/config").Config> | undefined;
+    };
+    __isOptionsFunction: true;
+};
+export default plugin;

package/dist/types/popup-menu/src/popup-menu-button.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const PopupMenuButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@sk-web-gui/button/src/button").IButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>, "ref">, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const PopupMenuButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@sk-web-gui/button/dist/types/button").IButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>, "ref">, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/types/preset.d.ts

@@ -0,0 +1,18 @@
+declare const preset: (options?: {
+    tailwindForms: boolean;
+    tailwindContainers: boolean;
+    dataAttributes: boolean;
+    ariaAttributes: boolean;
+    plugin: {
+        colors: never[];
+        cssBase: boolean;
+    };
+}) => {
+    plugins: ({
+        handler: import("tailwindcss/types/config").PluginCreator;
+        config?: Partial<import("tailwindcss/types/config").Config> | undefined;
+    } | {
+        handler: () => void;
+    })[];
+};
+export default preset;

package/dist/types/theme/src/gui-provider.d.ts

@@ -20,6 +20,10 @@ export declare const GuiContext: React.Context<{
      * Scheme that is used when set to "system"
      */
     preferredColorScheme: Exclude<ColorSchemeMode, ColorSchemeMode.System>;
+    units: {
+        base: number;
+        htmlBase: number;
+    };
 } | undefined>;
 export interface GuiProviderProps {
     children: React.ReactNode;
@@ -28,7 +32,17 @@ export interface GuiProviderProps {
      * @default system
      */
     colorScheme?: ColorSchemeMode;
+    /**
+     * Font size in px that the theme variables are based on
+     * @default 10
+     */
+    baseFontSize?: number;
+    /**
+     * Font base size in px that the site uses.
+     * @default 10
+     */
+    htmlFontSize?: number;
 }
-export declare function GuiProvider({ theme, colorScheme: _colorScheme, children }: GuiProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function GuiProvider({ theme, colorScheme: _colorScheme, baseFontSize, htmlFontSize, children, }: GuiProviderProps): import("react/jsx-runtime").JSX.Element;
 export declare function useGui<T extends object = Dict>(): WithCSSVar<T>;
 export declare function extendTheme(themeOverride: GuiThemeOverride): GuiTheme;

package/dist/types/theme/src/units.d.ts

@@ -1,23 +1,57 @@
 export declare const spacing: {
     0: string;
+    '0.25': string;
+    '0.5': string;
+    '0.75': string;
+    1: string;
     2: string;
+    3: string;
     4: string;
+    5: string;
     6: string;
+    7: string;
     8: string;
+    9: string;
     10: string;
+    11: string;
     12: string;
+    13: string;
     14: string;
+    15: string;
     16: string;
+    17: string;
     18: string;
+    19: string;
     20: string;
+    22: string;
     24: string;
+    26: string;
+    28: string;
+    30: string;
     32: string;
+    33: string;
+    34: string;
+    36: string;
+    38: string;
     40: string;
+    42: string;
+    43: string;
+    44: string;
+    46: string;
     48: string;
+    49: string;
+    50: string;
+    52: string;
+    54: string;
     56: string;
+    58: string;
+    60: string;
+    62: string;
     64: string;
+    68: string;
     72: string;
     80: string;
+    100: string;
 };
 export declare const breakpoints: {
     phone: {
@@ -125,6 +159,9 @@ export declare const fontSizes: {
         medium: string;
         small: string;
     };
+    logo: {
+        header: string;
+    };
     lead: string;
     base: string;
     large: string;
@@ -187,6 +224,9 @@ export declare const lineHeights: {
         medium: string;
         small: string;
     };
+    logo: {
+        header: string;
+    };
     lead: string;
     base: string;
     large: string;

package/dist/types/theme.d.ts

@@ -0,0 +1,4 @@
+import { RecursiveObject } from '@sk-web-gui/theme';
+import { Config } from 'tailwindcss/types/config';
+declare const theme: RecursiveObject<Config['theme'] | string | string[]>;
+export { theme };

package/dist/types/units.d.ts

@@ -0,0 +1,288 @@
+declare const _units: {
+    spacing: {
+        '0': string;
+        '0.25': string;
+        '0.5': string;
+        '0.75': string;
+        '1': string;
+        '2': string;
+        '3': string;
+        '4': string;
+        '5': string;
+        '6': string;
+        '7': string;
+        '8': string;
+        '9': string;
+        '10': string;
+        '11': string;
+        '12': string;
+        '13': string;
+        '14': string;
+        '15': string;
+        '16': string;
+        '17': string;
+        '18': string;
+        '19': string;
+        '20': string;
+        '22': string;
+        '24': string;
+        '26': string;
+        '28': string;
+        '30': string;
+        '32': string;
+        '34': string;
+        '36': string;
+        '38': string;
+        '40': string;
+        '42': string;
+        '44': string;
+        '46': string;
+        '48': string;
+        '50': string;
+        '52': string;
+        '54': string;
+        '56': string;
+        '58': string;
+        '60': string;
+        '62': string;
+        '64': string;
+        '68': string;
+        '72': string;
+        '80': string;
+        '90': string;
+        '100': string;
+    };
+    fontSizes: {
+        'display-1': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-1-lg': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-1-md': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-1-sm': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-2': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-2-lg': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-2-md': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-2-sm': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-3': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-3-lg': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-3-md': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'display-3-sm': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        h1: (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h1-lg': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h1-md': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h1-sm': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        h2: (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h2-lg': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h2-md': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h2-sm': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        h3: (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h3-lg': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h3-md': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h3-sm': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        h4: (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h4-lg': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h4-md': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'h4-sm': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'label-large': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'label-medium': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'label-small': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'input-large': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'input-medium': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'input-small': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        'logo-header': (string | {
+            lineHeight: string;
+            fontWeight: number;
+        })[];
+        lead: string[];
+        base: string[];
+        large: string[];
+        small: string[];
+    };
+    lineHeights: {
+        'display-1': string;
+        'display-1-lg': string;
+        'display-1-md': string;
+        'display-1-sm': string;
+        'display-2': string;
+        'display-2-lg': string;
+        'display-2-md': string;
+        'display-2-sm': string;
+        'display-3': string;
+        'display-3-lg': string;
+        'display-3-md': string;
+        'display-3-sm': string;
+        h1: string;
+        'h1-lg': string;
+        'h1-md': string;
+        'h1-sm': string;
+        h2: string;
+        'h2-lg': string;
+        'h2-md': string;
+        'h2-sm': string;
+        h3: string;
+        'h3-lg': string;
+        'h3-md': string;
+        'h3-sm': string;
+        h4: string;
+        'h4-lg': string;
+        'h4-md': string;
+        'h4-sm': string;
+        'label-large': string;
+        'label-medium': string;
+        'label-small': string;
+        'input-large': string;
+        'input-medium': string;
+        'input-small': string;
+        'logo-header': string;
+        lead: string;
+        base: string;
+        large: string;
+        small: string;
+    };
+    radius: {
+        DEFAULT: string;
+        full: string;
+        none: string;
+        circular: string;
+        'circular-lg': string;
+        'circular-md': string;
+        'circular-sm': string;
+        button: string;
+        'button-lg': string;
+        'button-md': string;
+        'button-sm': string;
+        cards: string;
+        'cards-lg': string;
+        'cards-md': string;
+        'cards-sm': string;
+        utility: string;
+        'utility-lg': string;
+        'utility-md': string;
+        'utility-sm': string;
+        groups: string;
+        'groups-lg': string;
+        'groups-md': string;
+        'groups-sm': string;
+        '0': string;
+        '2': string;
+        '4': string;
+        '6': string;
+        '8': string;
+        '10': string;
+        '12': string;
+        '14': string;
+        '16': string;
+        '18': string;
+        '20': string;
+        '24': string;
+        '32': string;
+        '40': string;
+        '48': string;
+        '56': string;
+        '64': string;
+        '72': string;
+        '80': string;
+    };
+};
+declare const units: typeof _units;
+export { units };

package/dist/types/with-opacity.d.ts

@@ -0,0 +1,4 @@
+declare const withOpacity: (variableName: string) => ({ opacityValue }: {
+    opacityValue: string;
+}) => string;
+export default withOpacity;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sk-web-gui/core",
-  "version": "3.0.0",
+  "version": "3.1.0",
   "license": "MIT",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -23,7 +23,7 @@
     "build": "concurrently yarn:build:*",
     "build:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts -d dist/esm --source-maps",
     "build:cjs": "cross-env BABEL_ENV=cjs babel src --root-mode upward --extensions .ts -d dist/cjs --source-maps",
-    "build:types": "tsc --emitDeclarationOnly --declaration --allowJs --declarationDir dist/types"
+    "build:types": "tsc -p ./tsconfig.production.json --emitDeclarationOnly --declaration --declarationDir dist/types"
   },
   "peerDependencies": {
     "@tailwindcss/container-queries": "^0.1.1",
@@ -40,8 +40,8 @@
     "tailwindcss": "^3.4.3"
   },
   "dependencies": {
-    "@sk-web-gui/theme": "2.0.0",
+    "@sk-web-gui/theme": "2.1.1",
     "mini-svg-data-uri": "^1.4.4"
   },
-  "gitHead": "1ba182a59f53d49bfa6f69ed28a5d64d74085def"
+  "gitHead": "20859560661edb7cd35643e1afac242273156a5d"
 }

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

@@ -1,2 +0,0 @@
-export * from './src';
-export type * from './src';

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

@@ -1,2 +0,0 @@
-export * from './src';
-export type * from './src';

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

@@ -1,2 +0,0 @@
-export * from './src';
-export type * from './src';

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

@@ -1,2 +0,0 @@
-export * from './src';
-export type * from './src';

package/dist/types/cookie-consent/index.d.ts

@@ -1,2 +0,0 @@
-export * from './src';
-export type * from './src';

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

@@ -1,2 +0,0 @@
-export * from './src';
-export type * from './src';