@mittwald/flow-react-components 0.2.0-alpha.43 → 0.2.0-alpha.45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,6 +8,7 @@ import ListItemViewContentView from '../../../../views/ListItemViewContentView.m
8
8
  import FragmentView from '../../../../views/FragmentView.mjs';
9
9
  import '../../../../lib/propsContext/propsContext.mjs';
10
10
  import { PropsContextProvider } from '../../../../lib/propsContext/PropsContextProvider.mjs';
11
+ import { dynamic } from '../../../../lib/propsContext/dynamicProps/dynamic.mjs';
11
12
  import { OptionsButton } from '../Items/components/Item/components/OptionsButton/OptionsButton.mjs';
12
13
  import 'react-aria-components';
13
14
  import 'clsx';
@@ -55,6 +56,9 @@ const ListItemView = (props) => {
55
56
  },
56
57
  Text: {
57
58
  tunnelId: "text"
59
+ },
60
+ Content: {
61
+ tunnelId: dynamic((p) => p.slot === "bottom" ? "bottom" : void 0)
58
62
  }
59
63
  };
60
64
  return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, mergeInParentContext: true, children: /* @__PURE__ */ jsx(TunnelProvider, { children: /* @__PURE__ */ jsx(
@@ -65,6 +69,7 @@ const ListItemView = (props) => {
65
69
  avatar: /* @__PURE__ */ jsx(FragmentView, { children: /* @__PURE__ */ jsx(TunnelExit, { id: "avatar" }) }),
66
70
  button: /* @__PURE__ */ jsx(FragmentView, { children: /* @__PURE__ */ jsx(TunnelExit, { id: "button" }) }),
67
71
  subTitle: /* @__PURE__ */ jsx(FragmentView, { children: /* @__PURE__ */ jsx(TunnelExit, { id: "text" }) }),
72
+ bottom: /* @__PURE__ */ jsx(FragmentView, { children: /* @__PURE__ */ jsx(TunnelExit, { id: "bottom" }) }),
68
73
  children
69
74
  }
70
75
  ) }) });
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemView.mjs","sources":["../../../../../../src/components/List/components/ListItemView/ListItemView.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport styles from \"./ListItemView.module.scss\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\nimport ListItemViewContentView from \"@/views/ListItemViewContentView\";\nimport FragmentView from \"@/views/FragmentView\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { OptionsButton } from \"@/components/List/components/Items/components/Item/components/OptionsButton\";\nimport { useList } from \"@/components/List\";\n\nexport type ListItemViewProps = PropsWithChildren;\n\nexport const ListItemView = (props: ListItemViewProps) => {\n const { children } = props;\n const list = useList();\n\n const propsContext: PropsContext = {\n ContextMenu: {\n tunnelId: \"button\",\n wrapWith: <OptionsButton className={styles.action} />,\n },\n Button: {\n tunnelId: \"button\",\n },\n ActionGroup: {\n tunnelId: \"button\",\n Button: {\n tunnelId: null,\n },\n },\n Avatar: {\n tunnelId: \"avatar\",\n },\n Heading: {\n tunnelId: \"title\",\n },\n Text: {\n tunnelId: \"text\",\n },\n };\n\n return (\n <PropsContextProvider props={propsContext} mergeInParentContext>\n <TunnelProvider>\n <ListItemViewContentView\n viewMode={list.viewMode}\n title={\n <FragmentView>\n <TunnelExit id=\"title\" />\n </FragmentView>\n }\n avatar={\n <FragmentView>\n <TunnelExit id=\"avatar\" />\n </FragmentView>\n }\n button={\n <FragmentView>\n <TunnelExit id=\"button\" />\n </FragmentView>\n }\n subTitle={\n <FragmentView>\n <TunnelExit id=\"text\" />\n </FragmentView>\n }\n >\n {children}\n </ListItemViewContentView>\n </TunnelProvider>\n </PropsContextProvider>\n );\n};\n\nexport default ListItemView;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYa,MAAA,YAAA,GAAe,CAAC,KAA6B,KAAA;AACxD,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AACrB,EAAA,MAAM,OAAO,OAAQ,EAAA;AAErB,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,WAAa,EAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,QAAU,kBAAA,GAAA,CAAC,aAAc,EAAA,EAAA,SAAA,EAAW,OAAO,MAAQ,EAAA;AAAA,KACrD;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,WAAa,EAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,MAAQ,EAAA;AAAA,QACN,QAAU,EAAA;AAAA;AACZ,KACF;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,OAAS,EAAA;AAAA,MACP,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,IAAM,EAAA;AAAA,MACJ,QAAU,EAAA;AAAA;AACZ,GACF;AAEA,EAAA,2BACG,oBAAqB,EAAA,EAAA,KAAA,EAAO,cAAc,oBAAoB,EAAA,IAAA,EAC7D,8BAAC,cACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,UAAU,IAAK,CAAA,QAAA;AAAA,MACf,uBACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,SAAQ,CACzB,EAAA,CAAA;AAAA,MAEF,wBACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,UAAS,CAC1B,EAAA,CAAA;AAAA,MAEF,wBACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,UAAS,CAC1B,EAAA,CAAA;AAAA,MAEF,0BACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,QAAO,CACxB,EAAA,CAAA;AAAA,MAGD;AAAA;AAAA,KAEL,CACF,EAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"ListItemView.mjs","sources":["../../../../../../src/components/List/components/ListItemView/ListItemView.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport styles from \"./ListItemView.module.scss\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\nimport ListItemViewContentView from \"@/views/ListItemViewContentView\";\nimport FragmentView from \"@/views/FragmentView\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport { OptionsButton } from \"@/components/List/components/Items/components/Item/components/OptionsButton\";\nimport { useList } from \"@/components/List\";\n\nexport type ListItemViewProps = PropsWithChildren;\n\nexport const ListItemView = (props: ListItemViewProps) => {\n const { children } = props;\n const list = useList();\n\n const propsContext: PropsContext = {\n ContextMenu: {\n tunnelId: \"button\",\n wrapWith: <OptionsButton className={styles.action} />,\n },\n Button: {\n tunnelId: \"button\",\n },\n ActionGroup: {\n tunnelId: \"button\",\n Button: {\n tunnelId: null,\n },\n },\n Avatar: {\n tunnelId: \"avatar\",\n },\n Heading: {\n tunnelId: \"title\",\n },\n Text: {\n tunnelId: \"text\",\n },\n Content: {\n tunnelId: dynamic((p) => (p.slot === \"bottom\" ? \"bottom\" : undefined)),\n },\n };\n\n return (\n <PropsContextProvider props={propsContext} mergeInParentContext>\n <TunnelProvider>\n <ListItemViewContentView\n viewMode={list.viewMode}\n title={\n <FragmentView>\n <TunnelExit id=\"title\" />\n </FragmentView>\n }\n avatar={\n <FragmentView>\n <TunnelExit id=\"avatar\" />\n </FragmentView>\n }\n button={\n <FragmentView>\n <TunnelExit id=\"button\" />\n </FragmentView>\n }\n subTitle={\n <FragmentView>\n <TunnelExit id=\"text\" />\n </FragmentView>\n }\n bottom={\n <FragmentView>\n <TunnelExit id=\"bottom\" />\n </FragmentView>\n }\n >\n {children}\n </ListItemViewContentView>\n </TunnelProvider>\n </PropsContextProvider>\n );\n};\n\nexport default ListItemView;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBa,MAAA,YAAA,GAAe,CAAC,KAA6B,KAAA;AACxD,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AACrB,EAAA,MAAM,OAAO,OAAQ,EAAA;AAErB,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,WAAa,EAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,QAAU,kBAAA,GAAA,CAAC,aAAc,EAAA,EAAA,SAAA,EAAW,OAAO,MAAQ,EAAA;AAAA,KACrD;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,WAAa,EAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,MAAQ,EAAA;AAAA,QACN,QAAU,EAAA;AAAA;AACZ,KACF;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,OAAS,EAAA;AAAA,MACP,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,IAAM,EAAA;AAAA,MACJ,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,OAAS,EAAA;AAAA,MACP,QAAA,EAAU,QAAQ,CAAC,CAAA,KAAO,EAAE,IAAS,KAAA,QAAA,GAAW,WAAW,MAAU;AAAA;AACvE,GACF;AAEA,EAAA,2BACG,oBAAqB,EAAA,EAAA,KAAA,EAAO,cAAc,oBAAoB,EAAA,IAAA,EAC7D,8BAAC,cACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,UAAU,IAAK,CAAA,QAAA;AAAA,MACf,uBACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,SAAQ,CACzB,EAAA,CAAA;AAAA,MAEF,wBACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,UAAS,CAC1B,EAAA,CAAA;AAAA,MAEF,wBACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,UAAS,CAC1B,EAAA,CAAA;AAAA,MAEF,0BACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,QAAO,CACxB,EAAA,CAAA;AAAA,MAEF,wBACG,GAAA,CAAA,YAAA,EAAA,EACC,8BAAC,UAAW,EAAA,EAAA,EAAA,EAAG,UAAS,CAC1B,EAAA,CAAA;AAAA,MAGD;AAAA;AAAA,KAEL,CACF,EAAA,CAAA;AAEJ;;;;"}
@@ -1,6 +1,7 @@
1
1
  "use client"
2
2
  /* */
3
3
  const view = "flow--list--list-item-view--view";
4
+ const contentWrapper = "flow--list--list-item-view--content-wrapper";
4
5
  const content = "flow--list--list-item-view--content";
5
6
  const title = "flow--list--list-item-view--title";
6
7
  const subTitle = "flow--list--list-item-view--sub-title";
@@ -15,6 +16,7 @@ const avatarContainer = "flow--list--list-item-view--avatar-container";
15
16
  const badge = "flow--list--list-item-view--badge";
16
17
  const styles = {
17
18
  view: view,
19
+ contentWrapper: contentWrapper,
18
20
  content: content,
19
21
  title: title,
20
22
  subTitle: subTitle,
@@ -29,5 +31,5 @@ const styles = {
29
31
  badge: badge
30
32
  };
31
33
 
32
- export { action, avatar, avatarContainer, badge, bottomContent, content, styles as default, heading, subTitle, text, tile, title, topContent, view };
34
+ export { action, avatar, avatarContainer, badge, bottomContent, content, contentWrapper, styles as default, heading, subTitle, text, tile, title, topContent, view };
33
35
  //# sourceMappingURL=ListItemView.module.scss.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemView.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ListItemView.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -58,15 +58,17 @@ const ListItemViewContent = (props) => {
58
58
  const className = clsx(styles.view, viewMode === "tiles" && styles.tile);
59
59
  return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, mergeInParentContext: true, children: /* @__PURE__ */ jsxs("div", { className, children: [
60
60
  viewMode === "list" && /* @__PURE__ */ jsxs(Fragment, { children: [
61
- /* @__PURE__ */ jsxs("div", { className: styles.content, children: [
62
- children,
63
- /* @__PURE__ */ jsxs("div", { className: styles.title, children: [
64
- avatar,
65
- title,
66
- /* @__PURE__ */ jsx("div", { className: styles.subTitle, children: subTitle })
67
- ] })
61
+ /* @__PURE__ */ jsxs("div", { className: styles.contentWrapper, children: [
62
+ /* @__PURE__ */ jsxs("div", { className: styles.content, children: [
63
+ children,
64
+ /* @__PURE__ */ jsxs("div", { className: styles.title, children: [
65
+ avatar,
66
+ title,
67
+ /* @__PURE__ */ jsx("div", { className: styles.subTitle, children: subTitle })
68
+ ] })
69
+ ] }),
70
+ button
68
71
  ] }),
69
- button,
70
72
  bottom
71
73
  ] }),
72
74
  viewMode === "tiles" && /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemViewContent.mjs","sources":["../../../../../../../../src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren, ReactNode } from \"react\";\nimport React from \"react\";\nimport styles from \"../../ListItemView.module.scss\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { ListViewMode } from \"@/components/List/model/types\";\nimport clsx from \"clsx\";\n\nexport type ListItemViewContentProps = PropsWithChildren & {\n title?: ReactNode;\n subTitle?: ReactNode;\n avatar?: ReactNode;\n button?: ReactNode;\n bottom?: ReactNode;\n viewMode?: ListViewMode;\n};\n\nconst getStyleForContentSlot = (slot?: string) =>\n slot === \"top\"\n ? styles.topContent\n : slot === \"bottom\"\n ? styles.bottomContent\n : styles.topContent;\n\n/** @flr-generate all */\nexport const ListItemViewContent = (props: ListItemViewContentProps) => {\n const { children, avatar, title, subTitle, button, bottom, viewMode } = props;\n\n const contentProps: Record<string, ComponentProps<\"div\">> = {\n bottom: {\n onMouseDown: (e) => e.stopPropagation(),\n onPointerDown: (e) => e.stopPropagation(),\n className: styles.bottomContent,\n },\n top: {\n className: styles.topContent,\n },\n };\n\n const propsContext: PropsContext = {\n ContextMenu: {\n placement: \"bottom end\",\n },\n Button: {\n className: styles.action,\n },\n ActionGroup: {\n className: styles.action,\n ignoreBreakpoint: true,\n },\n Content: {\n className: dynamic((p) => getStyleForContentSlot(p.slot)),\n onMouseDown: dynamic((p) => contentProps[p.slot ?? \"top\"]?.onMouseDown),\n onPointerDown: dynamic(\n (p) => contentProps[p.slot ?? \"top\"]?.onPointerDown,\n ),\n },\n Avatar: {\n className: styles.avatar,\n },\n Heading: {\n className: styles.heading,\n level: 5,\n Badge: { className: styles.badge },\n AlertBadge: { className: styles.badge },\n },\n Text: {\n className: styles.text,\n },\n Link: {\n unstyled: true,\n },\n };\n\n const className = clsx(styles.view, viewMode === \"tiles\" && styles.tile);\n\n return (\n <PropsContextProvider props={propsContext} mergeInParentContext>\n <div className={className}>\n {viewMode === \"list\" && (\n <>\n <div className={styles.content}>\n {children}\n <div className={styles.title}>\n {avatar}\n {title}\n <div className={styles.subTitle}>{subTitle}</div>\n </div>\n </div>\n {button}\n {bottom}\n </>\n )}\n\n {viewMode === \"tiles\" && (\n <>\n <div className={styles.avatarContainer}>{avatar}</div>\n <div className={styles.content}>\n <div className={styles.title}>\n {title}\n <div className={styles.subTitle}>{subTitle}</div>\n </div>\n {button}\n {children}\n {bottom}\n </div>\n </>\n )}\n </div>\n </PropsContextProvider>\n );\n};\n\nexport default ListItemViewContent;\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ListItemViewContent.mjs","sources":["../../../../../../../../src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren, ReactNode } from \"react\";\nimport React from \"react\";\nimport styles from \"../../ListItemView.module.scss\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { ListViewMode } from \"@/components/List/model/types\";\nimport clsx from \"clsx\";\n\nexport type ListItemViewContentProps = PropsWithChildren & {\n title?: ReactNode;\n subTitle?: ReactNode;\n avatar?: ReactNode;\n button?: ReactNode;\n bottom?: ReactNode;\n viewMode?: ListViewMode;\n};\n\nconst getStyleForContentSlot = (slot?: string) =>\n slot === \"top\"\n ? styles.topContent\n : slot === \"bottom\"\n ? styles.bottomContent\n : styles.topContent;\n\n/** @flr-generate all */\nexport const ListItemViewContent = (props: ListItemViewContentProps) => {\n const { children, avatar, title, subTitle, button, bottom, viewMode } = props;\n\n const contentProps: Record<string, ComponentProps<\"div\">> = {\n bottom: {\n onMouseDown: (e) => e.stopPropagation(),\n onPointerDown: (e) => e.stopPropagation(),\n className: styles.bottomContent,\n },\n top: {\n className: styles.topContent,\n },\n };\n\n const propsContext: PropsContext = {\n ContextMenu: {\n placement: \"bottom end\",\n },\n Button: {\n className: styles.action,\n },\n ActionGroup: {\n className: styles.action,\n ignoreBreakpoint: true,\n },\n Content: {\n className: dynamic((p) => getStyleForContentSlot(p.slot)),\n onMouseDown: dynamic((p) => contentProps[p.slot ?? \"top\"]?.onMouseDown),\n onPointerDown: dynamic(\n (p) => contentProps[p.slot ?? \"top\"]?.onPointerDown,\n ),\n },\n Avatar: {\n className: styles.avatar,\n },\n Heading: {\n className: styles.heading,\n level: 5,\n Badge: { className: styles.badge },\n AlertBadge: { className: styles.badge },\n },\n Text: {\n className: styles.text,\n },\n Link: {\n unstyled: true,\n },\n };\n\n const className = clsx(styles.view, viewMode === \"tiles\" && styles.tile);\n\n return (\n <PropsContextProvider props={propsContext} mergeInParentContext>\n <div className={className}>\n {viewMode === \"list\" && (\n <>\n <div className={styles.contentWrapper}>\n <div className={styles.content}>\n {children}\n <div className={styles.title}>\n {avatar}\n {title}\n <div className={styles.subTitle}>{subTitle}</div>\n </div>\n </div>\n {button}\n </div>\n {bottom}\n </>\n )}\n\n {viewMode === \"tiles\" && (\n <>\n <div className={styles.avatarContainer}>{avatar}</div>\n <div className={styles.content}>\n <div className={styles.title}>\n {title}\n <div className={styles.subTitle}>{subTitle}</div>\n </div>\n {button}\n {children}\n {bottom}\n </div>\n </>\n )}\n </div>\n </PropsContextProvider>\n );\n};\n\nexport default ListItemViewContent;\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemView.d.ts","sourceRoot":"","sources":["../../../../../../src/components/List/components/ListItemView/ListItemView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAU/C,MAAM,MAAM,iBAAiB,GAAG,iBAAiB,CAAC;AAElD,eAAO,MAAM,YAAY,UAAW,iBAAiB,4CA4DpD,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"ListItemView.d.ts","sourceRoot":"","sources":["../../../../../../src/components/List/components/ListItemView/ListItemView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAc/C,MAAM,MAAM,iBAAiB,GAAG,iBAAiB,CAAC;AAElD,eAAO,MAAM,YAAY,UAAW,iBAAiB,4CAoEpD,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemViewContent.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAkB,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQ1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAGlE,MAAM,MAAM,wBAAwB,GAAG,iBAAiB,GAAG;IACzD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,YAAY,CAAC;CACzB,CAAC;AASF,wBAAwB;AACxB,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,4CAsFlE,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1
+ {"version":3,"file":"ListItemViewContent.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAkB,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQ1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAGlE,MAAM,MAAM,wBAAwB,GAAG,iBAAiB,GAAG;IACzD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,YAAY,CAAC;CACzB,CAAC;AASF,wBAAwB;AACxB,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,4CAwFlE,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
@@ -5,4 +5,5 @@ export default meta;
5
5
  type Story = StoryObj<typeof List>;
6
6
  export declare const LoadingListItem: Story;
7
7
  export declare const LoadingTableCell: Story;
8
+ export declare const VeryLongWords: Story;
8
9
  //# sourceMappingURL=EdgeCases.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"EdgeCases.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/stories/EdgeCases.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,KAAK,IAAI,MAAM,SAAS,CAAC;AAShC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAG3B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAUnC,eAAO,MAAM,eAAe,EAAE,KA2B7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAgC9B,CAAC"}
1
+ {"version":3,"file":"EdgeCases.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/List/stories/EdgeCases.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,KAAK,IAAI,MAAM,SAAS,CAAC;AAahC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAG3B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAUnC,eAAO,MAAM,eAAe,EAAE,KA2B7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAgC9B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAkC3B,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mittwald/flow-react-components",
3
- "version": "0.2.0-alpha.43",
3
+ "version": "0.2.0-alpha.45",
4
4
  "type": "module",
5
5
  "description": "A React implementation of Flow, mittwald’s design system",
6
6
  "homepage": "https://mittwald.github.io/flow",
@@ -52,7 +52,7 @@
52
52
  "dependencies": {
53
53
  "@chakra-ui/live-region": "^2.1.0",
54
54
  "@internationalized/string-compiler": "^3.2.6",
55
- "@mittwald/react-tunnel": "0.2.0-alpha.43",
55
+ "@mittwald/react-tunnel": "0.2.0-alpha.45",
56
56
  "@mittwald/react-use-promise": "^2.6.0",
57
57
  "@react-aria/form": "^3.0.12",
58
58
  "@react-aria/utils": "^3.27.0",
@@ -90,7 +90,7 @@
90
90
  "devDependencies": {
91
91
  "@faker-js/faker": "^9.5.0",
92
92
  "@internationalized/date": "^3.7.0",
93
- "@mittwald/flow-design-tokens": "0.2.0-alpha.43",
93
+ "@mittwald/flow-design-tokens": "0.2.0-alpha.45",
94
94
  "@mittwald/react-use-promise": "^2.6.0",
95
95
  "@mittwald/typescript-config": "",
96
96
  "@nx/storybook": "^20.4.4",
@@ -168,5 +168,5 @@
168
168
  "optional": true
169
169
  }
170
170
  },
171
- "gitHead": "6bddfcbd4de5466d3977b55710298843e075ade0"
171
+ "gitHead": "ec17c69f6103b6f015eab5aa833145fda68ea058"
172
172
  }