@arkitektbedriftene/fe-lib 4.3.2 → 5.1.0

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

@@ -1,17 +1,16 @@
-/// <reference types="react" />
-import { type OffsetOptions, type Placement, offset, type UseRoleProps } from "@floating-ui/react";
-import { type OverlayCardProps } from "./OverlayCard";
+import { OffsetOptions, Placement, UseRoleProps } from '@floating-ui/react';
+import { OverlayCardProps } from './OverlayCard';
 export declare const Popover: ({ children, offset: offsetOptions, open, onOpenChange, trigger, hoverDelay, placement, role: popoverRole, }: {
     children: React.ReactNode;
-    offset?: OffsetOptions | undefined;
+    offset?: OffsetOptions;
     open: boolean;
     onOpenChange: (open: boolean) => void;
-    trigger?: "click" | "hover" | undefined;
+    trigger?: "click" | "hover";
     hoverDelay?: number | {
         open: number;
         close: number;
-    } | undefined;
-    placement?: Placement | undefined;
+    };
+    placement?: Placement;
     role?: UseRoleProps["role"];
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const PopoverTrigger: ({ children }: {
@@ -19,121 +18,5 @@ export declare const PopoverTrigger: ({ children }: {
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const PopoverContent: ({ children, overlayCardProps }: {
     children: React.ReactNode;
-    overlayCardProps?: (Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, 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;
+    overlayCardProps?: OverlayCardProps;
 }) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -1,121 +1,120 @@
-/// <reference types="react" />
-export declare const Spinner: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color" | "css" | "size"> & import("@stitches/react/types/styled-component").TransformProps<{
+export declare const Spinner: import('react').ForwardRefExoticComponent<Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color" | "css" | "size"> & import('@stitches/react/types/styled-component').TransformProps<{
     size?: "xs" | "sm" | "md" | "lg" | undefined;
     color?: "inherit" | "dark" | "light" | undefined;
 }, {
     lg: "(min-width: 1200px)";
     print: "print";
 }> & {
-    css?: import("@stitches/react/types/css-util").CSS<{
+    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, {}> | undefined;
-}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    }, import('@stitches/react/types/config').DefaultThemeMap, {}> | undefined;
+}, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

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

@@ -1,119 +1,119 @@
-export declare const Stack: import("@stitches/react/types/styled-component").StyledComponent<"div", {
+export declare const Stack: import('@stitches/react/types/styled-component').StyledComponent<"div", {
     direction?: "column" | "row" | undefined;
     align?: "start" | "center" | undefined;
-    gap?: 0 | 1 | "0" | "1" | "2" | "3" | 2 | 3 | 4 | "4" | "5" | "6" | "8" | 6 | 8 | 5 | 7 | "7" | undefined;
+    gap?: 0 | 3 | 1 | "0" | "1" | "2" | "3" | 2 | 4 | "4" | "5" | "6" | "8" | 6 | 8 | "7" | 5 | 7 | undefined;
 }, {
     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, {}>>;