@mittwald/flow-react-components 0.1.0-alpha.49 → 0.1.0-alpha.50

package/dist/types/components/ButtonGroup/ButtonGroup.d.ts

@@ -0,0 +1,5 @@
+import { ComponentProps, FC, PropsWithChildren } from "react";
+export interface ButtonGroupProps extends PropsWithChildren<ComponentProps<"div">> {
+}
+export declare const ButtonGroup: FC<ButtonGroupProps>;
+export default ButtonGroup;

package/dist/types/components/ButtonGroup/index.d.ts

@@ -0,0 +1,3 @@
+import { ButtonGroup } from "./ButtonGroup";
+export { type ButtonGroupProps, ButtonGroup } from "./ButtonGroup";
+export default ButtonGroup;

package/dist/types/components/ButtonGroup/stories/Default.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import ButtonGroup from "../ButtonGroup";
+declare const meta: Meta<typeof ButtonGroup>;
+export default meta;
+type Story = StoryObj<typeof ButtonGroup>;
+export declare const Default: Story;
+export declare const Danger: Story;
+export declare const Info: Story;
+export declare const AdditionalSecondary: Story;
+export declare const Mobile: Story;

package/dist/types/components/Modal/Modal.d.ts

@@ -0,0 +1,8 @@
+import * as Aria from "react-aria-components";
+import { FC } from "react";
+export interface ModalProps extends Pick<Aria.DialogProps, "children">, Omit<Aria.ModalOverlayProps, "children"> {
+    size?: "s" | "m" | "l";
+    panel?: boolean;
+}
+export declare const Modal: FC<ModalProps>;
+export default Modal;

package/dist/types/components/Modal/index.d.ts

@@ -0,0 +1,4 @@
+import { Modal } from "./Modal";
+export { type ModalProps, Modal } from "./Modal";
+export { DialogTrigger as ModalTrigger } from "react-aria-components";
+export default Modal;

package/dist/types/components/Modal/stories/Default.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import Modal from '..';
+declare const meta: Meta<typeof Modal>;
+export default meta;
+type Story = StoryObj<typeof Modal>;
+export declare const WithState: Story;
+export declare const WithDialogTrigger: Story;
+export declare const Mobile: Story;
+export declare const Panel: Story;

package/dist/types/components/Modal/stories/EdgeCases.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import Modal from "../Modal";
+declare const meta: Meta<typeof Modal>;
+export default meta;
+type Story = StoryObj<typeof Modal>;
+export declare const LongContent: Story;

package/dist/types/components/propTypes/index.d.ts

@@ -16,9 +16,11 @@ import type { CopyButtonProps } from '../CopyButton';
 import type { HeaderProps } from '../Header';
 import type { SwitchProps } from '../Switch';
 import { StatusBadgeProps } from '../StatusBadge';
+import type { ButtonGroupProps } from '../ButtonGroup';
 export * from "./types";
 export interface FlowComponentPropsTypes {
     Button: ButtonProps;
+    ButtonGroup: ButtonGroupProps;
     Content: ContentProps;
     CopyButton: CopyButtonProps;
     FieldDescription: FieldDescriptionProps;

package/dist/types/lib/propsContext/propsContext.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 export declare const propsContext: import("react").Context<Partial<{
     Button: import('./types').ComponentPropsContext<"Button">;
+    ButtonGroup: import('./types').ComponentPropsContext<"ButtonGroup">;
     Content: import('./types').ComponentPropsContext<"Content">;
     CopyButton: import('./types').ComponentPropsContext<"CopyButton">;
     FieldDescription: import('./types').ComponentPropsContext<"FieldDescription">;

package/dist/useProps-U3eRrkW6.js

@@ -0,0 +1,73 @@
+"use client"
+/* */
+import { mergeProps as s } from "@react-aria/utils";
+import p, { isValidElement as u, useContext as c } from "react";
+import { p as d } from "./propsContext-Dx7WKmmM.js";
+import { pickBy as m } from "remeda";
+import { P as a } from "./PropsContextProvider-B6QiUIPM.js";
+function C(t) {
+  return !!t && typeof t == "object" && "__dynamicProp" in t;
+}
+const f = {
+  Text: !0,
+  Button: !0,
+  ButtonGroup: !0,
+  CopyButton: !0,
+  Header: !0,
+  Icon: !0,
+  Label: !0,
+  Content: !0,
+  LayoutCard: !0,
+  NavigationItem: !0,
+  Heading: !0,
+  InlineAlert: !0,
+  Link: !0,
+  Initials: !0,
+  Image: !0,
+  FieldError: !0,
+  FieldDescription: !0,
+  TestComponent: !0,
+  Switch: !0,
+  StatusBadge: !0
+}, l = Object.keys(
+  f
+);
+function i(t) {
+  return typeof t == "string" && l.includes(t);
+}
+function y(t) {
+  return !i(t);
+}
+const P = (t, r) => {
+  const e = {};
+  for (const n in t)
+    if (y(n)) {
+      const o = t[n];
+      C(o) ? e[n] = o.__dynamicProp(r) : e[n] = o;
+    }
+  return e;
+};
+function x(t) {
+  return !!t && typeof t == "object" && "children" in t && !!t.children;
+}
+const h = (t) => m(t, (r, e) => i(e)), v = (t, r) => {
+  if (!x(r))
+    return {};
+  const e = r.children;
+  if (!Array.isArray(e) && !u(e))
+    return {};
+  const n = h(t);
+  return Object.keys(n).length === 0 ? {} : {
+    children: /* @__PURE__ */ p.createElement(a, { props: n }, r.children)
+  };
+}, B = (t, r) => {
+  const e = c(d)[t], n = e ? P(e, r) : void 0, o = e ? v(e, r) : void 0;
+  return s(
+    n,
+    r,
+    o
+  );
+};
+export {
+  B as u
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mittwald/flow-react-components",
-  "version": "0.1.0-alpha.49",
+  "version": "0.1.0-alpha.50",
   "type": "module",
   "description": "A React implementation of Flow, mittwald’s design system",
   "homepage": "https://mittwald.github.io/flow",
@@ -14,6 +14,10 @@
       "types": "./dist/types/components/Button/index.d.ts",
       "import": "./dist/Button.js"
     },
+    "./ButtonGroup": {
+      "types": "./dist/types/components/ButtonGroup/index.d.ts",
+      "import": "./dist/ButtonGroup.js"
+    },
     "./Checkbox": {
       "types": "./dist/types/components/Checkbox/index.d.ts",
       "import": "./dist/Checkbox.js"
@@ -94,6 +98,10 @@
       "types": "./dist/types/components/List/components/ListLoaderAsyncResource.d.ts",
       "import": "./dist/List/ListLoaderAsyncResource.js"
     },
+    "./Modal": {
+      "types": "./dist/types/components/Modal/index.d.ts",
+      "import": "./dist/Modal.js"
+    },
     "./Navigation": {
       "types": "./dist/types/components/Navigation/index.d.ts",
       "import": "./dist/Navigation.js"
@@ -182,7 +190,7 @@
   },
   "devDependencies": {
     "@faker-js/faker": "^8.4.1",
-    "@mittwald/flow-design-tokens": "^0.1.0-alpha.43",
+    "@mittwald/flow-design-tokens": "^0.1.0-alpha.50",
     "@mittwald/react-use-promise": "^2.3.12",
     "@nx/storybook": "^18.1.1",
     "@storybook/addon-a11y": "^7.6.17",
@@ -253,5 +261,5 @@
       "optional": true
     }
   },
-  "gitHead": "501ea40123d23046f6715f5aa80e210ba7f2d90b"
+  "gitHead": "1101c1b89d5d2b2ed6c0e3ecab13e98cb4d24647"
 }

package/dist/Tooltip-Co5h9sSt.js

@@ -1,16 +0,0 @@
-"use client"
-/* */
-import * as t from "react-aria-components";
-import o from "react";
-import i from "clsx";
-const m = "flow--tooltip", n = "flow--tooltip--arrow", p = "flow--tooltip--slide", e = {
-  tooltip: m,
-  arrow: n,
-  slide: p
-}, d = (r) => {
-  const { children: l, className: s, ...a } = r, c = i(e.tooltip, s);
-  return /* @__PURE__ */ o.createElement(t.Tooltip, { ...a, className: c }, /* @__PURE__ */ o.createElement(t.OverlayArrow, { className: e.arrow }, /* @__PURE__ */ o.createElement("svg", { viewBox: "0 0 8 8" }, /* @__PURE__ */ o.createElement("path", { d: "M0 0 L4 4 L8 0" }))), l);
-};
-export {
-  d as T
-};

package/dist/TooltipTrigger-7-ynWHZ9.js

@@ -1,11 +0,0 @@
-"use client"
-/* */
-import * as o from "react-aria-components";
-import i from "react";
-const c = (r) => {
-  const { children: t, ...e } = r;
-  return /* @__PURE__ */ i.createElement(o.TooltipTrigger, { ...e }, t);
-};
-export {
-  c as T
-};

package/dist/TooltipTrigger.js

@@ -1,7 +0,0 @@
-"use client"
-/* */
-import { T as r } from "./TooltipTrigger-7-ynWHZ9.js";
-export {
-  r as TooltipTrigger,
-  r as default
-};

package/dist/flowComponent-DLzr2Cvi.js

@@ -1,92 +0,0 @@
-"use client"
-/* */
-import i, { isValidElement as d, useContext as u, createContext as l, useLayoutEffect as a } from "react";
-import { p as m } from "./propsContext-Dx7WKmmM.js";
-import { mergeProps as f } from "@react-aria/utils";
-import { pickBy as C } from "remeda";
-import { P as y } from "./PropsContextProvider-B6QiUIPM.js";
-import "@preact/signals-react";
-import "@preact/signals-react/runtime";
-function x(t) {
-  return !!t && typeof t == "object" && "__dynamicProp" in t;
-}
-const P = {
-  Text: !0,
-  Button: !0,
-  CopyButton: !0,
-  Header: !0,
-  Icon: !0,
-  Label: !0,
-  Content: !0,
-  LayoutCard: !0,
-  NavigationItem: !0,
-  Heading: !0,
-  InlineAlert: !0,
-  Link: !0,
-  Initials: !0,
-  Image: !0,
-  FieldError: !0,
-  FieldDescription: !0,
-  TestComponent: !0,
-  Switch: !0,
-  StatusBadge: !0
-}, v = Object.keys(
-  P
-);
-function s(t) {
-  return typeof t == "string" && v.includes(t);
-}
-function h(t) {
-  return !s(t);
-}
-const E = (t, r) => {
-  const e = {};
-  for (const n in t)
-    if (h(n)) {
-      const o = t[n];
-      x(o) ? e[n] = o.__dynamicProp(r) : e[n] = o;
-    }
-  return e;
-};
-function w(t) {
-  return !!t && typeof t == "object" && "children" in t && !!t.children;
-}
-const I = (t) => C(t, (r, e) => s(e)), g = (t, r) => {
-  if (!w(r))
-    return {};
-  const e = r.children;
-  if (!Array.isArray(e) && !d(e))
-    return {};
-  const n = I(t);
-  return Object.keys(n).length === 0 ? {} : {
-    children: /* @__PURE__ */ i.createElement(y, { props: n }, r.children)
-  };
-}, N = (t, r) => {
-  const e = u(m)[t], n = e ? E(e, r) : void 0, o = e ? g(e, r) : void 0;
-  return f(
-    n,
-    r,
-    o
-  );
-}, b = l({}), k = (t) => {
-  const { children: r, id: e = "default" } = t, { nodes: n } = u(b);
-  return a(() => {
-    if (e !== void 0 && r !== n.value[e])
-      return n.value = { ...n.value, [e]: r }, () => {
-        n.value = { ...n.value, [e]: void 0 };
-      };
-  }, [r, e, n]), null;
-};
-function A(t, r) {
-  return function(n) {
-    const o = N(t, n);
-    if ("tunnelId" in o) {
-      const { tunnelId: c, ...p } = o;
-      return /* @__PURE__ */ i.createElement(k, { id: c }, /* @__PURE__ */ i.createElement(r, { ...p }));
-    }
-    return /* @__PURE__ */ i.createElement(r, { ...o });
-  };
-}
-export {
-  A as f
-};