@mattilsynet/design 1.0.3 → 1.0.4

package/mtds/card/card.stories.d.ts

@@ -1,6 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
+    id: string;
     parameters: {
         layout: string;
     };

package/mtds/field/field.d.ts

@@ -2,7 +2,6 @@ import { JSX } from 'react';
 import { InputProps } from '../input/input';
 import { PolymorphicComponentPropWithRef } from '../react-types';
 type FieldBaseProps = InputProps & {
-    "data-size"?: string;
     className?: InputProps["className"];
     style?: InputProps["style"];
     label?: React.ReactNode;

package/mtds/field/field.js

@@ -1,44 +1,45 @@
 import { jsx as i, jsxs as v } from "react/jsx-runtime";
-import { clsx as u } from "../external/clsx/dist/clsx.js";
-import { forwardRef as x } from "react";
+import { clsx as x } from "../external/clsx/dist/clsx.js";
+import { forwardRef as F } from "react";
 import a from "../styles.module.css.js";
-const g = x(function c({
-  "data-size": e,
-  as: n,
-  className: s,
-  count: o,
-  description: r,
-  error: d,
-  label: f,
+const z = F(function({
+  "data-size": n,
+  as: s,
+  className: d,
+  count: l,
+  description: o,
+  error: e,
+  label: m,
   prefix: t,
   style: j,
-  suffix: l,
-  ...m
-}, p) {
-  const A = n || "div";
-  if (!n)
-    return /* @__PURE__ */ i("div", { className: u(a.field, s), ref: p, ...m });
-  const N = !!l || !!t, h = /* @__PURE__ */ i(A, { className: a.input, "aria-invalid": !!d, ref: p, ...m });
-  return /* @__PURE__ */ v(c, { className: s, "data-size": e, style: j, children: [
-    !!f && /* @__PURE__ */ i("label", { children: f }),
-    !!r && /* @__PURE__ */ i("p", { children: r }),
-    N ? /* @__PURE__ */ v(F, { children: [
+  suffix: c,
+  ...r
+}, f) {
+  const A = s || "div", p = {
+    "data-size": n,
+    className: x(a.field, d),
+    style: j
+  }, g = !!c || !!t, h = /* @__PURE__ */ i(A, { className: a.input, "aria-invalid": !!e, ref: f, ...r });
+  return s ? /* @__PURE__ */ v("div", { ...p, children: [
+    !!m && /* @__PURE__ */ i("label", { children: m }),
+    !!o && /* @__PURE__ */ i("p", { children: o }),
+    g ? /* @__PURE__ */ v(u, { children: [
       !!t && /* @__PURE__ */ i("span", { children: t }),
       h,
-      !!l && /* @__PURE__ */ i("span", { children: l })
+      !!c && /* @__PURE__ */ i("span", { children: c })
     ] }) : h,
-    !!d && /* @__PURE__ */ i("div", { className: a.validation, children: d }),
-    !!o && /* @__PURE__ */ i("p", { "data-count": o })
-  ] });
-}), F = x(
-  function({ className: e, ...n }, s) {
-    return /* @__PURE__ */ i("div", { className: u(a.affixes, e), ref: s, ...n });
+    !!e && /* @__PURE__ */ i("div", { className: a.validation, children: e }),
+    !!l && /* @__PURE__ */ i("p", { "data-count": l })
+  ] }) : /* @__PURE__ */ i("div", { ref: f, ...p, ...r });
+}), u = F(
+  function({ className: n, ...s }, d) {
+    return /* @__PURE__ */ i("div", { className: x(a.affixes, n), ref: d, ...s });
   }
-), C = Object.assign(g, {
-  Affixes: F
+), O = Object.assign(z, {
+  Affixes: u
 });
 export {
-  C as Field,
-  g as FieldComp
+  O as Field,
+  z as FieldComp
 };
 //# sourceMappingURL=field.js.map

package/mtds/field/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","sources":["../../designsystem/field/field.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { type JSX, forwardRef } from \"react\";\nimport type { InputProps } from \"../input/input\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\n\ntype FieldBaseProps = InputProps & {\n\t\"data-size\"?: string;\n\tclassName?: InputProps[\"className\"];\n\tstyle?: InputProps[\"style\"];\n\tlabel?: React.ReactNode;\n\tdescription?: React.ReactNode;\n\tprefix?: string;\n\tsuffix?: string;\n\terror?: React.ReactNode;\n\tcount?: number;\n};\n\nexport type FieldProps<As extends React.ElementType = \"div\"> =\n\tPolymorphicComponentPropWithRef<As, FieldBaseProps>;\n\ntype FieldComponent = <As extends React.ElementType = \"div\">(\n\tprops: FieldProps<As>,\n) => JSX.Element;\n\nexport const FieldComp: FieldComponent = forwardRef<null>(function Field<\n\tAs extends React.ElementType = \"div\",\n>(\n\t{\n\t\t\"data-size\": size,\n\t\tas,\n\t\tclassName,\n\t\tcount,\n\t\tdescription,\n\t\terror,\n\t\tlabel,\n\t\tprefix,\n\t\tstyle,\n\t\tsuffix,\n\t\t...rest\n\t}: FieldProps<As>,\n\tref?: PolymorphicRef<As>,\n) {\n\tconst Tag = as || \"div\";\n\n\tif (!as)\n\t\treturn (\n\t\t\t<div className={clsx(styles.field, className)} ref={ref} {...rest} />\n\t\t);\n\n\tconst affixes = !!suffix || !!prefix;\n\tconst input = (\n\t\t<Tag className={styles.input} aria-invalid={!!error} ref={ref} {...rest} />\n\t);\n\n\treturn (\n\t\t<Field className={className} data-size={size} style={style}>\n\t\t\t{!!label && <label>{label}</label>}\n\t\t\t{!!description && <p>{description}</p>}\n\t\t\t{affixes ? (\n\t\t\t\t<FieldAffixes>\n\t\t\t\t\t{!!prefix && <span>{prefix}</span>}\n\t\t\t\t\t{input}\n\t\t\t\t\t{!!suffix && <span>{suffix}</span>}\n\t\t\t\t</FieldAffixes>\n\t\t\t) : (\n\t\t\t\tinput\n\t\t\t)}\n\t\t\t{!!error && <div className={styles.validation}>{error}</div>}\n\t\t\t{!!count && <p data-count={count} />}\n\t\t</Field>\n\t);\n}) as FieldComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n\nconst FieldAffixes = forwardRef<HTMLDivElement, FieldProps>(\n\tfunction FieldAffixes({ className, ...rest }, ref) {\n\t\treturn (\n\t\t\t<div className={clsx(styles.affixes, className)} ref={ref} {...rest} />\n\t\t);\n\t},\n);\n\nexport const Field = Object.assign(FieldComp, {\n\tAffixes: FieldAffixes,\n});\n"],"names":["FieldComp","forwardRef","Field","size","as","className","count","description","error","label","prefix","style","suffix","rest","ref","Tag","jsx","clsx","styles","affixes","input","FieldAffixes"],"mappings":";;;;AA4Ba,MAAAA,IAA4BC,EAAiB,SAASC,EAGlE;AAAA,EACC,aAAaC;AAAA,EACb,IAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACJ,GACAC,GACC;AACD,QAAMC,IAAMX,KAAM;AAElB,MAAI,CAACA;AAEH,WAAA,gBAAAY,EAAC,OAAI,EAAA,WAAWC,EAAKC,EAAO,OAAOb,CAAS,GAAG,KAAAS,GAAW,GAAGD,EAAM,CAAA;AAGrE,QAAMM,IAAU,CAAC,CAACP,KAAU,CAAC,CAACF,GACxBU,IACL,gBAAAJ,EAACD,GAAI,EAAA,WAAWG,EAAO,OAAO,gBAAc,CAAC,CAACV,GAAO,KAAAM,GAAW,GAAGD,EAAM,CAAA;AAG1E,2BACEX,GAAA,EAAM,WAAAG,GAAsB,aAAWF,GAAM,OAAAQ,GAC5C,UAAA;AAAA,IAAA,CAAC,CAACF,KAAU,gBAAAO,EAAA,SAAA,EAAO,UAAMP,GAAA;AAAA,IACzB,CAAC,CAACF,KAAe,gBAAAS,EAAC,OAAG,UAAYT,GAAA;AAAA,IACjCY,sBACCE,GACC,EAAA,UAAA;AAAA,MAAA,CAAC,CAACX,KAAW,gBAAAM,EAAA,QAAA,EAAM,UAAON,GAAA;AAAA,MAC1BU;AAAA,MACA,CAAC,CAACR,KAAU,gBAAAI,EAAC,UAAM,UAAOJ,EAAA,CAAA;AAAA,IAAA,EAAA,CAC5B,IAEAQ;AAAA,IAEA,CAAC,CAACZ,KAAS,gBAAAQ,EAAC,SAAI,WAAWE,EAAO,YAAa,UAAMV,GAAA;AAAA,IACrD,CAAC,CAACF,KAAU,gBAAAU,EAAA,KAAA,EAAE,cAAYV,EAAO,CAAA;AAAA,EAAA,GACnC;AAEF,CAAC,GAEKe,IAAepB;AAAA,EACpB,SAAsB,EAAE,WAAAI,GAAW,GAAGQ,EAAA,GAAQC,GAAK;AAEjD,WAAA,gBAAAE,EAAC,OAAI,EAAA,WAAWC,EAAKC,EAAO,SAASb,CAAS,GAAG,KAAAS,GAAW,GAAGD,EAAM,CAAA;AAAA,EAAA;AAGxE,GAEaX,IAAQ,OAAO,OAAOF,GAAW;AAAA,EAC7C,SAASqB;AACV,CAAC;"}
+{"version":3,"file":"field.js","sources":["../../designsystem/field/field.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { type JSX, forwardRef } from \"react\";\nimport type { InputProps } from \"../input/input\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\n\ntype FieldBaseProps = InputProps & {\n\tclassName?: InputProps[\"className\"];\n\tstyle?: InputProps[\"style\"];\n\tlabel?: React.ReactNode;\n\tdescription?: React.ReactNode;\n\tprefix?: string;\n\tsuffix?: string;\n\terror?: React.ReactNode;\n\tcount?: number;\n};\n\nexport type FieldProps<As extends React.ElementType = \"div\"> =\n\tPolymorphicComponentPropWithRef<As, FieldBaseProps>;\n\ntype FieldComponent = <As extends React.ElementType = \"div\">(\n\tprops: FieldProps<As>,\n) => JSX.Element;\n\nexport const FieldComp: FieldComponent = forwardRef<null>(function Field<\n\tAs extends React.ElementType = \"div\",\n>(\n\t{\n\t\t\"data-size\": size,\n\t\tas,\n\t\tclassName,\n\t\tcount,\n\t\tdescription,\n\t\terror,\n\t\tlabel,\n\t\tprefix,\n\t\tstyle,\n\t\tsuffix,\n\t\t...rest\n\t}: FieldProps<As>,\n\tref?: PolymorphicRef<As>,\n) {\n\tconst Tag = as || \"div\";\n\tconst shared = {\n\t\t\"data-size\": size,\n\t\tclassName: clsx(styles.field, className),\n\t\tstyle,\n\t};\n\tconst affixes = !!suffix || !!prefix;\n\tconst input = (\n\t\t<Tag className={styles.input} aria-invalid={!!error} ref={ref} {...rest} />\n\t);\n\n\treturn as ? (\n\t\t<div {...shared}>\n\t\t\t{!!label && <label>{label}</label>}\n\t\t\t{!!description && <p>{description}</p>}\n\t\t\t{affixes ? (\n\t\t\t\t<FieldAffixes>\n\t\t\t\t\t{!!prefix && <span>{prefix}</span>}\n\t\t\t\t\t{input}\n\t\t\t\t\t{!!suffix && <span>{suffix}</span>}\n\t\t\t\t</FieldAffixes>\n\t\t\t) : (\n\t\t\t\tinput\n\t\t\t)}\n\t\t\t{!!error && <div className={styles.validation}>{error}</div>}\n\t\t\t{!!count && <p data-count={count} />}\n\t\t</div>\n\t) : (\n\t\t<div ref={ref} {...shared} {...rest} />\n\t);\n}) as FieldComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n\nconst FieldAffixes = forwardRef<HTMLDivElement, FieldProps>(\n\tfunction FieldAffixes({ className, ...rest }, ref) {\n\t\treturn (\n\t\t\t<div className={clsx(styles.affixes, className)} ref={ref} {...rest} />\n\t\t);\n\t},\n);\n\nexport const Field = Object.assign(FieldComp, {\n\tAffixes: FieldAffixes,\n});\n"],"names":["FieldComp","forwardRef","size","as","className","count","description","error","label","prefix","style","suffix","rest","ref","Tag","shared","clsx","styles","affixes","input","jsx","jsxs","FieldAffixes","Field"],"mappings":";;;;AA2Ba,MAAAA,IAA4BC,EAAiB,SAGzD;AAAA,EACC,aAAaC;AAAA,EACb,IAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACJ,GACAC,GACC;AACD,QAAMC,IAAMX,KAAM,OACZY,IAAS;AAAA,IACd,aAAab;AAAA,IACb,WAAWc,EAAKC,EAAO,OAAOb,CAAS;AAAA,IACvC,OAAAM;AAAA,EACD,GACMQ,IAAU,CAAC,CAACP,KAAU,CAAC,CAACF,GACxBU,IACL,gBAAAC,EAACN,GAAI,EAAA,WAAWG,EAAO,OAAO,gBAAc,CAAC,CAACV,GAAO,KAAAM,GAAW,GAAGD,EAAM,CAAA;AAG1E,SAAOT,IACN,gBAAAkB,EAAC,OAAK,EAAA,GAAGN,GACP,UAAA;AAAA,IAAA,CAAC,CAACP,KAAU,gBAAAY,EAAA,SAAA,EAAO,UAAMZ,GAAA;AAAA,IACzB,CAAC,CAACF,KAAe,gBAAAc,EAAC,OAAG,UAAYd,GAAA;AAAA,IACjCY,sBACCI,GACC,EAAA,UAAA;AAAA,MAAA,CAAC,CAACb,KAAW,gBAAAW,EAAA,QAAA,EAAM,UAAOX,GAAA;AAAA,MAC1BU;AAAA,MACA,CAAC,CAACR,KAAU,gBAAAS,EAAC,UAAM,UAAOT,EAAA,CAAA;AAAA,IAAA,EAAA,CAC5B,IAEAQ;AAAA,IAEA,CAAC,CAACZ,KAAS,gBAAAa,EAAC,SAAI,WAAWH,EAAO,YAAa,UAAMV,GAAA;AAAA,IACrD,CAAC,CAACF,KAAU,gBAAAe,EAAA,KAAA,EAAE,cAAYf,EAAO,CAAA;AAAA,EAAA,GACnC,IAEC,gBAAAe,EAAA,OAAA,EAAI,KAAAP,GAAW,GAAGE,GAAS,GAAGH,GAAM;AAEvC,CAAC,GAEKU,IAAerB;AAAA,EACpB,SAAsB,EAAE,WAAAG,GAAW,GAAGQ,EAAA,GAAQC,GAAK;AAEjD,WAAA,gBAAAO,EAAC,OAAI,EAAA,WAAWJ,EAAKC,EAAO,SAASb,CAAS,GAAG,KAAAS,GAAW,GAAGD,EAAM,CAAA;AAAA,EAAA;AAGxE,GAEaW,IAAQ,OAAO,OAAOvB,GAAW;AAAA,EAC7C,SAASsB;AACV,CAAC;"}

package/mtds/link/link.stories.d.ts

@@ -6,3 +6,4 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const React: Story;
+export declare const WithIcon: Story;