@altinn/altinn-components 0.6.2 → 0.6.3

package/dist/components/Icon/CheckboxCheckedIcon.js

@@ -0,0 +1,27 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+const t = ({ title: l = "Checkbox", className: C }) => /* @__PURE__ */ o(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: C,
+    children: [
+      /* @__PURE__ */ e("title", { children: l }),
+      /* @__PURE__ */ e(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M2.5 0C1.11929 0 0 1.11929 0 2.5V21.5C0 22.8807 1.11929 24 2.5 24H21.5C22.8807 24 24 22.8807 24 21.5V2.5C24 1.11929 22.8807 0 21.5 0H2.5ZM18.5547 5.76815C19.0142 6.07451 19.1384 6.69538 18.8321 7.1549L11.6321 17.9549C11.4659 18.2042 11.1967 18.3658 10.8985 18.3953C10.6004 18.4249 10.3047 18.3192 10.0929 18.1073L5.29289 13.3073C4.90237 12.9168 4.90237 12.2836 5.29289 11.8931C5.68342 11.5026 6.31658 11.5026 6.70711 11.8931L10.6446 15.8306L17.1679 6.0455C17.4743 5.58598 18.0952 5.4618 18.5547 5.76815Z",
+          fill: "black"
+        }
+      )
+    ]
+  }
+);
+export {
+  t as CheckboxCheckedIcon
+};

package/dist/components/Icon/CheckboxIcon.d.ts

@@ -0,0 +1,10 @@
+export type CheckboxIconProps = {
+    checked: boolean;
+    hover?: boolean;
+    title?: string;
+    className?: string;
+};
+/**
+ * Checkbox for lists and list items
+ */
+export declare const CheckboxIcon: ({ checked, title, hover, className }: CheckboxIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CheckboxIcon.js

@@ -0,0 +1,10 @@
+import { jsx as c } from "react/jsx-runtime";
+import { CheckboxCheckedIcon as h } from "./CheckboxCheckedIcon.js";
+import { CheckboxUncheckedIcon as k } from "./CheckboxUncheckedIcon.js";
+const s = ({ checked: e, title: r = "checkbox", hover: n = !1, className: t }) => {
+  const o = { title: r, className: t };
+  return e ? /* @__PURE__ */ c(h, { ...o }) : /* @__PURE__ */ c(k, { ...o, hover: n });
+};
+export {
+  s as CheckboxIcon
+};

package/dist/components/Icon/CheckboxIcon.stories.js

@@ -0,0 +1,27 @@
+import { CheckboxIcon as e } from "./CheckboxIcon.js";
+const c = {
+  title: "Atoms/Icon/CheckboxIcon",
+  component: e,
+  tags: ["autodocs"],
+  parameters: {},
+  args: {}
+}, t = {
+  args: {
+    checked: !1
+  }
+}, s = {
+  args: {
+    checked: !1,
+    hover: !0
+  }
+}, a = {
+  args: {
+    checked: !0
+  }
+};
+export {
+  a as Checked,
+  t as Default,
+  s as Hover,
+  c as default
+};

package/dist/components/Icon/CheckboxUncheckedIcon.d.ts

@@ -0,0 +1,9 @@
+export type CheckboxUncheckedIconProps = {
+    title?: string;
+    className?: string;
+    hover?: boolean;
+};
+/**
+ * Checkbox for lists and list items
+ */
+export declare const CheckboxUncheckedIcon: ({ title, className, hover }: CheckboxUncheckedIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CheckboxUncheckedIcon.js

@@ -0,0 +1,37 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+const n = ({ title: l = "Checkbox", className: o, hover: d = !1 }) => /* @__PURE__ */ t(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: o,
+    children: [
+      /* @__PURE__ */ e("title", { children: l }),
+      /* @__PURE__ */ e(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M21.5 2.5H2.5V21.5H21.5V2.5ZM2.5 0C1.11929 0 0 1.11929 0 2.5V21.5C0 22.8807 1.11929 24 2.5 24H21.5C22.8807 24 24 22.8807 24 21.5V2.5C24 1.11929 22.8807 0 21.5 0H2.5Z",
+          fill: "black"
+        }
+      ),
+      d && /* @__PURE__ */ e(
+        "path",
+        {
+          "data-hover": !0,
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M18.5547 5.76815C19.0142 6.07451 19.1384 6.69538 18.8321 7.1549L11.6321 17.9549C11.4659 18.2042 11.1967 18.3658 10.8985 18.3953C10.6004 18.4249 10.3047 18.3192 10.0929 18.1073L5.29289 13.3073C4.90237 12.9168 4.90237 12.2836 5.29289 11.8931C5.68342 11.5026 6.31658 11.5026 6.70711 11.8931L10.6446 15.8306L17.1679 6.0455C17.4743 5.58598 18.0952 5.4618 18.5547 5.76815Z",
+          fill: "currentColor"
+        }
+      )
+    ]
+  }
+);
+export {
+  n as CheckboxUncheckedIcon
+};

package/dist/components/Icon/Icon.d.ts

@@ -0,0 +1,9 @@
+import { IconName } from './';
+export type IconVariant = 'solid' | 'outline';
+interface IconProps {
+    name: IconName;
+    variant?: IconVariant;
+    className?: string;
+}
+export declare const Icon: ({ name, variant, className }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Icon/Icon.js

@@ -0,0 +1,14 @@
+import { jsx as i } from "react/jsx-runtime";
+import { c as r } from "../../index-L8X2o7IH.js";
+import { SvgIcon as f } from "./SvgIcon.js";
+import { iconsMap as m } from "./iconsMap.js";
+import '../../assets/Icon.css';const a = "_icon_1z0mb_1", p = {
+  icon: a
+}, v = ({ name: o, variant: e = "outline", className: n }) => {
+  var t, s;
+  const c = ((t = m[o]) == null ? void 0 : t[e]) ?? ((s = m[o]) == null ? void 0 : s.outline);
+  return c ? /* @__PURE__ */ i(f, { svgIconComponent: c, className: r([p.icon], n) }) : /* @__PURE__ */ i("span", { className: r([p.icon], n) });
+};
+export {
+  v as Icon
+};

package/dist/components/Icon/Icon.stories.js

@@ -0,0 +1,21 @@
+import { Icon as o } from "./Icon.js";
+import { iconsMap as t } from "./iconsMap.js";
+const n = {
+  title: "Atoms/Icon/Icon",
+  component: o,
+  tags: ["autodocs"],
+  parameters: {},
+  argTypes: {
+    name: Object.keys(t)
+  },
+  args: {
+    name: "inbox",
+    variant: "outline"
+  }
+}, s = {
+  args: {}
+};
+export {
+  s as Default,
+  n as default
+};

package/dist/components/Icon/ProgressIcon.d.ts

@@ -0,0 +1,6 @@
+export interface ProgressIconProps {
+    value?: number;
+    total?: number;
+    className?: string;
+}
+export declare const ProgressIcon: ({ value, total, className }: ProgressIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ProgressIcon.js

@@ -0,0 +1,44 @@
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import { c as p } from "../../index-L8X2o7IH.js";
+import '../../assets/ProgressIcon.css';const i = "_progress_1uknp_1", g = "_complete_1uknp_25", n = {
+  progress: i,
+  complete: g
+}, C = ({ value: e = 0, total: s = 100, className: c }) => {
+  const r = Math.round(e / s * 100);
+  if (e === s)
+    return /* @__PURE__ */ o(
+      "svg",
+      {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className: n.complete,
+        children: [
+          /* @__PURE__ */ o("title", { children: [
+            "Progress ",
+            e,
+            " of ",
+            s
+          ] }),
+          /* @__PURE__ */ t(
+            "path",
+            {
+              fill: "currentColor",
+              fillRule: "evenodd",
+              clipRule: "evenodd",
+              d: "M8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16ZM11.1751 5.11246C11.3892 4.87167 11.7579 4.84998 11.9987 5.06402C12.2395 5.27805 12.2612 5.64676 12.0471 5.88755L7.60268 10.8876C7.49595 11.0076 7.34442 11.0784 7.18383 11.0831C7.02324 11.0878 6.86782 11.0261 6.75421 10.9125L3.97644 8.13471C3.74863 7.9069 3.74863 7.53756 3.97644 7.30975C4.20424 7.08194 4.57359 7.08194 4.80139 7.30975L7.14172 9.65007L11.1751 5.11246Z"
+            }
+          )
+        ]
+      }
+    );
+  const l = {
+    "--progress": `${r}%`
+  };
+  return /* @__PURE__ */ t("div", { className: p(n.progress, c), style: l, "data-value": `${r}%` });
+};
+export {
+  C as ProgressIcon
+};

package/dist/components/Icon/ProgressIcon.stories.js

@@ -0,0 +1,36 @@
+import { ProgressIcon as s } from "./ProgressIcon.js";
+const r = {
+  title: "Atoms/Icon/ProgressIcon",
+  component: s,
+  tags: ["autodocs"],
+  parameters: {},
+  args: {}
+}, a = {
+  args: {
+    value: 0
+  }
+}, e = {
+  args: {
+    value: 25
+  }
+}, t = {
+  args: {
+    value: 50
+  }
+}, g = {
+  args: {
+    value: 75
+  }
+}, c = {
+  args: {
+    value: 100
+  }
+};
+export {
+  a as Default,
+  c as Progress100,
+  e as Progress25,
+  t as Progress50,
+  g as Progress75,
+  r as default
+};

package/dist/components/Icon/RadioCheckedIcon.d.ts

@@ -0,0 +1,8 @@
+export type RadioCheckedIconProps = {
+    title?: string;
+    className?: string;
+};
+/**
+ * Radio for lists and list items
+ */
+export declare const RadioCheckedIcon: ({ title, className }: RadioCheckedIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/RadioCheckedIcon.js

@@ -0,0 +1,27 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+const t = ({ title: l = "Radio", className: i }) => /* @__PURE__ */ o(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: i,
+    children: [
+      /* @__PURE__ */ e("title", { children: l }),
+      /* @__PURE__ */ e(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24ZM12 17C14.7614 17 17 14.7614 17 12C17 9.23858 14.7614 7 12 7C9.23858 7 7 9.23858 7 12C7 14.7614 9.23858 17 12 17Z",
+          fill: "black"
+        }
+      )
+    ]
+  }
+);
+export {
+  t as RadioCheckedIcon
+};

package/dist/components/Icon/RadioIcon.d.ts

@@ -0,0 +1,10 @@
+export type RadioIconProps = {
+    checked: boolean;
+    hover?: boolean;
+    title?: string;
+    className?: string;
+};
+/**
+ * Radio for lists and list items
+ */
+export declare const RadioIcon: ({ checked, title, hover, className }: RadioIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/RadioIcon.js

@@ -0,0 +1,10 @@
+import { jsx as r } from "react/jsx-runtime";
+import { RadioCheckedIcon as t } from "./RadioCheckedIcon.js";
+import { RadioUncheckedIcon as d } from "./RadioUncheckedIcon.js";
+const s = ({ checked: c, title: i = "Radio", hover: n = !1, className: e }) => {
+  const o = { title: i, className: e };
+  return c ? /* @__PURE__ */ r(t, { ...o }) : /* @__PURE__ */ r(d, { ...o, hover: n });
+};
+export {
+  s as RadioIcon
+};

package/dist/components/Icon/RadioIcon.stories.js

@@ -0,0 +1,27 @@
+import { RadioIcon as e } from "./RadioIcon.js";
+const t = {
+  title: "Atoms/Icon/RadioIcon",
+  component: e,
+  tags: ["autodocs"],
+  parameters: {},
+  args: {}
+}, a = {
+  args: {
+    checked: !1
+  }
+}, c = {
+  args: {
+    checked: !1,
+    hover: !0
+  }
+}, s = {
+  args: {
+    checked: !0
+  }
+};
+export {
+  s as Checked,
+  a as Default,
+  c as Hover,
+  t as default
+};

package/dist/components/Icon/RadioUncheckedIcon.d.ts

@@ -0,0 +1,9 @@
+export type RadioUncheckedIconProps = {
+    title?: string;
+    className?: string;
+    hover?: boolean;
+};
+/**
+ * Radio for lists and list items
+ */
+export declare const RadioUncheckedIcon: ({ title, className, hover }: RadioUncheckedIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/RadioUncheckedIcon.js

@@ -0,0 +1,28 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+const d = ({ title: l = "Radio", className: i, hover: c = !1 }) => /* @__PURE__ */ o(
+  "svg",
+  {
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: i,
+    children: [
+      /* @__PURE__ */ e("title", { children: l }),
+      /* @__PURE__ */ e(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M12 21.5C17.2467 21.5 21.5 17.2467 21.5 12C21.5 6.75329 17.2467 2.5 12 2.5C6.75329 2.5 2.5 6.75329 2.5 12C2.5 17.2467 6.75329 21.5 12 21.5ZM12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z",
+          fill: "black"
+        }
+      ),
+      c && /* @__PURE__ */ e("circle", { "data-hover": !0, cx: "12", cy: "12", r: "5", fill: "black" })
+    ]
+  }
+);
+export {
+  d as RadioUncheckedIcon
+};

package/dist/components/Icon/SvgIcon.d.ts

@@ -0,0 +1,9 @@
+import { SVGAttributes, default as React } from 'react';
+export type IconComponentProps = {
+    svgIconComponent: React.ReactNode;
+};
+export type SvgIconProps = IconComponentProps & SVGAttributes<SVGElement>;
+export declare const SvgIcon: {
+    ({ svgIconComponent, ...rest }: SvgIconProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;
+    displayName: string;
+};

package/dist/components/Icon/SvgIcon.js

@@ -0,0 +1,6 @@
+import { isValidElement as r, cloneElement as n } from "react";
+const t = ({ svgIconComponent: e, ...l }) => r(e) ? n(e, { ...l }) : null;
+t.displayName = "SvgIcon";
+export {
+  t as SvgIcon
+};