@arkitektbedriftene/fe-lib 4.3.3 → 5.1.1

package/dist/ui/components/Dialog.d.ts

@@ -1,472 +1,356 @@
-import type { ComponentProps, ReactNode } from "react";
+import { ComponentProps, ReactNode } from 'react';
 import * as RDialog from "@radix-ui/react-dialog";
-declare const DialogContent: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<RDialog.DialogContentProps & import("react").RefAttributes<HTMLDivElement>>, {}, {
+declare const DialogContent: import('@stitches/react/types/styled-component').StyledComponent<import('react').ForwardRefExoticComponent<RDialog.DialogContentProps & import('react').RefAttributes<HTMLDivElement>>, {}, {
     lg: "(min-width: 1200px)";
     print: "print";
-}, import("@stitches/react/types/css-util").CSS<{
+}, import('@stitches/react/types/css-util').CSS<{
     lg: "(min-width: 1200px)";
     print: "print";
 }, {
     colors: {
-        gray50: string;
-        gray100: string;
-        gray200: string;
-        gray300: string;
-        gray400: string;
-        gray500: string;
-        gray600: string;
-        gray700: string;
-        gray800: string;
-        gray900: string;
-        blue50: string;
-        blue100: string;
-        blue200: string;
-        blue300: string;
-        blue400: string;
-        blue500: string;
-        blue600: string;
-        blue700: string;
-        blue800: string;
-        blue900: string;
-        yellow50: string;
-        yellow100: string;
-        yellow200: string;
-        yellow300: string;
-        yellow400: string;
-        yellow500: string;
-        yellow600: string;
-        yellow700: string;
-        yellow800: string;
-        yellow900: string;
-        orange500: string;
-        red50: string;
-        red100: string;
-        red200: string;
-        red300: string;
-        red400: string;
-        red500: string;
-        red600: string;
-        red700: string;
-        red800: string;
-        red900: string;
-        green50: string;
-        green100: string;
-        green200: string;
-        green300: string;
-        green400: string;
-        green500: string;
-        green600: string;
-        green700: string;
-        green800: string;
-        green900: string;
-        primaryTextOnLightBg: string;
-        primaryBg: string;
-        primaryBgHover: string;
-        primaryTextOnWhite: string;
-        bodyGray: string;
-        hoverDarker: string;
-        borderDarker: string;
-        selectedDarker: string;
-        selectedOnBodyGray: string;
-        darkGrayBg: string;
-        border: string;
-        text: string;
-        secondaryText: string;
-        focusRing: string;
+        gray50: "#F9FAFA";
+        gray100: "#EBEEEE";
+        gray200: "#CFD6D7";
+        gray300: "#B3BEC0";
+        gray400: "#97A6A8";
+        gray500: "#7C8E91";
+        gray600: "#627578";
+        gray700: "#4F5F61";
+        gray800: "#414D4F";
+        gray900: "#2C3435";
+        blue50: "#F7FBFB";
+        blue100: "#E3F0F2";
+        blue200: "#BADADF";
+        blue300: "#92C5CC";
+        blue400: "#67AEB8";
+        blue500: "#3C97A3";
+        blue600: "#1F7D8A";
+        blue700: "#19656F";
+        blue800: "#14525B";
+        blue900: "#0E383E";
+        yellow50: "#FDFAEF";
+        yellow100: "#F9EDCA";
+        yellow200: "#EFD27A";
+        yellow300: "#E5B626";
+        yellow400: "#C89E1C";
+        yellow500: "#AA8618";
+        yellow600: "#8C6E14";
+        yellow700: "#715910";
+        yellow800: "#5C490D";
+        yellow900: "#3E3109";
+        orange500: "#D1721C";
+        red50: "#FDF9F9";
+        red100: "#F7EBEB";
+        red200: "#EBCECD";
+        red300: "#DFB1B0";
+        red400: "#D39392";
+        red500: "#C67473";
+        red600: "#B85250";
+        red700: "#A92F2D";
+        red800: "#901F1E";
+        red900: "#631614";
+        green50: "#F8FAF9";
+        green100: "#E7F0EA";
+        green200: "#C5D9CB";
+        green300: "#A4C4AD";
+        green400: "#82AD8D";
+        green500: "#60976F";
+        green600: "#3C7F4E";
+        green700: "#296839";
+        green800: "#21552F";
+        green900: "#163920";
+        primaryTextOnLightBg: "#194b58";
+        primaryBg: "$blue600";
+        primaryBgHover: "$blue700";
+        primaryTextOnWhite: "$blue600";
+        bodyGray: "$gray100";
+        hoverDarker: "hsla(214deg, 25%, 21%, 0.06)";
+        borderDarker: "hsla(214deg, 25%, 21%, 0.1)";
+        selectedDarker: "hsla(214deg, 25%, 21%, 0.06)";
+        selectedOnBodyGray: "hsl(214deg, 35%, 80%)";
+        darkGrayBg: "#1f2937";
+        border: "hsl(214deg, 25%, 80%)";
+        text: "#1f2937";
+        secondaryText: "$gray500";
+        focusRing: "hsla(214deg, 15%, 10%, 0.6)";
     };
     fontSizes: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        "2xl": string;
-        "3xl": string;
+        xs: "0.75rem";
+        sm: "0.875rem";
+        md: "1rem";
+        lg: "1.125rem";
+        xl: "1.25rem";
+        "2xl": "1.5rem";
+        "3xl": "1.875rem";
     };
     fontWeights: {
-        normal: string;
-        medium: string;
-        bold: string;
+        normal: "var(--ui-font-weight-normal)";
+        medium: "var(--ui-font-weight-semibold)";
+        bold: "var(--ui-font-weight-bold)";
     };
     space: {
-        1: string;
-        2: string;
-        3: string;
-        4: string;
-        6: string;
-        8: string;
+        1: "0.25rem";
+        2: "0.5rem";
+        3: "0.75rem";
+        4: "1rem";
+        6: "1.5rem";
+        8: "2rem";
     };
     shadows: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        overlayCard: string;
+        xs: "0 1px 2px 0 rgba(0, 0, 0, 0.05)";
+        sm: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+        md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+        lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+        overlayCard: "0 5px 50px 0px rgb(0 0 0 / 0.15), 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
     };
     radii: {
-        xs: string;
-        sm: string;
-        md: string;
-        mdmd: string;
-        full: string;
+        xs: "0.125rem";
+        sm: "0.25rem";
+        md: "0.5rem";
+        mdmd: "calc(0.5rem - 0.125rem)";
+        full: "9999px";
     };
     zIndices: {
         toast: number;
         overlayCard: number;
     };
-}, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
+}, import('@stitches/react/types/config').DefaultThemeMap, {}>>;
 export declare const Dialog: ({ children, open, onOpenChange, trigger, css, contentProps, }: {
     children: ReactNode;
     open: boolean;
     onOpenChange: (bool: boolean) => void;
     trigger?: ReactNode;
     css?: ComponentProps<typeof DialogContent>["css"];
-    contentProps?: (Omit<RDialog.DialogContentProps & import("react").RefAttributes<HTMLDivElement>, "css"> & import("@stitches/react/types/styled-component").TransformProps<{}, {
-        lg: "(min-width: 1200px)";
-        print: "print";
-    }> & {
-        css?: import("@stitches/react/types/css-util").CSS<{
-            lg: "(min-width: 1200px)";
-            print: "print";
-        }, {
-            colors: {
-                gray50: string;
-                gray100: string;
-                gray200: string;
-                gray300: string;
-                gray400: string;
-                gray500: string;
-                gray600: string;
-                gray700: string;
-                gray800: string;
-                gray900: string;
-                blue50: string;
-                blue100: string;
-                blue200: string;
-                blue300: string;
-                blue400: string;
-                blue500: string;
-                blue600: string;
-                blue700: string;
-                blue800: string;
-                blue900: string;
-                yellow50: string;
-                yellow100: string;
-                yellow200: string;
-                yellow300: string;
-                yellow400: string;
-                yellow500: string;
-                yellow600: string;
-                yellow700: string;
-                yellow800: string;
-                yellow900: string;
-                orange500: string;
-                red50: string;
-                red100: string;
-                red200: string;
-                red300: string;
-                red400: string;
-                red500: string;
-                red600: string;
-                red700: string;
-                red800: string;
-                red900: string;
-                green50: string;
-                green100: string;
-                green200: string;
-                green300: string;
-                green400: string;
-                green500: string;
-                green600: string;
-                green700: string;
-                green800: string;
-                green900: string;
-                primaryTextOnLightBg: string;
-                primaryBg: string;
-                primaryBgHover: string;
-                primaryTextOnWhite: string;
-                bodyGray: string;
-                hoverDarker: string;
-                borderDarker: string;
-                selectedDarker: string;
-                selectedOnBodyGray: string;
-                darkGrayBg: string;
-                border: string;
-                text: string;
-                secondaryText: string;
-                focusRing: string;
-            };
-            fontSizes: {
-                xs: string;
-                sm: string;
-                md: string;
-                lg: string;
-                xl: string;
-                "2xl": string;
-                "3xl": string;
-            };
-            fontWeights: {
-                normal: string;
-                medium: string;
-                bold: string;
-            };
-            space: {
-                1: string;
-                2: string;
-                3: string;
-                4: string;
-                6: string;
-                8: string;
-            };
-            shadows: {
-                xs: string;
-                sm: string;
-                md: string;
-                lg: string;
-                overlayCard: string;
-            };
-            radii: {
-                xs: string;
-                sm: string;
-                md: string;
-                mdmd: string;
-                full: string;
-            };
-            zIndices: {
-                toast: number;
-                overlayCard: number;
-            };
-        }, import("@stitches/react/types/config").DefaultThemeMap, {}> | undefined;
-    }) | undefined;
+    contentProps?: ComponentProps<typeof DialogContent>;
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const DialogHeader: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<RDialog.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>, {}, {
+export declare const DialogHeader: import('@stitches/react/types/styled-component').StyledComponent<import('react').ForwardRefExoticComponent<RDialog.DialogTitleProps & import('react').RefAttributes<HTMLHeadingElement>>, {}, {
     lg: "(min-width: 1200px)";
     print: "print";
-}, import("@stitches/react/types/css-util").CSS<{
+}, import('@stitches/react/types/css-util').CSS<{
     lg: "(min-width: 1200px)";
     print: "print";
 }, {
     colors: {
-        gray50: string;
-        gray100: string;
-        gray200: string;
-        gray300: string;
-        gray400: string;
-        gray500: string;
-        gray600: string;
-        gray700: string;
-        gray800: string;
-        gray900: string;
-        blue50: string;
-        blue100: string;
-        blue200: string;
-        blue300: string;
-        blue400: string;
-        blue500: string;
-        blue600: string;
-        blue700: string;
-        blue800: string;
-        blue900: string;
-        yellow50: string;
-        yellow100: string;
-        yellow200: string;
-        yellow300: string;
-        yellow400: string;
-        yellow500: string;
-        yellow600: string;
-        yellow700: string;
-        yellow800: string;
-        yellow900: string;
-        orange500: string;
-        red50: string;
-        red100: string;
-        red200: string;
-        red300: string;
-        red400: string;
-        red500: string;
-        red600: string;
-        red700: string;
-        red800: string;
-        red900: string;
-        green50: string;
-        green100: string;
-        green200: string;
-        green300: string;
-        green400: string;
-        green500: string;
-        green600: string;
-        green700: string;
-        green800: string;
-        green900: string;
-        primaryTextOnLightBg: string;
-        primaryBg: string;
-        primaryBgHover: string;
-        primaryTextOnWhite: string;
-        bodyGray: string;
-        hoverDarker: string;
-        borderDarker: string;
-        selectedDarker: string;
-        selectedOnBodyGray: string;
-        darkGrayBg: string;
-        border: string;
-        text: string;
-        secondaryText: string;
-        focusRing: string;
+        gray50: "#F9FAFA";
+        gray100: "#EBEEEE";
+        gray200: "#CFD6D7";
+        gray300: "#B3BEC0";
+        gray400: "#97A6A8";
+        gray500: "#7C8E91";
+        gray600: "#627578";
+        gray700: "#4F5F61";
+        gray800: "#414D4F";
+        gray900: "#2C3435";
+        blue50: "#F7FBFB";
+        blue100: "#E3F0F2";
+        blue200: "#BADADF";
+        blue300: "#92C5CC";
+        blue400: "#67AEB8";
+        blue500: "#3C97A3";
+        blue600: "#1F7D8A";
+        blue700: "#19656F";
+        blue800: "#14525B";
+        blue900: "#0E383E";
+        yellow50: "#FDFAEF";
+        yellow100: "#F9EDCA";
+        yellow200: "#EFD27A";
+        yellow300: "#E5B626";
+        yellow400: "#C89E1C";
+        yellow500: "#AA8618";
+        yellow600: "#8C6E14";
+        yellow700: "#715910";
+        yellow800: "#5C490D";
+        yellow900: "#3E3109";
+        orange500: "#D1721C";
+        red50: "#FDF9F9";
+        red100: "#F7EBEB";
+        red200: "#EBCECD";
+        red300: "#DFB1B0";
+        red400: "#D39392";
+        red500: "#C67473";
+        red600: "#B85250";
+        red700: "#A92F2D";
+        red800: "#901F1E";
+        red900: "#631614";
+        green50: "#F8FAF9";
+        green100: "#E7F0EA";
+        green200: "#C5D9CB";
+        green300: "#A4C4AD";
+        green400: "#82AD8D";
+        green500: "#60976F";
+        green600: "#3C7F4E";
+        green700: "#296839";
+        green800: "#21552F";
+        green900: "#163920";
+        primaryTextOnLightBg: "#194b58";
+        primaryBg: "$blue600";
+        primaryBgHover: "$blue700";
+        primaryTextOnWhite: "$blue600";
+        bodyGray: "$gray100";
+        hoverDarker: "hsla(214deg, 25%, 21%, 0.06)";
+        borderDarker: "hsla(214deg, 25%, 21%, 0.1)";
+        selectedDarker: "hsla(214deg, 25%, 21%, 0.06)";
+        selectedOnBodyGray: "hsl(214deg, 35%, 80%)";
+        darkGrayBg: "#1f2937";
+        border: "hsl(214deg, 25%, 80%)";
+        text: "#1f2937";
+        secondaryText: "$gray500";
+        focusRing: "hsla(214deg, 15%, 10%, 0.6)";
     };
     fontSizes: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        "2xl": string;
-        "3xl": string;
+        xs: "0.75rem";
+        sm: "0.875rem";
+        md: "1rem";
+        lg: "1.125rem";
+        xl: "1.25rem";
+        "2xl": "1.5rem";
+        "3xl": "1.875rem";
     };
     fontWeights: {
-        normal: string;
-        medium: string;
-        bold: string;
+        normal: "var(--ui-font-weight-normal)";
+        medium: "var(--ui-font-weight-semibold)";
+        bold: "var(--ui-font-weight-bold)";
     };
     space: {
-        1: string;
-        2: string;
-        3: string;
-        4: string;
-        6: string;
-        8: string;
+        1: "0.25rem";
+        2: "0.5rem";
+        3: "0.75rem";
+        4: "1rem";
+        6: "1.5rem";
+        8: "2rem";
     };
     shadows: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        overlayCard: string;
+        xs: "0 1px 2px 0 rgba(0, 0, 0, 0.05)";
+        sm: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+        md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+        lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+        overlayCard: "0 5px 50px 0px rgb(0 0 0 / 0.15), 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
     };
     radii: {
-        xs: string;
-        sm: string;
-        md: string;
-        mdmd: string;
-        full: string;
+        xs: "0.125rem";
+        sm: "0.25rem";
+        md: "0.5rem";
+        mdmd: "calc(0.5rem - 0.125rem)";
+        full: "9999px";
     };
     zIndices: {
         toast: number;
         overlayCard: number;
     };
-}, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
-export declare const DialogActions: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
+}, import('@stitches/react/types/config').DefaultThemeMap, {}>>;
+export declare const DialogActions: import('@stitches/react/types/styled-component').StyledComponent<"div", {}, {
     lg: "(min-width: 1200px)";
     print: "print";
-}, import("@stitches/react/types/css-util").CSS<{
+}, import('@stitches/react/types/css-util').CSS<{
     lg: "(min-width: 1200px)";
     print: "print";
 }, {
     colors: {
-        gray50: string;
-        gray100: string;
-        gray200: string;
-        gray300: string;
-        gray400: string;
-        gray500: string;
-        gray600: string;
-        gray700: string;
-        gray800: string;
-        gray900: string;
-        blue50: string;
-        blue100: string;
-        blue200: string;
-        blue300: string;
-        blue400: string;
-        blue500: string;
-        blue600: string;
-        blue700: string;
-        blue800: string;
-        blue900: string;
-        yellow50: string;
-        yellow100: string;
-        yellow200: string;
-        yellow300: string;
-        yellow400: string;
-        yellow500: string;
-        yellow600: string;
-        yellow700: string;
-        yellow800: string;
-        yellow900: string;
-        orange500: string;
-        red50: string;
-        red100: string;
-        red200: string;
-        red300: string;
-        red400: string;
-        red500: string;
-        red600: string;
-        red700: string;
-        red800: string;
-        red900: string;
-        green50: string;
-        green100: string;
-        green200: string;
-        green300: string;
-        green400: string;
-        green500: string;
-        green600: string;
-        green700: string;
-        green800: string;
-        green900: string;
-        primaryTextOnLightBg: string;
-        primaryBg: string;
-        primaryBgHover: string;
-        primaryTextOnWhite: string;
-        bodyGray: string;
-        hoverDarker: string;
-        borderDarker: string;
-        selectedDarker: string;
-        selectedOnBodyGray: string;
-        darkGrayBg: string;
-        border: string;
-        text: string;
-        secondaryText: string;
-        focusRing: string;
+        gray50: "#F9FAFA";
+        gray100: "#EBEEEE";
+        gray200: "#CFD6D7";
+        gray300: "#B3BEC0";
+        gray400: "#97A6A8";
+        gray500: "#7C8E91";
+        gray600: "#627578";
+        gray700: "#4F5F61";
+        gray800: "#414D4F";
+        gray900: "#2C3435";
+        blue50: "#F7FBFB";
+        blue100: "#E3F0F2";
+        blue200: "#BADADF";
+        blue300: "#92C5CC";
+        blue400: "#67AEB8";
+        blue500: "#3C97A3";
+        blue600: "#1F7D8A";
+        blue700: "#19656F";
+        blue800: "#14525B";
+        blue900: "#0E383E";
+        yellow50: "#FDFAEF";
+        yellow100: "#F9EDCA";
+        yellow200: "#EFD27A";
+        yellow300: "#E5B626";
+        yellow400: "#C89E1C";
+        yellow500: "#AA8618";
+        yellow600: "#8C6E14";
+        yellow700: "#715910";
+        yellow800: "#5C490D";
+        yellow900: "#3E3109";
+        orange500: "#D1721C";
+        red50: "#FDF9F9";
+        red100: "#F7EBEB";
+        red200: "#EBCECD";
+        red300: "#DFB1B0";
+        red400: "#D39392";
+        red500: "#C67473";
+        red600: "#B85250";
+        red700: "#A92F2D";
+        red800: "#901F1E";
+        red900: "#631614";
+        green50: "#F8FAF9";
+        green100: "#E7F0EA";
+        green200: "#C5D9CB";
+        green300: "#A4C4AD";
+        green400: "#82AD8D";
+        green500: "#60976F";
+        green600: "#3C7F4E";
+        green700: "#296839";
+        green800: "#21552F";
+        green900: "#163920";
+        primaryTextOnLightBg: "#194b58";
+        primaryBg: "$blue600";
+        primaryBgHover: "$blue700";
+        primaryTextOnWhite: "$blue600";
+        bodyGray: "$gray100";
+        hoverDarker: "hsla(214deg, 25%, 21%, 0.06)";
+        borderDarker: "hsla(214deg, 25%, 21%, 0.1)";
+        selectedDarker: "hsla(214deg, 25%, 21%, 0.06)";
+        selectedOnBodyGray: "hsl(214deg, 35%, 80%)";
+        darkGrayBg: "#1f2937";
+        border: "hsl(214deg, 25%, 80%)";
+        text: "#1f2937";
+        secondaryText: "$gray500";
+        focusRing: "hsla(214deg, 15%, 10%, 0.6)";
     };
     fontSizes: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        "2xl": string;
-        "3xl": string;
+        xs: "0.75rem";
+        sm: "0.875rem";
+        md: "1rem";
+        lg: "1.125rem";
+        xl: "1.25rem";
+        "2xl": "1.5rem";
+        "3xl": "1.875rem";
     };
     fontWeights: {
-        normal: string;
-        medium: string;
-        bold: string;
+        normal: "var(--ui-font-weight-normal)";
+        medium: "var(--ui-font-weight-semibold)";
+        bold: "var(--ui-font-weight-bold)";
     };
     space: {
-        1: string;
-        2: string;
-        3: string;
-        4: string;
-        6: string;
-        8: string;
+        1: "0.25rem";
+        2: "0.5rem";
+        3: "0.75rem";
+        4: "1rem";
+        6: "1.5rem";
+        8: "2rem";
     };
     shadows: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        overlayCard: string;
+        xs: "0 1px 2px 0 rgba(0, 0, 0, 0.05)";
+        sm: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
+        md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
+        lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
+        overlayCard: "0 5px 50px 0px rgb(0 0 0 / 0.15), 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
     };
     radii: {
-        xs: string;
-        sm: string;
-        md: string;
-        mdmd: string;
-        full: string;
+        xs: "0.125rem";
+        sm: "0.25rem";
+        md: "0.5rem";
+        mdmd: "calc(0.5rem - 0.125rem)";
+        full: "9999px";
     };
     zIndices: {
         toast: number;
         overlayCard: number;
     };
-}, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
+}, import('@stitches/react/types/config').DefaultThemeMap, {}>>;
 export {};