@profiq/ui 0.1.0

package/README.md

@@ -0,0 +1,36 @@
+# profiq-ui
+
+Hosted on [pq-profiq-ui](https://ui-react.profiq.com)
+
+## Goal
+
+Create a React component library which will be re-used by profiq internal applications.
+
+## How
+
+- The main part of this project will be Storybook https://storybook.js.org/ for creating the library.
+  - Take a look at Storybook showcase how projects like this are run
+- For creating the components we will used ShadCN (https://ui.shadcn.com/) with Tailwind.
+- All the components should have tests and examples in the storybook
+  - Which components to implement? Take a look at this app https://gitlab.com/profiq/all/infra/equipment-budgets ideally later on we would be able to replace components with our
+  - Ideally we will have all the components which ShadCN offers by default - but probably start with the ones you would use in form & move to the one used in the app
+- Theme
+  - Light / Dark theme -- focus on light theme as default
+  - Design manual https://drive.google.com/file/d/1vc9bbzwF3E9hjGXcHxEDQZGeakknA6rF/view?usp=sharing
+  - Please try to build some nice theme - try not to change things that much (don't look at our other internal apps), you can take inspiration at https://www.profiq.com/ and maybe try to do less changes from default then more
+- Build CI/CD pipeline
+  - Add tests / prettier / and other checks
+  - Automate deplyoments (on GIT tags / should be in sync with package.json version)
+
+### Technology stack
+
+- Typescript
+- Storybook
+- ShadCN & Tailwind
+
+### Released
+
+- We will be releasing on NPM under this account https://www.npmjs.com/~profiq-npm
+- Name of the package probably @profiq/ui
+
+- We will also host the sotrybook interface online https://ui-react.profiq.com (probably on Firebase) - TBD figure out how to do it

package/dist/components/custom/basic/accordion.d.ts

@@ -0,0 +1,31 @@
+import { BaseProps } from '../../lib/baseProps';
+import * as React from "react";
+export type Item = {
+    value: string;
+    trigger: React.ReactNode;
+    content: React.ReactNode;
+    isDisabled?: boolean;
+};
+type CommonAccordionProps = BaseProps & {
+    items: Item[];
+    className?: string;
+    collapsible?: boolean;
+    ariaLabel?: string;
+    border?: boolean;
+};
+type SingleAccordionProps = CommonAccordionProps & {
+    type: "single";
+    value?: string;
+    defaultValue?: string;
+    onValueChange?(value: string): void;
+};
+type MultipleAccordionProps = CommonAccordionProps & {
+    type: "multiple";
+    value?: string[];
+    defaultValue?: string[];
+    onValueChange?(value: string[]): void;
+};
+export type AccordionProps = SingleAccordionProps | MultipleAccordionProps;
+export declare function Accordion({ dataTestId, theme, ariaLabel, className, items, collapsible, type, defaultValue, border, }: AccordionProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=accordion.d.ts.map

package/dist/components/custom/basic/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/stories/basic/accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAGjD,MAAM,MAAM,IAAI,GAAG;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,oBAAoB,GAAG,SAAS,GAAG;IACtC,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,KAAK,oBAAoB,GAAG,oBAAoB,GAAG;IACjD,IAAI,EAAE,QAAQ,CAAC;IAEf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACrC,CAAC;AAEF,KAAK,sBAAsB,GAAG,oBAAoB,GAAG;IACnD,IAAI,EAAE,UAAU,CAAC;IAEjB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAAG,sBAAsB,CAAC;AAE3E,wBAAgB,SAAS,CAAC,EACxB,UAAU,EACV,KAAK,EACL,SAAS,EACT,SAAS,EACT,KAAK,EACL,WAAkB,EAClB,IAAI,EACJ,YAAY,EACZ,MAAM,GACP,EAAE,cAAc,2CAkDhB"}

package/dist/components/custom/basic/accordion.js

@@ -0,0 +1,68 @@
+import { jsx as a, jsxs as u } from "react/jsx-runtime";
+import "react";
+import { Accordion as b, AccordionItem as t, AccordionTrigger as $, AccordionContent as v } from "../../ui/accordion.js";
+import { useMakeTestId as p } from "../../../lib/hooks/useMakeTestId.js";
+function T({
+  dataTestId: g,
+  theme: o,
+  ariaLabel: n,
+  className: l,
+  items: c,
+  collapsible: h = !0,
+  type: e,
+  defaultValue: i,
+  border: d
+}) {
+  const s = p("Accordion", g);
+  return e === "single" ? /* @__PURE__ */ a(
+    b,
+    {
+      type: e,
+      defaultValue: i,
+      className: `${o} ${l} ${d ? "rounded-lg border p-2" : ""}`,
+      "aria-label": n,
+      collapsible: h,
+      children: c.map((r) => /* @__PURE__ */ u(
+        t,
+        {
+          value: r.value,
+          disabled: r.isDisabled ?? !1,
+          className: `${l} ${d ? "border-b !last:border-b-0" : ""}`,
+          "data-testid": s(r.value),
+          "aria-label": r.value,
+          children: [
+            /* @__PURE__ */ a($, { children: r.trigger }),
+            /* @__PURE__ */ a(v, { children: r.content })
+          ]
+        },
+        r.value
+      ))
+    }
+  ) : /* @__PURE__ */ a(
+    b,
+    {
+      type: e,
+      defaultValue: i,
+      className: `${o} ${l} ${d ? "rounded-lg border p-2" : ""}`,
+      "aria-label": n,
+      children: c.map((r) => /* @__PURE__ */ u(
+        t,
+        {
+          value: r.value,
+          disabled: r.isDisabled ?? !1,
+          className: `${l} ${d ? "border-b !last:border-b-0" : ""}`,
+          "data-testid": s(r.value),
+          "aria-label": r.value,
+          children: [
+            /* @__PURE__ */ a($, { children: r.trigger }),
+            /* @__PURE__ */ a(v, { children: r.content })
+          ]
+        },
+        r.value
+      ))
+    }
+  );
+}
+export {
+  T as Accordion
+};

package/dist/components/custom/basic/button.d.ts

@@ -0,0 +1,16 @@
+import { types, sizes } from '../../lib/buttonVariants';
+import { BaseProps } from '../../lib/baseProps';
+import { IconProps, IconKey } from '../../components/custom/icons/Icons';
+type ButtonProps = BaseProps & {
+    variant: types;
+    size: sizes;
+    title: string;
+    leftIcon?: IconKey;
+    rightIcon?: IconKey;
+    leftIconProps?: IconProps;
+    rightIconProps?: IconProps;
+    onClick?: () => void;
+};
+export declare function Button({ variant, size, title, leftIcon, rightIcon, leftIconProps, rightIconProps, dataTestId, onClick, theme, ariaLabel, className, }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=button.d.ts.map

package/dist/components/custom/basic/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/stories/basic/button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,KAAK,EAAE,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EACL,KAAK,SAAS,EACd,KAAK,OAAO,EAEb,MAAM,iCAAiC,CAAC;AAGzC,KAAK,WAAW,GAAG,SAAS,GAAG;IAC7B,OAAO,EAAE,KAAK,CAAC;IACf,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,OAAmB,EACnB,IAAgB,EAChB,KAAqB,EACrB,QAAiB,EACjB,SAAkB,EAClB,aAAa,EACb,cAAc,EACd,UAAU,EACV,OAAO,EACP,KAAK,EACL,SAAS,EACT,SAAS,GACV,EAAE,WAAW,2CAkCb"}

package/dist/components/custom/basic/button.js

@@ -0,0 +1,46 @@
+import { jsx as e, jsxs as w } from "react/jsx-runtime";
+import { Button as x } from "../../ui/button.js";
+import { iconMap as s } from "../icons/Icons.js";
+import { useMakeTestId as g } from "../../../lib/hooks/useMakeTestId.js";
+function b({
+  variant: f = "default",
+  size: u = "default",
+  title: c = "hello world",
+  leftIcon: h = "none",
+  rightIcon: m = "none",
+  leftIconProps: o,
+  rightIconProps: n,
+  dataTestId: v,
+  onClick: $,
+  theme: a,
+  ariaLabel: p,
+  className: i
+}) {
+  const t = g("Button", v), d = s[h], l = s[m], r = o?.height !== void 0 || n?.height !== void 0;
+  return /* @__PURE__ */ e(
+    x,
+    {
+      className: `${i} ${a} clickable overflow-hidden ${r ? "h-auto" : ""}`,
+      variant: f,
+      size: r ? "default" : u,
+      "data-testid": t(),
+      "aria-label": p,
+      onClick: $,
+      children: /* @__PURE__ */ w(
+        "div",
+        {
+          className: `flex flex-row gap-3 justify-center items-center overflow-hidden ${i} ${a}`,
+          "data-testid": t("Content"),
+          children: [
+            d ? /* @__PURE__ */ e(d, { ...o, dataTestId: t("Left") }) : null,
+            c,
+            l ? /* @__PURE__ */ e(l, { ...n, dataTestId: t("Right") }) : null
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  b as Button
+};

package/dist/components/custom/basic/input.d.ts

@@ -0,0 +1,22 @@
+import { BaseProps } from '../../lib/baseProps';
+export type inputType = "text" | "number" | "url" | "email" | "password" | "search";
+type InputFieldProps = BaseProps & {
+    fieldLabel: React.ReactNode;
+    fieldPlaceholder: string;
+    fieldDescription: string;
+    leftNode?: React.ReactNode;
+    rightNode?: React.ReactNode;
+    defaultValue?: string;
+    value?: string;
+    onChange?: (value: string) => void;
+    onBlur?: (value: string) => void;
+    onFocus?: (value: string) => void;
+    type: inputType;
+    isDisabled?: boolean;
+    isInvalid?: boolean;
+    isRequired?: boolean;
+    msg?: React.ReactNode | string;
+};
+export declare function InputField({ fieldLabel, fieldPlaceholder, fieldDescription, isDisabled, isInvalid, isRequired, msg, type, leftNode, rightNode, defaultValue, value, onChange, onBlur, onFocus, dataTestId, theme, className, }: InputFieldProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=input.d.ts.map

package/dist/components/custom/basic/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/stories/basic/input.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAGjD,MAAM,MAAM,SAAS,GACjB,MAAM,GACN,QAAQ,GACR,KAAK,GACL,OAAO,GACP,UAAU,GACV,QAAQ,CAAC;AAEb,KAAK,eAAe,GAAG,SAAS,GAAG;IACjC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAE,MAAM,CAAC;IAEzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC,IAAI,EAAE,SAAS,CAAC;IAEhB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;CAChC,CAAC;AAEF,wBAAgB,UAAU,CAAC,EACzB,UAAU,EACV,gBAAqB,EACrB,gBAAqB,EAErB,UAAkB,EAClB,SAAiB,EACjB,UAAkB,EAElB,GAAQ,EACR,IAAI,EAEJ,QAAQ,EACR,SAAS,EAET,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,MAAM,EACN,OAAO,EAEP,UAAU,EACV,KAAK,EACL,SAAS,GACV,EAAE,eAAe,2CA8FjB"}

package/dist/components/custom/basic/input.js

@@ -0,0 +1,106 @@
+import { jsxs as c, jsx as r, Fragment as E } from "react/jsx-runtime";
+import { Input as B } from "../../ui/input.js";
+import { useState as x, useRef as D, useEffect as G } from "react";
+import { Field as L, FieldLabel as R, FieldDescription as S } from "../../ui/field.js";
+import { useMakeTestId as q } from "../../../lib/hooks/useMakeTestId.js";
+function O({
+  fieldLabel: n,
+  fieldPlaceholder: $ = "",
+  fieldDescription: F = "",
+  isDisabled: i = !1,
+  isInvalid: d = !1,
+  isRequired: u = !1,
+  msg: t = "",
+  type: b,
+  leftNode: p,
+  rightNode: f,
+  defaultValue: g,
+  value: m,
+  onChange: y,
+  onBlur: N,
+  onFocus: V,
+  dataTestId: j,
+  theme: o,
+  className: s
+}) {
+  const v = m !== void 0, a = q("Field", j), [C, I] = x(g ?? ""), w = v ? m : C, M = (e) => {
+    v || I(e), y?.(e);
+  }, T = d ? "text-[var(--destructive)]" : "", l = D(t), [k, h] = x(!!t);
+  return G(() => {
+    t ? (l.current = t, h(!0)) : h(!1);
+  }, [t]), /* @__PURE__ */ c(
+    L,
+    {
+      "data-disabled": i,
+      "data-invalid": d,
+      orientation: "responsive",
+      "data-testid": a(),
+      children: [
+        /* @__PURE__ */ c(
+          R,
+          {
+            htmlFor: `input-${n}`,
+            className: `${s} ${o}`,
+            "data-testid": a("Label"),
+            children: [
+              n,
+              " ",
+              u ? /* @__PURE__ */ r("span", { className: "text-destructive", children: "*" }) : /* @__PURE__ */ r(E, {})
+            ]
+          }
+        ),
+        /* @__PURE__ */ c(
+          "div",
+          {
+            className: "flex flex-row border border-foreground justify-center items-center rounded-md !divide-x-2 overflow-hidden",
+            "data-testid": a("GroupDiv"),
+            children: [
+              p && /* @__PURE__ */ r("div", { className: "pr-1 pl-1", "data-testid": a("LeftNode"), children: p }),
+              /* @__PURE__ */ r(
+                B,
+                {
+                  id: `input-${n}`,
+                  type: b,
+                  placeholder: $,
+                  className: `${s} ${o} rounded-none border-0`,
+                  disabled: i,
+                  "aria-invalid": d,
+                  required: u,
+                  value: w,
+                  onBlur: (e) => N?.(e.target.value),
+                  onFocus: (e) => V?.(e.target.value),
+                  onChange: (e) => M(e.target.value),
+                  "data-testid": a("Input")
+                }
+              ),
+              f && /* @__PURE__ */ r("div", { className: "pr-1 pl-1", "data-testid": a("RightNode"), children: f })
+            ]
+          }
+        ),
+        /* @__PURE__ */ r(
+          "div",
+          {
+            className: `transition-all duration-500 ease-out overflow-hidden ${k ? "opacity-100 translate-y-0 max-h-20" : "opacity-0 -translate-y-2 pointer-events-none max-h-0"} ${T}`,
+            onTransitionEnd: () => {
+              t || (l.current = "");
+            },
+            // eslint-disable-next-line react-hooks/refs
+            children: t ?? l.current
+          }
+        ),
+        /* @__PURE__ */ r(
+          S,
+          {
+            className: `flex flex-col justify-start gap-2 ${s} ${o}`,
+            "data-disabled": i,
+            "data-testid": a("Description"),
+            children: F
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  O as InputField
+};

package/dist/components/custom/basic/select.d.ts

@@ -0,0 +1,18 @@
+import { BaseProps } from '../../lib/baseProps';
+export type Item = {
+    id: string;
+    value: string;
+};
+export type Size = "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+type SelectProps = BaseProps & {
+    placeholder: string;
+    items: Item[];
+    isDisabled: boolean;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    onOpenChange?: (open: boolean) => void;
+};
+export declare function Select({ placeholder, items, theme, dataTestId, className, value, defaultValue, isDisabled, onValueChange, onOpenChange, }: SelectProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=select.d.ts.map

package/dist/components/custom/basic/select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/stories/basic/select.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD,MAAM,MAAM,IAAI,GAAG;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AAE5D,KAAK,WAAW,GAAG,SAAS,GAAG;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,UAAU,EAAE,OAAO,CAAC;IAEpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,WAAW,EACX,KAAU,EACV,KAAK,EACL,UAAU,EACV,SAAS,EAET,KAAK,EACL,YAAY,EACZ,UAAkB,EAElB,aAAa,EACb,YAAY,GACb,EAAE,WAAW,2CAgDb"}

package/dist/components/custom/basic/select.js

@@ -0,0 +1,67 @@
+import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import { Select as v, SelectTrigger as C, SelectValue as I, SelectContent as V, SelectItem as T } from "../../ui/select.js";
+import { useState as w } from "react";
+import { useMakeTestId as x } from "../../../lib/hooks/useMakeTestId.js";
+function N({
+  placeholder: r,
+  items: s = [],
+  theme: t,
+  dataTestId: i,
+  className: a,
+  value: o,
+  defaultValue: c,
+  isDisabled: u = !1,
+  onValueChange: $,
+  onOpenChange: f
+}) {
+  const l = x("Select", i), [S, p] = w(c ?? ""), d = o !== void 0, g = d ? o : S, h = (e) => {
+    d || p(e), $?.(e);
+  };
+  return /* @__PURE__ */ m(
+    v,
+    {
+      "data-testid": l(),
+      value: g,
+      onValueChange: (e) => h(e),
+      onOpenChange: (e) => f?.(e),
+      disabled: u,
+      children: [
+        /* @__PURE__ */ n(
+          C,
+          {
+            className: `w-[180px] ${t} ${a} overflow-hidden`,
+            "data-testid": l("Trigger"),
+            children: /* @__PURE__ */ n(
+              I,
+              {
+                className: `${t} ${`${a}`}
+          overflow-hidden`,
+                placeholder: r
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ n(
+          V,
+          {
+            className: `${t} ${a}`,
+            "data-testid": l("Content"),
+            children: s.map((e) => /* @__PURE__ */ n(
+              T,
+              {
+                value: e.value,
+                className: `${t} ${a}`,
+                "data-testid": l(`Item-${e.id}`),
+                children: e.value
+              },
+              e.id
+            ))
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  N as Select
+};

package/dist/components/custom/basic/slider.d.ts

@@ -0,0 +1,24 @@
+import { BaseProps } from '../../lib/baseProps';
+export type DefaultValue = {
+    left: number;
+    right?: number;
+};
+export type SliderProps = BaseProps & {
+    defaultValue: DefaultValue;
+    max?: number;
+    step?: number;
+    onChange?: (value: number[]) => void;
+    onFocus?: (value: number[]) => void;
+    onBlur?: (value: number[]) => void;
+    value?: number[];
+    thumbClassname?: string;
+    rangeClassname?: string;
+    tooltip?: boolean;
+    tooltipClassname?: string;
+    valuePrefix?: string;
+    valueSuffix?: string;
+    isInvalid?: boolean;
+    isDisabled?: boolean;
+};
+export declare function Slider({ dataTestId, theme, ariaLabel, className, defaultValue, max, step, onChange, onFocus, onBlur, value, thumbClassname: thumbClassName, rangeClassname: rangeClassName, tooltip, tooltipClassname, valuePrefix, valueSuffix, isDisabled, isInvalid, }: SliderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=slider.d.ts.map

package/dist/components/custom/basic/slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../src/stories/basic/slider.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAGjD,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG;IACpC,YAAY,EAAE,YAAY,CAAC;IAC3B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IAEjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,UAAU,EACV,KAAK,EACL,SAAS,EACT,SAAS,EAET,YAA0B,EAC1B,GAAS,EACT,IAAQ,EAER,QAAQ,EACR,OAAO,EACP,MAAM,EACN,KAAK,EAEL,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAE9B,OAAO,EACP,gBAAgB,EAChB,WAAW,EACX,WAAW,EAEX,UAAkB,EAClB,SAAiB,GAClB,EAAE,WAAW,2CAsCb"}

package/dist/components/custom/basic/slider.js

@@ -0,0 +1,54 @@
+import { jsx as F } from "react/jsx-runtime";
+import { Slider as I } from "../../ui/slider.js";
+import { useState as N } from "react";
+function w({
+  dataTestId: o,
+  theme: r,
+  ariaLabel: i,
+  className: f,
+  defaultValue: e = { left: 0 },
+  max: m = 100,
+  step: d = 1,
+  onChange: c,
+  onFocus: u,
+  onBlur: g,
+  value: t,
+  thumbClassname: h,
+  rangeClassname: C,
+  tooltip: p,
+  tooltipClassname: x,
+  valuePrefix: S,
+  valueSuffix: b,
+  isDisabled: l = !1,
+  isInvalid: $ = !1
+}) {
+  const v = t !== void 0, s = e.right === void 0 ? [e.left] : [e.left, e.right], [n, V] = N(s), j = v ? t : n, B = (a) => {
+    V(a), c?.(a);
+  };
+  return /* @__PURE__ */ F(
+    I,
+    {
+      defaultValue: s,
+      max: m,
+      step: d,
+      "data-testid": o,
+      "aria-label": i,
+      className: `${r} ${f}`,
+      onValueChange: (a) => B(a),
+      onFocus: () => u?.(n),
+      onBlur: () => g?.(n),
+      value: j,
+      thumbClassname: h,
+      rangeClassname: C,
+      disabled: l,
+      invalid: $,
+      tooltip: l ? !1 : p,
+      tooltipClassname: x,
+      prefix: S,
+      suffix: b
+    }
+  );
+}
+export {
+  w as Slider
+};

package/dist/components/custom/basic/switch.d.ts

@@ -0,0 +1,17 @@
+import { BaseProps } from '../../lib/baseProps';
+export type SwitchFieldProps = {
+    label: string;
+    description: string;
+    onChange?: (value: boolean) => void;
+    onBlur?: (value: boolean) => void;
+    onFocus?: (value: boolean) => void;
+    defaultValue?: string;
+    value?: string;
+    switchId: string;
+    isDisabled?: boolean;
+    isInvalid?: boolean;
+    isRequired?: boolean;
+    size?: "sm" | "default";
+};
+export declare function SwitchField({ theme, dataTestId, className, ariaLabel, onChange, onBlur, onFocus, defaultValue, value, label, description, switchId, isDisabled, isInvalid, isRequired, size, }: BaseProps & SwitchFieldProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=switch.d.ts.map

package/dist/components/custom/basic/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/stories/basic/switch.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAIjD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAClC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAEnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IAEjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;CACzB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,UAAU,EACV,SAAS,EACT,SAAS,EAET,QAAQ,EACR,MAAM,EACN,OAAO,EAEP,YAAY,EACZ,KAAK,EACL,KAAK,EACL,WAAW,EACX,QAAQ,EAER,UAAU,EACV,SAAS,EACT,UAAU,EAEV,IAAI,GACL,EAAE,SAAS,GAAG,gBAAgB,2CA2E9B"}

package/dist/components/custom/basic/switch.js

@@ -0,0 +1,105 @@
+import { jsxs as l, jsx as o, Fragment as j } from "react/jsx-runtime";
+import { Field as V, FieldContent as E, FieldLabel as N, FieldDescription as T } from "../../ui/field.js";
+import { Switch as y } from "../../ui/switch.js";
+import { useMakeTestId as z } from "../../../lib/hooks/useMakeTestId.js";
+import { useState as A } from "react";
+function H({
+  theme: d,
+  dataTestId: h,
+  className: r,
+  ariaLabel: c,
+  onChange: $,
+  onBlur: g,
+  onFocus: p,
+  defaultValue: v,
+  value: m,
+  label: x,
+  description: F,
+  switchId: u,
+  isDisabled: e,
+  isInvalid: t,
+  isRequired: b,
+  size: C
+}) {
+  const a = z("Field", h), [s, k] = A(
+    (v ?? "off") === "on"
+  ), n = m !== void 0, i = n ? m === "on" : s, w = (S) => {
+    const f = S.target.value === "on";
+    n || k(f), $?.(f);
+  };
+  return /* @__PURE__ */ l(
+    V,
+    {
+      orientation: "horizontal",
+      className: `max-w-sm flex flex-row justify-stretch !items-center
+                 ${r} ${d}`,
+      "data-testid": a(),
+      "aria-label": c,
+      "data-disabled": e,
+      "data-invalid": t,
+      children: [
+        /* @__PURE__ */ l(
+          E,
+          {
+            "data-testid": a("Content"),
+            "data-disabled": e,
+            "data-invalid": t,
+            children: [
+              /* @__PURE__ */ l(
+                N,
+                {
+                  htmlFor: u,
+                  "data-testid": a("Label"),
+                  className: `${r} ${d}`,
+                  "data-disabled": e,
+                  "data-invalid": t,
+                  children: [
+                    x,
+                    " ",
+                    b ? /* @__PURE__ */ o("span", { className: "text-destructive", children: "*" }) : /* @__PURE__ */ o(j, {})
+                  ]
+                }
+              ),
+              /* @__PURE__ */ o(
+                T,
+                {
+                  "data-testid": a("Description"),
+                  className: `${t ? "text-[var(--destructive)]" : ""}
+                      ${r} ${d}`,
+                  "data-disabled": e,
+                  "data-invalid": t,
+                  children: F
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ o(
+          y,
+          {
+            className: `${e ? "!bg-[var(--muted)]" : ""} 
+                    ${t ? "!bg-[var(--destructive)]" : ""}          
+                    ${r} ${d}`,
+            id: u,
+            "data-testid": a("SwitchElement"),
+            "aria-label": c + "-ActiveElement",
+            onChange: w,
+            onBlur: () => g?.(i),
+            onFocus: () => p?.(i),
+            "data-disabled": e,
+            "data-invalid": t,
+            "aria-disabled": e,
+            "aria-invalid": t,
+            ...n ? { checked: i } : { defaultChecked: s },
+            size: C,
+            thumbColor: `${t ? "!bg-[var(--destructive-foreground)]" : ""}
+                     ${e ? "!bg-[var(--muted-foreground)]" : ""}`
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  H as SwitchField
+};

package/dist/components/custom/basic/table.d.ts

@@ -0,0 +1,9 @@
+import { ColumnDef } from '@tanstack/react-table';
+import { BaseProps } from '../../lib/baseProps';
+type TableProps<TData, TValue> = BaseProps & {
+    columns: ColumnDef<TData, TValue>[];
+    data: TData[];
+};
+export declare function Table<TData, TValue>({ theme, ariaLabel, className, dataTestId, columns, data, }: TableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=table.d.ts.map

package/dist/components/custom/basic/table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/stories/basic/table.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EAIf,MAAM,uBAAuB,CAAC;AAW/B,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAIjD,KAAK,UAAU,CAAC,KAAK,EAAE,MAAM,IAAI,SAAS,GAAG;IAC3C,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,CAAC;IACpC,IAAI,EAAE,KAAK,EAAE,CAAC;CACf,CAAC;AAEF,wBAAgB,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,EACnC,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EACV,OAAO,EACP,IAAI,GACL,EAAE,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,2CAyE3B"}