@mittwald/flow-react-components 0.2.0-alpha.800 → 0.2.0-alpha.801

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.
Files changed (24) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/assets/doc-properties.json +599 -524
  3. package/dist/css/all.css +1 -1
  4. package/dist/js/_virtual/_.locale.json@926b2109eb7c356d3d5e61c950de4c00.mjs +14 -0
  5. package/dist/js/_virtual/_.locale.json@926b2109eb7c356d3d5e61c950de4c00.mjs.map +1 -0
  6. package/dist/js/packages/components/src/components/Tabs/Tabs.mjs +4 -1
  7. package/dist/js/packages/components/src/components/Tabs/Tabs.mjs.map +1 -1
  8. package/dist/js/packages/components/src/components/Tabs/Tabs.module.scss.mjs +7 -2
  9. package/dist/js/packages/components/src/components/Tabs/Tabs.module.scss.mjs.map +1 -1
  10. package/dist/js/packages/components/src/components/Tabs/components/FallbackTab/FallbackTab.mjs +27 -0
  11. package/dist/js/packages/components/src/components/Tabs/components/FallbackTab/FallbackTab.mjs.map +1 -0
  12. package/dist/js/packages/components/src/components/Tabs/components/Tab/Tab.mjs +1 -1
  13. package/dist/js/packages/components/src/components/Tabs/components/Tab/Tab.mjs.map +1 -1
  14. package/dist/types/components/Tabs/Tabs.d.ts +2 -1
  15. package/dist/types/components/Tabs/Tabs.d.ts.map +1 -1
  16. package/dist/types/components/Tabs/components/FallbackTab/FallbackTab.d.ts +6 -0
  17. package/dist/types/components/Tabs/components/FallbackTab/FallbackTab.d.ts.map +1 -0
  18. package/dist/types/components/Tabs/components/FallbackTab/index.d.ts +2 -0
  19. package/dist/types/components/Tabs/components/FallbackTab/index.d.ts.map +1 -0
  20. package/dist/types/components/Tabs/stories/EdgeCases.stories.d.ts +1 -0
  21. package/dist/types/components/Tabs/stories/EdgeCases.stories.d.ts.map +1 -1
  22. package/package.json +6 -6
  23. package/dist/js/packages/components/src/components/Tabs/components/Tab/Tab.module.scss.mjs +0 -9
  24. package/dist/js/packages/components/src/components/Tabs/components/Tab/Tab.module.scss.mjs.map +0 -1
@@ -0,0 +1,14 @@
1
+ "use client"
2
+ /* */
3
+ const locales = {"de-DE":{
4
+ "fallbackTab.heading": "Tab nicht gefunden",
5
+ "fallbackTab.text": "Das Tab das du aufrufen wolltest gibt es nicht mehr oder du hast keinen Zugriff darauf."
6
+ }
7
+ ,"en-US":{
8
+ "fallbackTab.heading": "Tab not found",
9
+ "fallbackTab.text": "The tab you tried to access no longer exists or you do not have permission to view it."
10
+ }
11
+ };
12
+
13
+ export { locales as default };
14
+ //# sourceMappingURL=_.locale.json@926b2109eb7c356d3d5e61c950de4c00.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"_.locale.json@926b2109eb7c356d3d5e61c950de4c00.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
@@ -8,6 +8,7 @@ import clsx from 'clsx';
8
8
  import { useState } from 'react';
9
9
  import * as Aria from 'react-aria-components';
10
10
  import styles from './Tabs.module.scss.mjs';
11
+ import { FallbackTab } from './components/FallbackTab/FallbackTab.mjs';
11
12
 
12
13
  const Tabs = flowComponent("Tabs", (props) => {
13
14
  const {
@@ -18,6 +19,7 @@ const Tabs = flowComponent("Tabs", (props) => {
18
19
  disabledKeys,
19
20
  ref,
20
21
  onSelectionChange,
22
+ tabNotFoundView,
21
23
  ...rest
22
24
  } = props;
23
25
  const rootClassName = clsx(styles.tabs, className);
@@ -54,7 +56,8 @@ const Tabs = flowComponent("Tabs", (props) => {
54
56
  disabledKeys
55
57
  }
56
58
  ),
57
- /* @__PURE__ */ jsx(TunnelExit, { id: "Panels" })
59
+ /* @__PURE__ */ jsx(TunnelExit, { id: "Panels" }),
60
+ /* @__PURE__ */ jsx(FallbackTab, { tabNotFoundView })
58
61
  ]
59
62
  }
60
63
  )
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.mjs","sources":["../../../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { TabList } from \"@/components/Tabs/components/TabList\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren } from \"react\";\nimport { useState } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Tabs.module.scss\";\n\nexport interface TabsProps\n extends\n Omit<Aria.TabsProps, \"children\">,\n PropsWithChildren,\n FlowComponentProps {}\n\n/** @flr-generate all */\nexport const Tabs = flowComponent(\"Tabs\", (props) => {\n const {\n children,\n className,\n defaultSelectedKey,\n selectedKey: selectedKeyProps,\n disabledKeys,\n ref,\n onSelectionChange,\n ...rest\n } = props;\n\n const rootClassName = clsx(styles.tabs, className);\n const [selectedKeyState, setSelectedKeyState] = useState<\n Aria.Key | undefined\n >(defaultSelectedKey);\n\n const selectedKey = selectedKeyProps ?? selectedKeyState;\n\n return (\n <TunnelProvider>\n {children}\n <Aria.Tabs\n slot={null}\n className={rootClassName}\n {...rest}\n selectedKey={selectedKey}\n onSelectionChange={(key) => {\n setSelectedKeyState(key);\n if (onSelectionChange) {\n onSelectionChange(key);\n }\n }}\n disabledKeys={disabledKeys}\n ref={ref}\n >\n <TabList\n selection={selectedKey}\n onContextMenuSelectionChange={(key) => {\n setSelectedKeyState(key);\n if (onSelectionChange) {\n onSelectionChange(key);\n }\n }}\n disabledKeys={disabledKeys}\n />\n <TunnelExit id=\"Panels\" />\n </Aria.Tabs>\n </TunnelProvider>\n );\n});\n\nexport default Tabs;\n"],"names":[],"mappings":";;;;;;;;;AAiBO,MAAM,IAAA,GAAO,aAAA,CAAc,MAAA,EAAQ,CAAC,KAAA,KAAU;AACnD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,kBAAA;AAAA,IACA,WAAA,EAAa,gBAAA;AAAA,IACb,YAAA;AAAA,IACA,GAAA;AAAA,IACA,iBAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,IAAA,EAAM,SAAS,CAAA;AACjD,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,SAE9C,kBAAkB,CAAA;AAEpB,EAAA,MAAM,cAAc,gBAAA,IAAoB,gBAAA;AAExC,EAAA,4BACG,cAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,IAAA;AAAA,MAAC,IAAA,CAAK,IAAA;AAAA,MAAL;AAAA,QACC,IAAA,EAAM,IAAA;AAAA,QACN,SAAA,EAAW,aAAA;AAAA,QACV,GAAG,IAAA;AAAA,QACJ,WAAA;AAAA,QACA,iBAAA,EAAmB,CAAC,GAAA,KAAQ;AAC1B,UAAA,mBAAA,CAAoB,GAAG,CAAA;AACvB,UAAA,IAAI,iBAAA,EAAmB;AACrB,YAAA,iBAAA,CAAkB,GAAG,CAAA;AAAA,UACvB;AAAA,QACF,CAAA;AAAA,QACA,YAAA;AAAA,QACA,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,WAAA;AAAA,cACX,4BAAA,EAA8B,CAAC,GAAA,KAAQ;AACrC,gBAAA,mBAAA,CAAoB,GAAG,CAAA;AACvB,gBAAA,IAAI,iBAAA,EAAmB;AACrB,kBAAA,iBAAA,CAAkB,GAAG,CAAA;AAAA,gBACvB;AAAA,cACF,CAAA;AAAA,cACA;AAAA;AAAA,WACF;AAAA,0BACA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,QAAA,EAAS;AAAA;AAAA;AAAA;AAC1B,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
1
+ {"version":3,"file":"Tabs.mjs","sources":["../../../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { TabList } from \"@/components/Tabs/components/TabList\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { TunnelExit, TunnelProvider } from \"@mittwald/react-tunnel\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren, ReactNode } from \"react\";\nimport { useState } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Tabs.module.scss\";\nimport { FallbackTab } from \"@/components/Tabs/components/FallbackTab\";\n\nexport interface TabsProps\n extends\n Omit<Aria.TabsProps, \"children\">,\n PropsWithChildren,\n FlowComponentProps {\n /* custom fallback view for not found tabs */\n tabNotFoundView?: ReactNode;\n}\n\n/** @flr-generate all */\nexport const Tabs = flowComponent(\"Tabs\", (props) => {\n const {\n children,\n className,\n defaultSelectedKey,\n selectedKey: selectedKeyProps,\n disabledKeys,\n ref,\n onSelectionChange,\n tabNotFoundView,\n ...rest\n } = props;\n\n const rootClassName = clsx(styles.tabs, className);\n const [selectedKeyState, setSelectedKeyState] = useState<\n Aria.Key | undefined\n >(defaultSelectedKey);\n\n const selectedKey = selectedKeyProps ?? selectedKeyState;\n\n return (\n <TunnelProvider>\n {children}\n <Aria.Tabs\n slot={null}\n className={rootClassName}\n {...rest}\n selectedKey={selectedKey}\n onSelectionChange={(key) => {\n setSelectedKeyState(key);\n if (onSelectionChange) {\n onSelectionChange(key);\n }\n }}\n disabledKeys={disabledKeys}\n ref={ref}\n >\n <TabList\n selection={selectedKey}\n onContextMenuSelectionChange={(key) => {\n setSelectedKeyState(key);\n if (onSelectionChange) {\n onSelectionChange(key);\n }\n }}\n disabledKeys={disabledKeys}\n />\n <TunnelExit id=\"Panels\" />\n <FallbackTab tabNotFoundView={tabNotFoundView} />\n </Aria.Tabs>\n </TunnelProvider>\n );\n});\n\nexport default Tabs;\n"],"names":[],"mappings":";;;;;;;;;;AAqBO,MAAM,IAAA,GAAO,aAAA,CAAc,MAAA,EAAQ,CAAC,KAAA,KAAU;AACnD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,kBAAA;AAAA,IACA,WAAA,EAAa,gBAAA;AAAA,IACb,YAAA;AAAA,IACA,GAAA;AAAA,IACA,iBAAA;AAAA,IACA,eAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,IAAA,EAAM,SAAS,CAAA;AACjD,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,SAE9C,kBAAkB,CAAA;AAEpB,EAAA,MAAM,cAAc,gBAAA,IAAoB,gBAAA;AAExC,EAAA,4BACG,cAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,IAAA;AAAA,MAAC,IAAA,CAAK,IAAA;AAAA,MAAL;AAAA,QACC,IAAA,EAAM,IAAA;AAAA,QACN,SAAA,EAAW,aAAA;AAAA,QACV,GAAG,IAAA;AAAA,QACJ,WAAA;AAAA,QACA,iBAAA,EAAmB,CAAC,GAAA,KAAQ;AAC1B,UAAA,mBAAA,CAAoB,GAAG,CAAA;AACvB,UAAA,IAAI,iBAAA,EAAmB;AACrB,YAAA,iBAAA,CAAkB,GAAG,CAAA;AAAA,UACvB;AAAA,QACF,CAAA;AAAA,QACA,YAAA;AAAA,QACA,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,WAAA;AAAA,cACX,4BAAA,EAA8B,CAAC,GAAA,KAAQ;AACrC,gBAAA,mBAAA,CAAoB,GAAG,CAAA;AACvB,gBAAA,IAAI,iBAAA,EAAmB;AACrB,kBAAA,iBAAA,CAAkB,GAAG,CAAA;AAAA,gBACvB;AAAA,cACF,CAAA;AAAA,cACA;AAAA;AAAA,WACF;AAAA,0BACA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,QAAA,EAAS,CAAA;AAAA,0BACxB,GAAA,CAAC,eAAY,eAAA,EAAkC;AAAA;AAAA;AAAA;AACjD,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
@@ -1,8 +1,13 @@
1
1
  "use client"
2
2
  /* */
3
3
  const tabs = "flow--tabs";
4
+ const fallbackTab = "flow--tabs--fallback-tab";
5
+ const tabPanel = "flow--tabs--tab-panel";
4
6
  const styles = {
5
- tabs: tabs};
7
+ tabs: tabs,
8
+ fallbackTab: fallbackTab,
9
+ tabPanel: tabPanel
10
+ };
6
11
 
7
- export { styles as default, tabs };
12
+ export { styles as default, fallbackTab, tabPanel, tabs };
8
13
  //# sourceMappingURL=Tabs.module.scss.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
1
+ {"version":3,"file":"Tabs.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
@@ -0,0 +1,27 @@
1
+ "use client"
2
+ /* */
3
+ import { jsx, jsxs } from 'react/jsx-runtime';
4
+ import styles from '../../Tabs.module.scss.mjs';
5
+ import '../../../TranslationProvider/TranslationProvider.mjs';
6
+ import { useLocalizedStringFormatter } from '../../../TranslationProvider/useLocalizedStringFormatter.mjs';
7
+ import locales from '../../../../../../../_virtual/_.locale.json@926b2109eb7c356d3d5e61c950de4c00.mjs';
8
+ import { IllustratedMessage } from '../../../IllustratedMessage/IllustratedMessage.mjs';
9
+ import { Heading } from '../../../Heading/Heading.mjs';
10
+ import { Text } from '../../../Text/Text.mjs';
11
+ import { AlertIcon } from '../../../AlertIcon/AlertIcon.mjs';
12
+
13
+ const FallbackTab = (props) => {
14
+ const { tabNotFoundView } = props;
15
+ const stringFormatter = useLocalizedStringFormatter(locales, "Tabs");
16
+ if (tabNotFoundView) {
17
+ return /* @__PURE__ */ jsx("div", { className: styles.fallbackTab, children: tabNotFoundView });
18
+ }
19
+ return /* @__PURE__ */ jsxs(IllustratedMessage, { className: styles.fallbackTab, color: "unavailable", children: [
20
+ /* @__PURE__ */ jsx(AlertIcon, { status: "unavailable" }),
21
+ /* @__PURE__ */ jsx(Heading, { children: stringFormatter.format("fallbackTab.heading") }),
22
+ /* @__PURE__ */ jsx(Text, { children: stringFormatter.format("fallbackTab.text") })
23
+ ] });
24
+ };
25
+
26
+ export { FallbackTab };
27
+ //# sourceMappingURL=FallbackTab.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FallbackTab.mjs","sources":["../../../../../../../../../src/components/Tabs/components/FallbackTab/FallbackTab.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport styles from \"../../Tabs.module.scss\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider\";\nimport locales from \"../../locales/*.locale.json\";\nimport { IllustratedMessage } from \"@/components/IllustratedMessage\";\nimport { Heading } from \"@/components/Heading\";\nimport { Text } from \"@/components/Text\";\nimport { AlertIcon } from \"@/components/AlertIcon\";\nimport type { TabsProps } from \"@/components/Tabs\";\n\ntype FallbackTabProps = Pick<TabsProps, \"tabNotFoundView\">;\n\nexport const FallbackTab: FC<FallbackTabProps> = (props) => {\n const { tabNotFoundView } = props;\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"Tabs\");\n\n if (tabNotFoundView) {\n return <div className={styles.fallbackTab}>{tabNotFoundView}</div>;\n }\n\n return (\n <IllustratedMessage className={styles.fallbackTab} color=\"unavailable\">\n <AlertIcon status=\"unavailable\" />\n <Heading>{stringFormatter.format(\"fallbackTab.heading\")}</Heading>\n <Text>{stringFormatter.format(\"fallbackTab.text\")}</Text>\n </IllustratedMessage>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAYO,MAAM,WAAA,GAAoC,CAAC,KAAA,KAAU;AAC1D,EAAA,MAAM,EAAE,iBAAgB,GAAI,KAAA;AAE5B,EAAA,MAAM,eAAA,GAAkB,2BAAA,CAA4B,OAAA,EAAS,MAAM,CAAA;AAEnE,EAAA,IAAI,eAAA,EAAiB;AACnB,IAAA,uBAAO,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,aAAc,QAAA,EAAA,eAAA,EAAgB,CAAA;AAAA,EAC9D;AAEA,EAAA,4BACG,kBAAA,EAAA,EAAmB,SAAA,EAAW,MAAA,CAAO,WAAA,EAAa,OAAM,aAAA,EACvD,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,QAAO,aAAA,EAAc,CAAA;AAAA,oBAChC,GAAA,CAAC,OAAA,EAAA,EAAS,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,qBAAqB,CAAA,EAAE,CAAA;AAAA,oBACxD,GAAA,CAAC,IAAA,EAAA,EAAM,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,kBAAkB,CAAA,EAAE;AAAA,GAAA,EACpD,CAAA;AAEJ;;;;"}
@@ -3,7 +3,7 @@
3
3
  import { jsx } from 'react/jsx-runtime';
4
4
  import { useId } from 'react';
5
5
  import * as Aria from 'react-aria-components';
6
- import styles from './Tab.module.scss.mjs';
6
+ import styles from '../../Tabs.module.scss.mjs';
7
7
  import clsx from 'clsx';
8
8
  import { TabContextProvider } from './context.mjs';
9
9
  import { TunnelEntry } from '@mittwald/react-tunnel';
@@ -1 +1 @@
1
- {"version":3,"file":"Tab.mjs","sources":["../../../../../../../../../src/components/Tabs/components/Tab/Tab.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, ReactNode } from \"react\";\nimport { useId } from \"react\";\nimport type { TabPanelRenderProps } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Tab.module.scss\";\nimport clsx from \"clsx\";\nimport { TabContextProvider } from \"@/components/Tabs/components/Tab/context\";\nimport { TunnelEntry } from \"@mittwald/react-tunnel\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { Activity } from \"@/components/Activity\";\n\nexport interface TabProps\n extends Omit<Aria.TabPanelProps, \"children\">, PropsWithChildren {}\n\n/** @flr-generate all */\nexport const Tab: FC<TabProps> = (props) => {\n const { children, className, id: idFromProps, ...rest } = props;\n\n const rootClassName = clsx(styles.tabPanel, className);\n\n const generatedId = useId();\n const id = idFromProps ?? generatedId;\n\n const TabPanelRenderer = (props: TabPanelRenderProps): Awaited<ReactNode> => {\n const isSelected = props.state.selectedKey === id;\n\n const propsContext: PropsContext = {\n Content: {\n wrapWith: <Activity isActive={isSelected} />,\n },\n Section: {\n wrapWith: <Activity isActive={isSelected} />,\n },\n };\n\n return (\n <PropsContextProvider\n props={propsContext}\n dependencies={[isSelected, children]}\n >\n {children}\n </PropsContextProvider>\n );\n };\n\n return (\n <TunnelEntry id=\"Panels\">\n <TabContextProvider value={{ id }}>\n <Aria.TabPanel\n className={rootClassName}\n shouldForceMount\n id={id}\n {...rest}\n >\n {TabPanelRenderer}\n </Aria.TabPanel>\n </TabContextProvider>\n </TunnelEntry>\n );\n};\n\nexport default Tab;\n"],"names":["props"],"mappings":";;;;;;;;;;;AAgBO,MAAM,GAAA,GAAoB,CAAC,KAAA,KAAU;AAC1C,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,IAAI,WAAA,EAAa,GAAG,MAAK,GAAI,KAAA;AAE1D,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,QAAA,EAAU,SAAS,CAAA;AAErD,EAAA,MAAM,cAAc,KAAA,EAAM;AAC1B,EAAA,MAAM,KAAK,WAAA,IAAe,WAAA;AAE1B,EAAA,MAAM,gBAAA,GAAmB,CAACA,MAAAA,KAAmD;AAC3E,IAAA,MAAM,UAAA,GAAaA,MAAAA,CAAM,KAAA,CAAM,WAAA,KAAgB,EAAA;AAE/C,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,QAAA,kBAAU,GAAA,CAAC,QAAA,EAAA,EAAS,QAAA,EAAU,UAAA,EAAY;AAAA,OAC5C;AAAA,MACA,OAAA,EAAS;AAAA,QACP,QAAA,kBAAU,GAAA,CAAC,QAAA,EAAA,EAAS,QAAA,EAAU,UAAA,EAAY;AAAA;AAC5C,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,oBAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,YAAA;AAAA,QACP,YAAA,EAAc,CAAC,UAAA,EAAY,QAAQ,CAAA;AAAA,QAElC;AAAA;AAAA,KACH;AAAA,EAEJ,CAAA;AAEA,EAAA,uBACE,GAAA,CAAC,eAAY,EAAA,EAAG,QAAA,EACd,8BAAC,kBAAA,EAAA,EAAmB,KAAA,EAAO,EAAE,EAAA,EAAG,EAC9B,QAAA,kBAAA,GAAA;AAAA,IAAC,IAAA,CAAK,QAAA;AAAA,IAAL;AAAA,MACC,SAAA,EAAW,aAAA;AAAA,MACX,gBAAA,EAAgB,IAAA;AAAA,MAChB,EAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA;AAAA,KAEL,CAAA,EACF,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"Tab.mjs","sources":["../../../../../../../../../src/components/Tabs/components/Tab/Tab.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, ReactNode } from \"react\";\nimport { useId } from \"react\";\nimport type { TabPanelRenderProps } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"../../Tabs.module.scss\";\nimport clsx from \"clsx\";\nimport { TabContextProvider } from \"@/components/Tabs/components/Tab/context\";\nimport { TunnelEntry } from \"@mittwald/react-tunnel\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { Activity } from \"@/components/Activity\";\n\nexport interface TabProps\n extends Omit<Aria.TabPanelProps, \"children\">, PropsWithChildren {}\n\n/** @flr-generate all */\nexport const Tab: FC<TabProps> = (props) => {\n const { children, className, id: idFromProps, ...rest } = props;\n\n const rootClassName = clsx(styles.tabPanel, className);\n\n const generatedId = useId();\n const id = idFromProps ?? generatedId;\n\n const TabPanelRenderer = (props: TabPanelRenderProps): Awaited<ReactNode> => {\n const isSelected = props.state.selectedKey === id;\n\n const propsContext: PropsContext = {\n Content: {\n wrapWith: <Activity isActive={isSelected} />,\n },\n Section: {\n wrapWith: <Activity isActive={isSelected} />,\n },\n };\n\n return (\n <PropsContextProvider\n props={propsContext}\n dependencies={[isSelected, children]}\n >\n {children}\n </PropsContextProvider>\n );\n };\n\n return (\n <TunnelEntry id=\"Panels\">\n <TabContextProvider value={{ id }}>\n <Aria.TabPanel\n className={rootClassName}\n shouldForceMount\n id={id}\n {...rest}\n >\n {TabPanelRenderer}\n </Aria.TabPanel>\n </TabContextProvider>\n </TunnelEntry>\n );\n};\n\nexport default Tab;\n"],"names":["props"],"mappings":";;;;;;;;;;;AAgBO,MAAM,GAAA,GAAoB,CAAC,KAAA,KAAU;AAC1C,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,IAAI,WAAA,EAAa,GAAG,MAAK,GAAI,KAAA;AAE1D,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,QAAA,EAAU,SAAS,CAAA;AAErD,EAAA,MAAM,cAAc,KAAA,EAAM;AAC1B,EAAA,MAAM,KAAK,WAAA,IAAe,WAAA;AAE1B,EAAA,MAAM,gBAAA,GAAmB,CAACA,MAAAA,KAAmD;AAC3E,IAAA,MAAM,UAAA,GAAaA,MAAAA,CAAM,KAAA,CAAM,WAAA,KAAgB,EAAA;AAE/C,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,QAAA,kBAAU,GAAA,CAAC,QAAA,EAAA,EAAS,QAAA,EAAU,UAAA,EAAY;AAAA,OAC5C;AAAA,MACA,OAAA,EAAS;AAAA,QACP,QAAA,kBAAU,GAAA,CAAC,QAAA,EAAA,EAAS,QAAA,EAAU,UAAA,EAAY;AAAA;AAC5C,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,oBAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,YAAA;AAAA,QACP,YAAA,EAAc,CAAC,UAAA,EAAY,QAAQ,CAAA;AAAA,QAElC;AAAA;AAAA,KACH;AAAA,EAEJ,CAAA;AAEA,EAAA,uBACE,GAAA,CAAC,eAAY,EAAA,EAAG,QAAA,EACd,8BAAC,kBAAA,EAAA,EAAmB,KAAA,EAAO,EAAE,EAAA,EAAG,EAC9B,QAAA,kBAAA,GAAA;AAAA,IAAC,IAAA,CAAK,QAAA;AAAA,IAAL;AAAA,MACC,SAAA,EAAW,aAAA;AAAA,MACX,gBAAA,EAAgB,IAAA;AAAA,MAChB,EAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA;AAAA,KAEL,CAAA,EACF,CAAA;AAEJ;;;;"}
@@ -1,7 +1,8 @@
1
1
  import { FlowComponentProps } from '../../lib/componentFactory/flowComponent';
2
- import { PropsWithChildren } from 'react';
2
+ import { PropsWithChildren, ReactNode } from 'react';
3
3
  import * as Aria from "react-aria-components";
4
4
  export interface TabsProps extends Omit<Aria.TabsProps, "children">, PropsWithChildren, FlowComponentProps {
5
+ tabNotFoundView?: ReactNode;
5
6
  }
6
7
  /** @flr-generate all */
7
8
  export declare const Tabs: import('react').FunctionComponent<TabsProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAI/E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;AAG9C,MAAM,WAAW,SACf,SACE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,EAChC,iBAAiB,EACjB,kBAAkB;CAAG;AAEzB,wBAAwB;AACxB,eAAO,MAAM,IAAI,8FAkDf,CAAC;AAEH,eAAe,IAAI,CAAC"}
1
+ {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAI/E,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1D,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;AAI9C,MAAM,WAAW,SACf,SACE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,EAChC,iBAAiB,EACjB,kBAAkB;IAEpB,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B;AAED,wBAAwB;AACxB,eAAO,MAAM,IAAI,8FAoDf,CAAC;AAEH,eAAe,IAAI,CAAC"}
@@ -0,0 +1,6 @@
1
+ import { FC } from 'react';
2
+ import { TabsProps } from '../..';
3
+ type FallbackTabProps = Pick<TabsProps, "tabNotFoundView">;
4
+ export declare const FallbackTab: FC<FallbackTabProps>;
5
+ export {};
6
+ //# sourceMappingURL=FallbackTab.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FallbackTab.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/components/FallbackTab/FallbackTab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAQhC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEnD,KAAK,gBAAgB,GAAG,IAAI,CAAC,SAAS,EAAE,iBAAiB,CAAC,CAAC;AAE3D,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAgB5C,CAAC"}
@@ -0,0 +1,2 @@
1
+ export * from './FallbackTab';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Tabs/components/FallbackTab/index.tsx"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}
@@ -5,4 +5,5 @@ export default meta;
5
5
  type Story = StoryObj<typeof Tabs>;
6
6
  export declare const DifferentHeight: Story;
7
7
  export declare const Nested: Story;
8
+ export declare const TabNotFound: Story;
8
9
  //# sourceMappingURL=EdgeCases.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"EdgeCases.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Tabs/stories/EdgeCases.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,EAAO,IAAI,EAAY,MAAM,mBAAmB,CAAC;AAIxD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAG3B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,eAAe,EAAE,KA0B7B,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KA+BpB,CAAC"}
1
+ {"version":3,"file":"EdgeCases.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Tabs/stories/EdgeCases.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,EAAO,IAAI,EAAY,MAAM,mBAAmB,CAAC;AAKxD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAG3B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,eAAe,EAAE,KA0B7B,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KA+BpB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAkBzB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mittwald/flow-react-components",
3
- "version": "0.2.0-alpha.800",
3
+ "version": "0.2.0-alpha.801",
4
4
  "type": "module",
5
5
  "description": "A React implementation of Flow, mittwald’s design system",
6
6
  "homepage": "https://mittwald.github.io/flow",
@@ -60,9 +60,9 @@
60
60
  "@codemirror/lint": "^6.9.5",
61
61
  "@internationalized/string": "^3.2.7",
62
62
  "@lezer/highlight": "^1.2.3",
63
- "@mittwald/flow-icons": "0.2.0-alpha.800",
63
+ "@mittwald/flow-icons": "0.2.0-alpha.801",
64
64
  "@mittwald/password-tools-js": "3.0.0-alpha.18",
65
- "@mittwald/react-tunnel": "0.2.0-alpha.800",
65
+ "@mittwald/react-tunnel": "0.2.0-alpha.801",
66
66
  "@mittwald/react-use-promise": "^4.2.2",
67
67
  "@react-aria/form": "^3.1.3",
68
68
  "@react-aria/i18n": "^3.12.16",
@@ -116,7 +116,7 @@
116
116
  "@lezer/generator": "^1.8.0",
117
117
  "@lezer/lr": "^1.4.8",
118
118
  "@mittwald/flow-core": "",
119
- "@mittwald/flow-design-tokens": "0.2.0-alpha.800",
119
+ "@mittwald/flow-design-tokens": "0.2.0-alpha.801",
120
120
  "@mittwald/flow-icons-base": "",
121
121
  "@mittwald/react-use-promise": "^4.2.2",
122
122
  "@mittwald/remote-dom-react": "1.2.2-mittwald.10",
@@ -169,7 +169,7 @@
169
169
  },
170
170
  "peerDependencies": {
171
171
  "@internationalized/date": "^3.10.0",
172
- "@mittwald/flow-icons-pro": "0.2.0-alpha.799",
172
+ "@mittwald/flow-icons-pro": "0.2.0-alpha.800",
173
173
  "@mittwald/react-use-promise": "^4.2.2",
174
174
  "next": "*",
175
175
  "react": "^19.2.0",
@@ -190,5 +190,5 @@
190
190
  "optional": true
191
191
  }
192
192
  },
193
- "gitHead": "1863c196bcefd78db3832a83926197b2afc8a739"
193
+ "gitHead": "2bfacd02d2f64c64b61aefb4a1f7f34344876c33"
194
194
  }
@@ -1,9 +0,0 @@
1
- "use client"
2
- /* */
3
- const tabPanel = "flow--tabs--tab--tab-panel";
4
- const styles = {
5
- tabPanel: tabPanel
6
- };
7
-
8
- export { styles as default, tabPanel };
9
- //# sourceMappingURL=Tab.module.scss.mjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tab.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}