@arkitektbedriftene/fe-lib 0.4.16 → 0.4.18

package/dist/rich-text.es.js

@@ -11,7 +11,7 @@ import { HeadingNode as le, QuoteNode as se, $isHeadingNode as ce, $createHeadin
 import { TableNode as he, TableRowNode as pe, TableCellNode as ge, INSERT_TABLE_COMMAND as fe, $getTableCellNodeFromLexicalNode as me, $deleteTableColumn__EXPERIMENTAL as ke, $deleteTableRow__EXPERIMENTAL as be, $insertTableColumn__EXPERIMENTAL as ct, $insertTableRow__EXPERIMENTAL as dt } from "@lexical/table";
 import { jsx as n, jsxs as f, Fragment as Y } from "react/jsx-runtime";
 import { createContext as ve, useState as b, useRef as et, useCallback as v, useContext as Ce, useEffect as N, useMemo as Lt, useLayoutEffect as Me } from "react";
-import { c as O, s as Tt, D as rt, T as Nt, a as M, B as P, b as yt, d as z, u as nt, e as xt, f as Le, g as Te, o as Et, h as Ne, i as St, j as wt, F as Rt, O as It, k as ye, l as xe, S as Ee, m as $, n as I, p as ut, q as Se, N as we, r as ht, t as Re, v as zt, C as Ie, w as ze, x as _e } from "./Checkbox-38e85f9b.js";
+import { c as O, s as Tt, D as rt, T as Nt, a as M, B as P, b as yt, d as z, u as nt, e as xt, f as Le, g as Te, o as Et, h as Ne, i as St, j as wt, F as Rt, O as It, k as ye, l as xe, S as Ee, m as $, n as I, p as ut, q as Se, N as we, r as ht, t as Re, v as zt, C as Ie, w as ze, x as _e } from "./Checkbox-a342242a.js";
 import "react-select";
 import { LexicalComposer as $e } from "@lexical/react/LexicalComposer.js";
 import { RichTextPlugin as Oe } from "@lexical/react/LexicalRichTextPlugin.js";

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

@@ -1,9 +1,242 @@
-import type { ReactNode } from "react";
-export declare const Dialog: ({ children, open, onOpenChange, trigger, }: {
+import type { 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>>, {}, {
+    lg: "(min-width: 1200px)";
+    print: "print";
+}, 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, {}>>;
+export declare const Dialog: ({ children, open, onOpenChange, trigger, css, }: {
     children: ReactNode;
     open: boolean;
     onOpenChange: (bool: boolean) => void;
     trigger?: ReactNode;
+    css?: Pick<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;
+    }, "css"> | undefined;
 }) => JSX.Element;
 export declare const DialogHeader: import("@stitches/react/types/styled-component").StyledComponent<"h2", {}, {
     lg: "(min-width: 1200px)";
@@ -235,3 +468,4 @@ export declare const DialogActions: import("@stitches/react/types/styled-compone
         overlayCard: number;
     };
 }, import("@stitches/react/types/config").DefaultThemeMap, {}>>;
+export {};

package/dist/ui/components/Form/ReactSelect.d.ts

@@ -1,3 +1,97 @@
 /// <reference types="react" />
-import Select from "react-select";
-export declare const ReactSelect: ({ styles, components, ...props }: React.ComponentProps<typeof Select>) => JSX.Element;
+import Select, { type StylesConfig } from "react-select";
+export declare const ReactSelect: ({ styles, components, error, ...props }: Omit<Pick<import("react-select/dist/declarations/src/Select").Props<unknown, boolean, import("react-select").GroupBase<unknown>>, "form" | "value" | "theme" | "onBlur" | "className" | "id" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onChange" | "onKeyDown" | "name" | "autoFocus" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "required"> & {
+    isLoading?: boolean | undefined;
+    placeholder?: import("react").ReactNode;
+    tabIndex?: number | undefined;
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    options?: import("react-select").OptionsOrGroups<unknown, import("react-select").GroupBase<unknown>> | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    classNames?: import("react-select").ClassNamesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<unknown, boolean, import("react-select").GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: import("react-select").GroupBase<unknown>) => import("react").ReactNode) | undefined;
+    getOptionLabel?: import("react-select").GetOptionLabel<unknown> | undefined;
+    getOptionValue?: import("react-select").GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: import("react-select").Options<unknown>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => import("react").ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: import("react-select").MenuPlacement | undefined;
+    menuPosition?: import("react-select").MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => import("react").ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    pageSize?: number | undefined;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+    tabSelectsValue?: boolean | undefined;
+    unstyled?: boolean | undefined;
+} & {}, "value" | "onChange" | "inputValue" | "menuIsOpen" | "onInputChange" | "onMenuOpen" | "onMenuClose"> & Partial<Pick<import("react-select/dist/declarations/src/Select").Props<unknown, boolean, import("react-select").GroupBase<unknown>>, "form" | "value" | "theme" | "onBlur" | "className" | "id" | "aria-errormessage" | "aria-invalid" | "aria-label" | "aria-labelledby" | "onFocus" | "onChange" | "onKeyDown" | "name" | "autoFocus" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputValue" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "required"> & {
+    isLoading?: boolean | undefined;
+    placeholder?: import("react").ReactNode;
+    tabIndex?: number | undefined;
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    options?: import("react-select").OptionsOrGroups<unknown, import("react-select").GroupBase<unknown>> | undefined;
+    backspaceRemovesValue?: boolean | undefined;
+    blurInputOnSelect?: boolean | undefined;
+    captureMenuScroll?: boolean | undefined;
+    classNames?: import("react-select").ClassNamesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+    closeMenuOnSelect?: boolean | undefined;
+    closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
+    components?: Partial<import("react-select/dist/declarations/src/components").SelectComponents<unknown, boolean, import("react-select").GroupBase<unknown>>> | undefined;
+    controlShouldRenderValue?: boolean | undefined;
+    escapeClearsValue?: boolean | undefined;
+    filterOption?: ((option: import("react-select/dist/declarations/src/filters").FilterOptionOption<unknown>, inputValue: string) => boolean) | null | undefined;
+    formatGroupLabel?: ((group: import("react-select").GroupBase<unknown>) => import("react").ReactNode) | undefined;
+    getOptionLabel?: import("react-select").GetOptionLabel<unknown> | undefined;
+    getOptionValue?: import("react-select").GetOptionValue<unknown> | undefined;
+    isDisabled?: boolean | undefined;
+    isOptionDisabled?: ((option: unknown, selectValue: import("react-select").Options<unknown>) => boolean) | undefined;
+    isMulti?: boolean | undefined;
+    isRtl?: boolean | undefined;
+    isSearchable?: boolean | undefined;
+    loadingMessage?: ((obj: {
+        inputValue: string;
+    }) => import("react").ReactNode) | undefined;
+    minMenuHeight?: number | undefined;
+    maxMenuHeight?: number | undefined;
+    menuIsOpen?: boolean | undefined;
+    menuPlacement?: import("react-select").MenuPlacement | undefined;
+    menuPosition?: import("react-select").MenuPosition | undefined;
+    menuShouldBlockScroll?: boolean | undefined;
+    menuShouldScrollIntoView?: boolean | undefined;
+    noOptionsMessage?: ((obj: {
+        inputValue: string;
+    }) => import("react").ReactNode) | undefined;
+    openMenuOnFocus?: boolean | undefined;
+    openMenuOnClick?: boolean | undefined;
+    pageSize?: number | undefined;
+    screenReaderStatus?: ((obj: {
+        count: number;
+    }) => string) | undefined;
+    styles?: StylesConfig<unknown, boolean, import("react-select").GroupBase<unknown>> | undefined;
+    tabSelectsValue?: boolean | undefined;
+    unstyled?: boolean | undefined;
+} & {}> & import("react-select/dist/declarations/src/useStateManager").StateManagerAdditionalProps<unknown> & import("react").RefAttributes<import("react-select/dist/declarations/src/Select").default<unknown, boolean, import("react-select").GroupBase<unknown>>> & {
+    error?: string | boolean | undefined;
+}) => JSX.Element;

package/dist/ui/components/Form/Select.d.ts

@@ -4,6 +4,7 @@ import type { GroupBase, Props } from "react-select";
 type SelectProps = {
     label?: string;
     css?: CSS;
+    error?: boolean | string;
 };
-export declare const Select: <Option, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>({ label, css, ...props }: SelectProps & Omit<Props<Option, IsMulti, Group>, "isMulti" | "isSearchable">) => JSX.Element;
+export declare const Select: <Option, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>({ label, css, error, ...props }: SelectProps & Omit<Props<Option, IsMulti, Group>, "isMulti" | "isSearchable">) => JSX.Element;
 export {};

package/dist/ui.es.js

@@ -1,6 +1,6 @@
-import { P as l, y as p, z as i, B as r, R as m } from "./Checkbox-38e85f9b.js";
-import { H as y, Q as M, I as k, m as w, J as A, K as O, X as P, C as $, q as z, v as N, L as j, D as G, W as H, a as R, n as q, p as E, U as J, N as K, r as L, O as Q, S as U, M as V, t as W, k as X, T as F, l as Y, b as Z, d as _, c as oo, G as ao, E as so, A as eo, V as ro, s as to } from "./Checkbox-38e85f9b.js";
-import { jsxs as t, jsx as a } from "react/jsx-runtime";
+import { P as l, y as p, z as i, B as t, R as m } from "./Checkbox-a342242a.js";
+import { H as D, Q as M, I as $, m as k, J as w, K as A, X as O, C as P, q as z, v as N, L as j, D as G, W as H, a as R, n as q, p as E, U as J, N as K, r as L, O as Q, S as U, M as V, t as W, k as X, T as F, l as Y, b as Z, d as _, c as oo, G as ao, E as so, A as eo, V as ro, s as to } from "./Checkbox-a342242a.js";
+import { jsxs as n, jsx as a } from "react/jsx-runtime";
 import { useState as c } from "react";
 import "react-dom";
 import "@radix-ui/react-toolbar";
@@ -9,19 +9,19 @@ import "@radix-ui/react-dialog";
 import "@radix-ui/react-dropdown-menu";
 import "react-select";
 import "@radix-ui/react-checkbox";
-const I = ({ children: o, content: s }) => {
-  const [e, n] = c(!1);
-  return /* @__PURE__ */ t(
+const h = ({ children: s, content: e }) => {
+  const [o, r] = c(!1);
+  return /* @__PURE__ */ n(
     l,
     {
-      open: e,
-      onOpenChange: n,
+      open: o,
+      onOpenChange: r,
       trigger: "hover",
       placement: "top",
       offset: { mainAxis: 8 },
       role: "tooltip",
       children: [
-        /* @__PURE__ */ a(p, { children: o }),
+        /* @__PURE__ */ a(p, { children: s }),
         /* @__PURE__ */ a(i, { overlayCardProps: {
           css: {
             background: "rgba(0,0,0, 0.9)",
@@ -29,17 +29,18 @@ const I = ({ children: o, content: s }) => {
             fontSize: "$sm",
             padding: "$1 $2"
           }
-        }, children: s })
+        }, children: e })
       ]
     }
   );
-}, h = ({
-  label: o,
-  css: s,
-  ...e
-}) => /* @__PURE__ */ t(r, { css: s, children: [
-  o && /* @__PURE__ */ a(
-    r,
+}, I = ({
+  label: s,
+  css: e,
+  error: o,
+  ...r
+}) => /* @__PURE__ */ n(t, { css: e, children: [
+  s && /* @__PURE__ */ a(
+    t,
     {
       as: "label",
       css: {
@@ -47,21 +48,30 @@ const I = ({ children: o, content: s }) => {
         marginBottom: "$2",
         fontSize: "$md"
       },
-      children: o
+      children: s
     }
   ),
-  /* @__PURE__ */ a(m, { ...e, isSearchable: !1, isMulti: !1 })
+  /* @__PURE__ */ a(
+    m,
+    {
+      ...r,
+      error: o,
+      isSearchable: !1,
+      isMulti: !1
+    }
+  ),
+  typeof o == "string" && /* @__PURE__ */ a(t, { css: { color: "$red600", fontSize: "$sm", marginTop: "$2" }, children: o })
 ] });
 export {
-  y as Alert,
+  D as Alert,
   M as Avatar,
-  k as Badge,
-  r as Box,
-  w as Button,
-  A as ButtonInToolbar,
-  O as Card,
-  P as Checkbox,
-  $ as Combobox,
+  $ as Badge,
+  t as Box,
+  k as Button,
+  w as ButtonInToolbar,
+  A as Card,
+  O as Checkbox,
+  P as Combobox,
   z as Dialog,
   N as DialogActions,
   j as DialogHeader,
@@ -77,7 +87,7 @@ export {
   l as Popover,
   i as PopoverContent,
   p as PopoverTrigger,
-  h as Select,
+  I as Select,
   U as Spinner,
   V as Stack,
   W as TextInput,
@@ -86,7 +96,7 @@ export {
   Y as ToolbarSeparator,
   Z as ToolbarToggleGroup,
   _ as ToolbarToggleItem,
-  I as Tooltip,
+  h as Tooltip,
   oo as css,
   ao as getCssText,
   so as globalCss,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arkitektbedriftene/fe-lib",
-  "version": "0.4.16",
+  "version": "0.4.18",
   "type": "module",
   "exports": {
     ".": {