@mittwald/flow-react-components 0.2.0-alpha.1045 → 0.2.0-alpha.1047
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.
- package/AGENTS.md +1 -1
- package/CHANGELOG.md +10 -0
- package/MIGRATION.md +83 -0
- package/PATTERNS.md +1 -1
- package/dist/assets/doc-properties.json +36900 -36658
- package/dist/css/all-layered.css +1 -1
- package/dist/css/all.css +1 -1
- package/dist/js/default.mjs +2 -1
- package/dist/js/packages/components/src/components/ActionGroup/lib/getActionGroupSlot.mjs +1 -1
- package/dist/js/packages/components/src/components/ActionGroup/lib/getActionGroupSlot.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Align/Align.mjs +8 -31
- package/dist/js/packages/components/src/components/Align/Align.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Button/Button.mjs +5 -1
- package/dist/js/packages/components/src/components/Button/Button.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Button/Button.module.mjs +3 -3
- package/dist/js/packages/components/src/components/Button/Button.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Chat/Chat.mjs +1 -1
- package/dist/js/packages/components/src/components/Chat/Chat.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Chat/Chat.module.mjs +3 -3
- package/dist/js/packages/components/src/components/Chat/Chat.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Combine/Combine.mjs +50 -0
- package/dist/js/packages/components/src/components/Combine/Combine.mjs.map +1 -0
- package/dist/js/packages/components/src/components/Combine/Combine.module.mjs +23 -0
- package/dist/js/packages/components/src/components/Combine/Combine.module.mjs.map +1 -0
- package/dist/js/packages/components/src/components/Message/Message.mjs +7 -5
- package/dist/js/packages/components/src/components/Message/Message.mjs.map +1 -1
- package/dist/js/packages/components/src/components/propTypes/index.mjs +1 -0
- package/dist/js/packages/components/src/components/propTypes/index.mjs.map +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/SubmitButton/SubmitButton.mjs +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/SubmitButton/SubmitButton.mjs.map +1 -1
- package/dist/js/packages/components/src/status/component-status.mjs +7 -2
- package/dist/js/packages/components/src/status/component-status.mjs.map +1 -1
- package/dist/js/packages/design-tokens/dist/json/all-dark.mjs +28 -28
- package/dist/js/packages/design-tokens/dist/json/all-dark.mjs.map +1 -1
- package/dist/js/packages/design-tokens/dist/json/all-light.mjs +28 -28
- package/dist/js/packages/design-tokens/dist/json/all-light.mjs.map +1 -1
- package/dist/types/components/ActionGroup/lib/getActionGroupSlot.d.ts.map +1 -1
- package/dist/types/components/Align/Align.browser.test.d.ts +2 -0
- package/dist/types/components/Align/Align.browser.test.d.ts.map +1 -0
- package/dist/types/components/Align/Align.d.ts +4 -1
- package/dist/types/components/Align/Align.d.ts.map +1 -1
- package/dist/types/components/Button/Button.browser.test.d.ts +2 -0
- package/dist/types/components/Button/Button.browser.test.d.ts.map +1 -0
- package/dist/types/components/Button/Button.d.ts +1 -1
- package/dist/types/components/Button/Button.d.ts.map +1 -1
- package/dist/types/components/Button/stories/lib.d.ts.map +1 -1
- package/dist/types/components/Chat/Chat.d.ts.map +1 -1
- package/dist/types/components/Combine/Combine.d.ts +17 -0
- package/dist/types/components/Combine/Combine.d.ts.map +1 -0
- package/dist/types/components/Combine/index.d.ts +4 -0
- package/dist/types/components/Combine/index.d.ts.map +1 -0
- package/dist/types/components/{Align → Combine}/stories/Default.stories.d.ts +3 -3
- package/dist/types/components/Combine/stories/Default.stories.d.ts.map +1 -0
- package/dist/types/components/{Align → Combine}/stories/InputButton.stories.d.ts +3 -3
- package/dist/types/components/Combine/stories/InputButton.stories.d.ts.map +1 -0
- package/dist/types/components/Combine/view.d.ts +8 -0
- package/dist/types/components/Combine/view.d.ts.map +1 -0
- package/dist/types/components/Message/Message.d.ts.map +1 -1
- package/dist/types/components/propTypes/index.d.ts +2 -0
- package/dist/types/components/propTypes/index.d.ts.map +1 -1
- package/dist/types/components/public.d.ts +1 -0
- package/dist/types/components/public.d.ts.map +1 -1
- package/dist/types/lib/theming/hooks/useDesignTokens.d.ts +27 -27
- package/dist/types/status/component-status.json.d.ts +7 -2
- package/dist/types/views/CombineView.d.ts +5 -0
- package/dist/types/views/CombineView.d.ts.map +1 -0
- package/package.json +9 -9
- package/dist/js/packages/components/src/components/Align/Align.module.mjs +0 -23
- package/dist/js/packages/components/src/components/Align/Align.module.mjs.map +0 -1
- package/dist/types/components/Align/stories/Default.stories.d.ts.map +0 -1
- package/dist/types/components/Align/stories/InputButton.stories.d.ts.map +0 -1
package/dist/js/default.mjs
CHANGED
|
@@ -176,6 +176,7 @@ import { AlertIcon } from "./packages/components/src/components/AlertIcon/AlertI
|
|
|
176
176
|
import { Alert } from "./packages/components/src/components/Alert/Alert.mjs";
|
|
177
177
|
import { AlertBadge } from "./packages/components/src/components/AlertBadge/AlertBadge.mjs";
|
|
178
178
|
import { AlertText } from "./packages/components/src/components/AlertText/AlertText.mjs";
|
|
179
|
+
import { Combine } from "./packages/components/src/components/Combine/Combine.mjs";
|
|
179
180
|
import { Align } from "./packages/components/src/components/Align/Align.mjs";
|
|
180
181
|
import { PopoverContent } from "./packages/components/src/components/Popover/components/PopoverContent/PopoverContent.mjs";
|
|
181
182
|
import { Popover } from "./packages/components/src/components/Popover/Popover.mjs";
|
|
@@ -332,4 +333,4 @@ import { TextField } from "./packages/components/src/components/TextField/TextFi
|
|
|
332
333
|
import { TimeField } from "./packages/components/src/components/TimeField/TimeField.mjs";
|
|
333
334
|
import { Truncate } from "./packages/components/src/components/Truncate/Truncate.mjs";
|
|
334
335
|
import { TunnelEntry } from "./packages/components/src/components/TunnelEntry/TunnelEntry.mjs";
|
|
335
|
-
export { AbortActionError, AccentBox, Accordion, Action, ActionBatch, ActionGroup, Activity, Alert, AlertBadge, AlertIcon, AlertText, Align, Area, AreaDot, Autocomplete, Avatar, AvatarStack, Badge, BigNumber, Breadcrumb, BrowserOnly, Button, CartesianChart, CartesianGrid, ChartGrid, ChartLegend, ChartTooltip, Chat, Checkbox, CheckboxButton, CheckboxGroup, ClearPropsContext, CodeBlock, CodeEditor, Color, ColumnLayout, ComboBox, ComponentDefaultsContext, ComponentDefaultsProvider, ComponentPropsContextProvider, Content, ContextMenu, ContextMenuContent, ContextMenuSection, ContextMenuTrigger, ContextualHelp, ContextualHelpTrigger, CopyButton, CounterBadge, CountryOptions, DatePicker, DateRangePicker, DeprecationWarningContext, DeprecationWarningProvider, DialogTrigger, Div, DonutChart, EmptyView, EmptyViewContainer, FieldDescription, FieldError, FileCard, FileCardList, FileDropZone, FileField, Flex, GridList, GridListItem, Header, HeaderNavigation, Heading, Icon, IconAI, IconAnalytics, IconApp, IconAscending, IconAttachment, IconAutoresponder, IconBackLink, IconBackup, IconBold, IconCamera, IconCertificate, IconChangelog, IconCheck, IconCheckboxChecked, IconCheckboxEmpty, IconCheckboxIndeterminate, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClose, IconCode, IconContainer, IconContextMenu, IconContextMenuVertical, IconContract, IconContractPartner, IconContributor, IconCopy, IconCronjob, IconCustomer, IconDanger, IconDashboard, IconDatabase, IconDate, IconDelete, IconDeliveryBox, IconDescending, IconDesktop, IconDirectory, IconDnsSubZone, IconDnsZone, IconDomain, IconDownload, IconEdit, IconEmail, IconEmailArchive, IconExtension, IconExternalLink, IconFailed, IconFeedback, IconFile, IconFilter, IconForwardAddress, IconForwardLink, IconHide, IconHome, IconImage, IconInfo, IconInvite, IconInvoice, IconItalic, IconKnowledgeHint, IconLanguage, IconLeadFyndr, IconLink, IconLock, IconLockOpen, IconLogout, IconMainUser, IconMarketplace, IconMaximize, IconMember, IconMenu, IconMinimize, IconMinus, IconMittwald, IconMobile, IconMonitoring, IconMove, IconNewsletter, IconNotification, IconNumber, IconOrder, IconOrderedList, IconPassword, IconPath, IconPause, IconPayment, IconPending, IconPicture, IconPlus, IconProject, IconQuote, IconRadioOff, IconRadioOn, IconRedo, IconRefresh, IconRegistry, IconSave, IconSearch, IconSecurity, IconSend, IconServer, IconSetProvider, IconSettings, IconShare, IconShow, IconSorting, IconSsh, IconSshKey, IconSshSftp, IconStack, IconStar, IconStarFilled, IconStart, IconStrikeThrough, IconSubdomain, IconSucceeded, IconSuccess, IconSupport, IconTerminate, IconTicket, IconTime, IconUnavailable, IconUndo, IconUnorderedList, IconUpload, IconUser, IconVhost, IconView, IconVolume, IconWarning, IllustratedMessage, Image, ImageCropper, Initials, InlineCode, IntlProvider, Kbd, Label, LabeledValue, LayoutCard, Legend, LegendItem, LightBox, LightBoxGallery, LightBoxGalleryItem, LightBoxTrigger, Line, Link, List, ListFilter, ListItem, ListItemView, ListItemViewContent, ListLoaderAsync, ListSorting, ListStaticData, ListSummary, LoadingSpinner, Markdown, MarkdownEditor, MenuItem, MenuTrigger, Message, MessageSeparator, MessageThread, Modal, ModalTrigger, Navigation, NavigationGroup, Notification, NotificationController, NotificationProvider, NumberField, Option, Overlay, OverlayContent, OverlayController, OverlayTrigger, PasswordCreationField, Popover, PopoverContent, PopoverTrigger, ProgressBar, PropsContextProvider, Radio, RadioButton, RadioGroup, RangeCalendar, Rating, Render, RouterProvider, SearchField, Section, Segment, SegmentedControl, Select, Separator, SettingsProvider, Skeleton, SkeletonText, Slider, SortingFunctions, SuspenseTrigger, Switch, Tab, TabNavigation, TabTitle, Table, TableBody, TableCell, TableColumn, TableFooterRow, TableHeader, TableRow, Tabs, Text, TextArea, TextField, ThemedHtml, TimeField, Tooltip, TooltipTrigger, TranslationProvider, Truncate, TunnelEntry, TypedArea, TypedChartGrid, TypedChartLegend, TypedChartTooltip, TypedLine, TypedList, TypedListFilter, TypedListItem, TypedListLoaderAsync, TypedListSorting, TypedListStaticData, TypedXAxis, TypedYAxis, Wrap, XAxis, YAxis, abortAction, builtInComponentDefaults, dynamic, eventHandlerContext, flags, getRemoteEvent, getResolvedTheme, getTheme, iconCategories, isDateRangeValue, propsContext, setTheme, sortByDachFirst, themeHtmlAttribute, typedCartesianChart, typedList, useAriaAnnounceSuspense, useComponentDefaults, useControlledRemoteValueProps, useDesignTokens, useIsMounted, useLanguage, useList, useListMetadata, useLocalizedStringFormatter, useModalController, useNotificationController, useOnChange, useOverlayController, useProps, useTheme as useStoredTheme, useResolvedTheme as useTheme, useTranslationProvider, useWarnDeprecation };
|
|
336
|
+
export { AbortActionError, AccentBox, Accordion, Action, ActionBatch, ActionGroup, Activity, Alert, AlertBadge, AlertIcon, AlertText, Align, Area, AreaDot, Autocomplete, Avatar, AvatarStack, Badge, BigNumber, Breadcrumb, BrowserOnly, Button, CartesianChart, CartesianGrid, ChartGrid, ChartLegend, ChartTooltip, Chat, Checkbox, CheckboxButton, CheckboxGroup, ClearPropsContext, CodeBlock, CodeEditor, Color, ColumnLayout, Combine, ComboBox, ComponentDefaultsContext, ComponentDefaultsProvider, ComponentPropsContextProvider, Content, ContextMenu, ContextMenuContent, ContextMenuSection, ContextMenuTrigger, ContextualHelp, ContextualHelpTrigger, CopyButton, CounterBadge, CountryOptions, DatePicker, DateRangePicker, DeprecationWarningContext, DeprecationWarningProvider, DialogTrigger, Div, DonutChart, EmptyView, EmptyViewContainer, FieldDescription, FieldError, FileCard, FileCardList, FileDropZone, FileField, Flex, GridList, GridListItem, Header, HeaderNavigation, Heading, Icon, IconAI, IconAnalytics, IconApp, IconAscending, IconAttachment, IconAutoresponder, IconBackLink, IconBackup, IconBold, IconCamera, IconCertificate, IconChangelog, IconCheck, IconCheckboxChecked, IconCheckboxEmpty, IconCheckboxIndeterminate, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClose, IconCode, IconContainer, IconContextMenu, IconContextMenuVertical, IconContract, IconContractPartner, IconContributor, IconCopy, IconCronjob, IconCustomer, IconDanger, IconDashboard, IconDatabase, IconDate, IconDelete, IconDeliveryBox, IconDescending, IconDesktop, IconDirectory, IconDnsSubZone, IconDnsZone, IconDomain, IconDownload, IconEdit, IconEmail, IconEmailArchive, IconExtension, IconExternalLink, IconFailed, IconFeedback, IconFile, IconFilter, IconForwardAddress, IconForwardLink, IconHide, IconHome, IconImage, IconInfo, IconInvite, IconInvoice, IconItalic, IconKnowledgeHint, IconLanguage, IconLeadFyndr, IconLink, IconLock, IconLockOpen, IconLogout, IconMainUser, IconMarketplace, IconMaximize, IconMember, IconMenu, IconMinimize, IconMinus, IconMittwald, IconMobile, IconMonitoring, IconMove, IconNewsletter, IconNotification, IconNumber, IconOrder, IconOrderedList, IconPassword, IconPath, IconPause, IconPayment, IconPending, IconPicture, IconPlus, IconProject, IconQuote, IconRadioOff, IconRadioOn, IconRedo, IconRefresh, IconRegistry, IconSave, IconSearch, IconSecurity, IconSend, IconServer, IconSetProvider, IconSettings, IconShare, IconShow, IconSorting, IconSsh, IconSshKey, IconSshSftp, IconStack, IconStar, IconStarFilled, IconStart, IconStrikeThrough, IconSubdomain, IconSucceeded, IconSuccess, IconSupport, IconTerminate, IconTicket, IconTime, IconUnavailable, IconUndo, IconUnorderedList, IconUpload, IconUser, IconVhost, IconView, IconVolume, IconWarning, IllustratedMessage, Image, ImageCropper, Initials, InlineCode, IntlProvider, Kbd, Label, LabeledValue, LayoutCard, Legend, LegendItem, LightBox, LightBoxGallery, LightBoxGalleryItem, LightBoxTrigger, Line, Link, List, ListFilter, ListItem, ListItemView, ListItemViewContent, ListLoaderAsync, ListSorting, ListStaticData, ListSummary, LoadingSpinner, Markdown, MarkdownEditor, MenuItem, MenuTrigger, Message, MessageSeparator, MessageThread, Modal, ModalTrigger, Navigation, NavigationGroup, Notification, NotificationController, NotificationProvider, NumberField, Option, Overlay, OverlayContent, OverlayController, OverlayTrigger, PasswordCreationField, Popover, PopoverContent, PopoverTrigger, ProgressBar, PropsContextProvider, Radio, RadioButton, RadioGroup, RangeCalendar, Rating, Render, RouterProvider, SearchField, Section, Segment, SegmentedControl, Select, Separator, SettingsProvider, Skeleton, SkeletonText, Slider, SortingFunctions, SuspenseTrigger, Switch, Tab, TabNavigation, TabTitle, Table, TableBody, TableCell, TableColumn, TableFooterRow, TableHeader, TableRow, Tabs, Text, TextArea, TextField, ThemedHtml, TimeField, Tooltip, TooltipTrigger, TranslationProvider, Truncate, TunnelEntry, TypedArea, TypedChartGrid, TypedChartLegend, TypedChartTooltip, TypedLine, TypedList, TypedListFilter, TypedListItem, TypedListLoaderAsync, TypedListSorting, TypedListStaticData, TypedXAxis, TypedYAxis, Wrap, XAxis, YAxis, abortAction, builtInComponentDefaults, dynamic, eventHandlerContext, flags, getRemoteEvent, getResolvedTheme, getTheme, iconCategories, isDateRangeValue, propsContext, setTheme, sortByDachFirst, themeHtmlAttribute, typedCartesianChart, typedList, useAriaAnnounceSuspense, useComponentDefaults, useControlledRemoteValueProps, useDesignTokens, useIsMounted, useLanguage, useList, useListMetadata, useLocalizedStringFormatter, useModalController, useNotificationController, useOnChange, useOverlayController, useProps, useTheme as useStoredTheme, useResolvedTheme as useTheme, useTranslationProvider, useWarnDeprecation };
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
//#region src/components/ActionGroup/lib/getActionGroupSlot.tsx
|
|
4
4
|
var getActionGroupSlot = (props) => {
|
|
5
5
|
const { slot: slotFromProps, ...buttonProps } = props;
|
|
6
|
-
const guessedSlot = buttonProps.color === void 0 || buttonProps.color === "primary" || buttonProps.color === "danger" || buttonProps.color === "accent" ? "primary" : "abort";
|
|
6
|
+
const guessedSlot = buttonProps.color === void 0 || buttonProps.color === "primary" || buttonProps.color === "danger" || buttonProps.color === "success" || buttonProps.color === "accent" ? "primary" : "abort";
|
|
7
7
|
return slotFromProps ?? guessedSlot;
|
|
8
8
|
};
|
|
9
9
|
//#endregion
|
package/dist/js/packages/components/src/components/ActionGroup/lib/getActionGroupSlot.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getActionGroupSlot.mjs","names":[],"sources":["../../../../../../../../src/components/ActionGroup/lib/getActionGroupSlot.tsx"],"sourcesContent":["import type { ButtonProps } from \"@/components/Button\";\n\nexport const getActionGroupSlot = (props: ButtonProps): string => {\n const { slot: slotFromProps, ...buttonProps } = props;\n\n const guessedSlot =\n buttonProps.color === undefined ||\n buttonProps.color === \"primary\" ||\n buttonProps.color === \"danger\" ||\n buttonProps.color === \"accent\"\n ? \"primary\"\n : \"abort\";\n\n return slotFromProps ?? guessedSlot;\n};\n"],"mappings":";;;AAEA,IAAa,sBAAsB,UAA+B;CAChE,MAAM,EAAE,MAAM,eAAe,GAAG,gBAAgB;CAEhD,MAAM,cACJ,YAAY,UAAU,KAAA,KACtB,YAAY,UAAU,aACtB,YAAY,UAAU,YACtB,YAAY,UAAU,WAClB,YACA;CAEN,OAAO,iBAAiB;AAC1B"}
|
|
1
|
+
{"version":3,"file":"getActionGroupSlot.mjs","names":[],"sources":["../../../../../../../../src/components/ActionGroup/lib/getActionGroupSlot.tsx"],"sourcesContent":["import type { ButtonProps } from \"@/components/Button\";\n\nexport const getActionGroupSlot = (props: ButtonProps): string => {\n const { slot: slotFromProps, ...buttonProps } = props;\n\n const guessedSlot =\n buttonProps.color === undefined ||\n buttonProps.color === \"primary\" ||\n buttonProps.color === \"danger\" ||\n buttonProps.color === \"success\" ||\n buttonProps.color === \"accent\"\n ? \"primary\"\n : \"abort\";\n\n return slotFromProps ?? guessedSlot;\n};\n"],"mappings":";;;AAEA,IAAa,sBAAsB,UAA+B;CAChE,MAAM,EAAE,MAAM,eAAe,GAAG,gBAAgB;CAEhD,MAAM,cACJ,YAAY,UAAU,KAAA,KACtB,YAAY,UAAU,aACtB,YAAY,UAAU,YACtB,YAAY,UAAU,aACtB,YAAY,UAAU,WAClB,YACA;CAEN,OAAO,iBAAiB;AAC1B"}
|
|
@@ -1,40 +1,17 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
|
|
4
3
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
|
-
import
|
|
6
|
-
import
|
|
4
|
+
import { useWarnDeprecation } from "../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
|
|
5
|
+
import { CombineImplementation } from "../Combine/Combine.mjs";
|
|
7
6
|
import { jsx } from "react/jsx-runtime";
|
|
8
7
|
//#region src/components/Align/Align.tsx
|
|
9
|
-
/**
|
|
8
|
+
/**
|
|
9
|
+
* @deprecated Use Combine instead
|
|
10
|
+
* @flr-generate all
|
|
11
|
+
*/
|
|
10
12
|
var Align = flowComponent("Align", (props) => {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
const propsContext = {
|
|
14
|
-
Text: { className: Align_module_default.text },
|
|
15
|
-
Button: { className: Align_module_default.button },
|
|
16
|
-
Avatar: {
|
|
17
|
-
className: Align_module_default.avatar,
|
|
18
|
-
size: "m"
|
|
19
|
-
},
|
|
20
|
-
CopyButton: {
|
|
21
|
-
size: "s",
|
|
22
|
-
className: Align_module_default.copyButton
|
|
23
|
-
},
|
|
24
|
-
Icon: {
|
|
25
|
-
size: "s",
|
|
26
|
-
className: Align_module_default.icon,
|
|
27
|
-
color: "neutral"
|
|
28
|
-
},
|
|
29
|
-
ContextualHelpTrigger: { Button: { className: Align_module_default.contextualHelpTriggerButton } }
|
|
30
|
-
};
|
|
31
|
-
return /* @__PURE__ */ jsx(PropsContextProvider, {
|
|
32
|
-
props: propsContext,
|
|
33
|
-
children: /* @__PURE__ */ jsx("div", {
|
|
34
|
-
className: rootClassName,
|
|
35
|
-
children
|
|
36
|
-
})
|
|
37
|
-
});
|
|
13
|
+
useWarnDeprecation()("The 'Align' component is deprecated and will be removed in a future release. Use 'Combine' instead.");
|
|
14
|
+
return /* @__PURE__ */ jsx(CombineImplementation, { ...props });
|
|
38
15
|
}, { type: "layout" });
|
|
39
16
|
//#endregion
|
|
40
17
|
export { Align, Align as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Align.mjs","names":[],"sources":["../../../../../../../src/components/Align/Align.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport
|
|
1
|
+
{"version":3,"file":"Align.mjs","names":[],"sources":["../../../../../../../src/components/Align/Align.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { CombineImplementation } from \"@/components/Combine/Combine\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface AlignProps\n extends PropsWithChildren, PropsWithClassName, FlowComponentProps {}\n\n/**\n * @deprecated Use Combine instead\n * @flr-generate all\n */\nexport const Align = flowComponent(\n \"Align\",\n (props) => {\n const warnDeprecation = useWarnDeprecation();\n warnDeprecation(\n \"The 'Align' component is deprecated and will be removed in a future release. Use 'Combine' instead.\",\n );\n\n return <CombineImplementation {...props} />;\n },\n {\n type: \"layout\",\n },\n);\n\nexport default Align;\n"],"mappings":";;;;;;;;;;;AAcA,IAAa,QAAQ,cACnB,UACC,UAAU;CAET,mBAAA,CAAA,CACE,qGACF;CAEA,OAAO,oBAAC,uBAAD,EAAuB,GAAI,MAAQ,CAAA;AAC5C,GACA,EACE,MAAM,SACR,CACF"}
|
|
@@ -4,6 +4,7 @@ import { PropsContextProvider } from "../../lib/propsContext/components/PropsCon
|
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
5
|
import Button_module_default from "./Button.module.mjs";
|
|
6
6
|
import { extractTextFromFirstChild } from "../../lib/react/remote.mjs";
|
|
7
|
+
import { useWarnDeprecation } from "../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
|
|
7
8
|
import { IconFailed } from "../Icon/components/icons/IconFailed.mjs";
|
|
8
9
|
import { IconSucceeded } from "../Icon/components/icons/IconSucceeded.mjs";
|
|
9
10
|
import { Wrap } from "../Wrap/Wrap.mjs";
|
|
@@ -39,7 +40,10 @@ var disablePendingProps = (props) => {
|
|
|
39
40
|
/** @flr-generate all */
|
|
40
41
|
var Button = flowComponent("Button", (props) => {
|
|
41
42
|
props = disablePendingProps(props);
|
|
42
|
-
const
|
|
43
|
+
const warnDeprecation = useWarnDeprecation();
|
|
44
|
+
const { color: colorFromProps = "primary", variant = "solid", children, className, size = "m", isPending, isSucceeded, isFailed, "aria-disabled": ariaDisabled, ref, slot: ignoredSlotProp, ariaSlot: slot, unstyled, isReadOnly, elementType, ...restProps } = props;
|
|
45
|
+
if (colorFromProps === "accent") warnDeprecation("The color 'accent' is deprecated and will be removed in a future release. Use 'success' instead.");
|
|
46
|
+
const color = colorFromProps === "accent" ? "success" : colorFromProps;
|
|
43
47
|
const rootClassName = unstyled ? className : clsx(
|
|
44
48
|
Button_module_default.button,
|
|
45
49
|
isPending && Button_module_default.isPending,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Button.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { IconFailed, IconSucceeded } from \"@/components/Icon/components/icons\";\nimport { Wrap } from \"@/components/Wrap\";\nimport { Text } from \"@/components/Text\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport LoadingSpinner from \"@/components/LoadingSpinner/LoadingSpinner\";\nimport { useAriaAnnounceActionState } from \"@/components/Action/lib/ariaLive\";\nimport { extractTextFromFirstChild } from \"@/lib/react/remote\";\nimport type { AlphaColor } from \"@/lib/types/props\";\nimport { filterDOMProps } from \"@react-aria/utils\";\n\nexport interface ButtonProps\n extends\n PropsWithChildren<Aria.ButtonProps>,\n FlowComponentProps<HTMLButtonElement> {\n /** Slot for button placement in action groups. */\n slot?: string;\n /** The color of the button. @default \"primary\" */\n color
|
|
1
|
+
{"version":3,"file":"Button.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Button.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { IconFailed, IconSucceeded } from \"@/components/Icon/components/icons\";\nimport { Wrap } from \"@/components/Wrap\";\nimport { Text } from \"@/components/Text\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport LoadingSpinner from \"@/components/LoadingSpinner/LoadingSpinner\";\nimport { useAriaAnnounceActionState } from \"@/components/Action/lib/ariaLive\";\nimport { extractTextFromFirstChild } from \"@/lib/react/remote\";\nimport type { AlphaColor } from \"@/lib/types/props\";\nimport { filterDOMProps } from \"@react-aria/utils\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface ButtonProps\n extends\n PropsWithChildren<Aria.ButtonProps>,\n FlowComponentProps<HTMLButtonElement> {\n /** Slot for button placement in action groups. */\n slot?: string;\n /** The color of the button. @default \"primary\" */\n color?:\n | \"primary\"\n | \"success\"\n | \"secondary\"\n | \"danger\"\n | AlphaColor\n | \"accent\";\n /** The visual variant of the button. @default \"solid\" */\n variant?: \"plain\" | \"solid\" | \"soft\" | \"outline\";\n /** The size of the button. @default \"m\" */\n size?: \"m\" | \"s\";\n /** Disables button but keeps it focusable. */\n \"aria-disabled\"?: boolean;\n /** Whether the button is in a pending state. */\n isPending?: boolean;\n /** Whether the button is in a succeeded state. */\n isSucceeded?: boolean;\n /** Whether the button is in a failed state. */\n isFailed?: boolean;\n /** Whether the button is in a read only state. */\n isReadOnly?: boolean;\n /** @internal */\n unstyled?: boolean;\n /** @internal */\n ariaSlot?: string | null;\n /** @internal */\n elementType?: \"button\" | \"span\";\n}\n\nconst disablePendingProps = (props: ButtonProps) => {\n if (\n props.isPending ||\n props.isSucceeded ||\n props.isFailed ||\n props[\"aria-disabled\"] ||\n props.isReadOnly\n ) {\n props = { ...props };\n\n const mutedActionHandler = (e: unknown) => {\n if (e && typeof e === \"object\") {\n // stopPropagation is the default behavior in React Aria\n const isReactAriaEvent =\n \"continuePropagation\" in e &&\n typeof e.continuePropagation === \"function\";\n\n if (\n !isReactAriaEvent &&\n \"stopPropagation\" in e &&\n typeof e.stopPropagation === \"function\"\n ) {\n e.stopPropagation();\n }\n if (\"preventDefault\" in e && typeof e.preventDefault === \"function\") {\n e.preventDefault();\n }\n }\n\n return false;\n };\n\n props.onClick = mutedActionHandler;\n props.onPress = mutedActionHandler;\n props.onPressStart = mutedActionHandler;\n props.onPressEnd = mutedActionHandler;\n props.onPressChange = mutedActionHandler;\n props.onPressUp = mutedActionHandler;\n props.onKeyDown = mutedActionHandler;\n props.onKeyUp = mutedActionHandler;\n }\n\n return props;\n};\n\n/** @flr-generate all */\nexport const Button = flowComponent(\"Button\", (props) => {\n props = disablePendingProps(props);\n\n const warnDeprecation = useWarnDeprecation();\n\n const {\n color: colorFromProps = \"primary\",\n variant = \"solid\",\n children,\n className,\n size = \"m\",\n isPending,\n isSucceeded,\n isFailed,\n \"aria-disabled\": ariaDisabled,\n ref,\n slot: ignoredSlotProp,\n ariaSlot: slot,\n unstyled,\n isReadOnly,\n elementType,\n ...restProps\n } = props;\n\n if (colorFromProps === \"accent\") {\n warnDeprecation(\n \"The color 'accent' is deprecated and will be removed in a future release. Use 'success' instead.\",\n );\n }\n\n const color = colorFromProps === \"accent\" ? \"success\" : colorFromProps;\n\n const rootClassName = unstyled\n ? className\n : clsx(\n styles.button,\n isPending && styles.isPending,\n isSucceeded && styles.isSucceeded,\n isFailed && styles.isFailed,\n size === \"s\" && styles[\"size-s\"],\n styles[color],\n styles[variant],\n /**\n * Workaround warning: The Aria.Button does not support \"aria-disabled\"\n * by now, so this Button will be visually disabled via CSS.\n */\n ariaDisabled && styles.ariaDisabled,\n className,\n );\n\n useAriaAnnounceActionState(\n isPending\n ? \"isPending\"\n : isSucceeded\n ? \"isSucceeded\"\n : isFailed\n ? \"isFailed\"\n : \"isIdle\",\n );\n\n const propsContext: PropsContext = {\n Icon: {\n className: styles.icon,\n \"aria-hidden\": true,\n size,\n },\n Text: {\n className: styles.text,\n },\n Avatar: {\n className: styles.avatar,\n },\n CounterBadge: {\n className: styles.counterBadge,\n },\n Image: {\n className: styles.image,\n },\n };\n\n const stateIcon = isSucceeded ? (\n <IconSucceeded size={size} className={styles.stateIcon} color=\"success\" />\n ) : isFailed ? (\n <IconFailed size={size} className={styles.stateIcon} color=\"danger\" />\n ) : isPending ? (\n <LoadingSpinner size={size} className={styles.stateIcon} />\n ) : undefined;\n\n const isStringContent = extractTextFromFirstChild(children) !== undefined;\n\n const content = (\n <>\n <PropsContextProvider props={propsContext}>\n <Wrap if={!unstyled}>\n <span className={styles.content}>\n <Wrap if={isStringContent}>\n <Text className={styles.text}>{children}</Text>\n </Wrap>\n </span>\n </Wrap>\n </PropsContextProvider>\n {stateIcon}\n </>\n );\n\n if (elementType === \"span\") {\n const spanProps = filterDOMProps(restProps, { global: true });\n\n return (\n <span\n {...spanProps}\n data-disabled={restProps.isDisabled || undefined}\n className={\n typeof rootClassName === \"string\" ? rootClassName : undefined\n }\n >\n {content}\n </span>\n );\n }\n\n return (\n <Aria.Button\n className={rootClassName}\n ref={ref}\n slot={slot}\n {...(isReadOnly === true ? { \"data-readonly\": true } : {})}\n {...restProps}\n >\n {content}\n </Aria.Button>\n );\n});\n\nexport default Button;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAsDA,IAAM,uBAAuB,UAAuB;CAClD,IACE,MAAM,aACN,MAAM,eACN,MAAM,YACN,MAAM,oBACN,MAAM,YACN;EACA,QAAQ,EAAE,GAAG,MAAM;EAEnB,MAAM,sBAAsB,MAAe;GACzC,IAAI,KAAK,OAAO,MAAM,UAAU;IAM9B,IACE,EAJA,yBAAyB,KACzB,OAAO,EAAE,wBAAwB,eAIjC,qBAAqB,KACrB,OAAO,EAAE,oBAAoB,YAE7B,EAAE,gBAAgB;IAEpB,IAAI,oBAAoB,KAAK,OAAO,EAAE,mBAAmB,YACvD,EAAE,eAAe;GAErB;GAEA,OAAO;EACT;EAEA,MAAM,UAAU;EAChB,MAAM,UAAU;EAChB,MAAM,eAAe;EACrB,MAAM,aAAa;EACnB,MAAM,gBAAgB;EACtB,MAAM,YAAY;EAClB,MAAM,YAAY;EAClB,MAAM,UAAU;CAClB;CAEA,OAAO;AACT;;AAGA,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,QAAQ,oBAAoB,KAAK;CAEjC,MAAM,kBAAkB,mBAAmB;CAE3C,MAAM,EACJ,OAAO,iBAAiB,WACxB,UAAU,SACV,UACA,WACA,OAAO,KACP,WACA,aACA,UACA,iBAAiB,cACjB,KACA,MAAM,iBACN,UAAU,MACV,UACA,YACA,aACA,GAAG,cACD;CAEJ,IAAI,mBAAmB,UACrB,gBACE,kGACF;CAGF,MAAM,QAAQ,mBAAmB,WAAW,YAAY;CAExD,MAAM,gBAAgB,WAClB,YACA;EACE,sBAAO;EACP,aAAa,sBAAO;EACpB,eAAe,sBAAO;EACtB,YAAY,sBAAO;EACnB,SAAS,OAAO,sBAAO;EACvB,sBAAO;EACP,sBAAO;;;;;EAKP,gBAAgB,sBAAO;EACvB;CACF;CAEJ,2BACE,YACI,cACA,cACE,gBACA,WACE,aACA,QACV;CAEA,MAAM,eAA6B;EACjC,MAAM;GACJ,WAAW,sBAAO;GAClB,eAAe;GACf;EACF;EACA,MAAM,EACJ,WAAW,sBAAO,KACpB;EACA,QAAQ,EACN,WAAW,sBAAO,OACpB;EACA,cAAc,EACZ,WAAW,sBAAO,aACpB;EACA,OAAO,EACL,WAAW,sBAAO,MACpB;CACF;CAEA,MAAM,YAAY,cAChB,oBAAC,eAAD;EAAqB;EAAM,WAAW,sBAAO;EAAW,OAAM;CAAW,CAAA,IACvE,WACF,oBAAC,YAAD;EAAkB;EAAM,WAAW,sBAAO;EAAW,OAAM;CAAU,CAAA,IACnE,YACF,oBAAC,gBAAD;EAAsB;EAAM,WAAW,sBAAO;CAAY,CAAA,IACxD,KAAA;CAEJ,MAAM,kBAAkB,0BAA0B,QAAQ,MAAM,KAAA;CAEhE,MAAM,UACJ,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,sBAAD;EAAsB,OAAO;EAC3B,UAAA,oBAAC,MAAD;GAAM,IAAI,CAAC;GACT,UAAA,oBAAC,QAAD;IAAM,WAAW,sBAAO;IACtB,UAAA,oBAAC,MAAD;KAAM,IAAI;KACR,UAAA,oBAAC,MAAD;MAAM,WAAW,sBAAO;MAAO;KAAe,CAAA;IAC1C,CAAA;GACF,CAAA;EACF,CAAA;CACc,CAAA,GACrB,SACD,EAAA,CAAA;CAGJ,IAAI,gBAAgB,QAAQ;EAC1B,MAAM,YAAY,eAAe,WAAW,EAAE,QAAQ,KAAK,CAAC;EAE5D,OACE,oBAAC,QAAD;GACE,GAAI;GACJ,iBAAe,UAAU,cAAc,KAAA;GACvC,WACE,OAAO,kBAAkB,WAAW,gBAAgB,KAAA;GAGrD,UAAA;EACG,CAAA;CAEV;CAEA,OACE,oBAAC,KAAK,QAAN;EACE,WAAW;EACN;EACC;EACN,GAAK,eAAe,OAAO,EAAE,iBAAiB,KAAK,IAAI,CAAC;EACxD,GAAI;EAEH,UAAA;CACU,CAAA;AAEjB,CAAC"}
|
|
@@ -15,7 +15,7 @@ var plain = "flow--button--plain";
|
|
|
15
15
|
var primary = "flow--button--primary";
|
|
16
16
|
var solid = "flow--button--solid";
|
|
17
17
|
var ariaDisabled = "flow--button--aria-disabled";
|
|
18
|
-
var
|
|
18
|
+
var success = "flow--button--success";
|
|
19
19
|
var danger = "flow--button--danger";
|
|
20
20
|
var secondary = "flow--button--secondary";
|
|
21
21
|
var dark = "flow--button--dark";
|
|
@@ -39,7 +39,7 @@ var Button_module_default = {
|
|
|
39
39
|
primary,
|
|
40
40
|
solid,
|
|
41
41
|
ariaDisabled,
|
|
42
|
-
|
|
42
|
+
success,
|
|
43
43
|
danger,
|
|
44
44
|
secondary,
|
|
45
45
|
dark,
|
|
@@ -51,6 +51,6 @@ var Button_module_default = {
|
|
|
51
51
|
image
|
|
52
52
|
};
|
|
53
53
|
//#endregion
|
|
54
|
-
export {
|
|
54
|
+
export { ariaDisabled, avatar, button, content, counterBadge, danger, dark, Button_module_default as default, icon, image, isFailed, isPending, isSucceeded, light, outline, plain, primary, secondary, soft, solid, stateIcon, success, text };
|
|
55
55
|
|
|
56
56
|
//# sourceMappingURL=Button.module.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.module.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.module.scss"],"sourcesContent":["@use \"@/styles/mixins/ellipsis\";\n@use \"@/styles/mixins/focus\";\n@use \"@/styles/mixins/avatarButton\";\n\n.button {\n position: relative;\n font-family: Inter, sans-serif;\n font-size: var(--font-size-text--m);\n font-weight: bold;\n line-height: var(--line-height);\n border: none;\n border-radius: var(--button--corner-radius);\n padding-block: var(--button--padding-y);\n padding-inline: var(--button--padding-x);\n transition-property: color, background-color;\n transition-duration: var(--transition--duration--default);\n max-width: 100%;\n display: grid;\n align-items: center;\n grid-template-areas: \"content\";\n width: fit-content;\n\n &:where(.outline) {\n border-width: var(--button--border-width);\n border-style: var(--button--border-style);\n padding-block: calc(var(--button--padding-y) - var(--button--border-width));\n padding-inline: calc(\n var(--button--padding-x) - var(--button--border-width)\n );\n }\n\n @include focus.focus;\n\n @extend .primary;\n @extend .solid;\n\n /* Elements */\n .content {\n display: flex;\n column-gap: var(--button--spacing);\n align-items: center;\n justify-content: center;\n }\n\n .content,\n .stateIcon {\n grid-area: content;\n }\n\n .stateIcon {\n justify-self: center;\n }\n\n &:where(:has(.icon):not(:has(.text))) {\n padding: var(--button--padding-icon-only);\n\n &:where(.outline) {\n padding: calc(\n var(--button--padding-icon-only) - var(--button--border-width)\n );\n }\n }\n\n &:where(:has(.text) .icon) {\n margin-inline-start: var(--button--spacing);\n }\n\n .counterBadge {\n position: absolute;\n top: calc(var(--size-px--xxs) * -1);\n inset-inline-end: calc(var(--size-px--xxs) * -1);\n }\n\n /* States */\n\n &.isPending,\n &.isFailed,\n &.isSucceeded {\n .content {\n opacity: 0;\n }\n\n &.plain {\n .content:has(.text) {\n opacity: 1;\n }\n }\n }\n\n &.isPending {\n .stateIcon {\n color: var(--button--pending-icon-color);\n }\n }\n\n /* Size */\n\n &:where(.size-s) {\n font-size: var(--button--font-size-s);\n line-height: var(--button--line-height-s);\n padding-block: var(--button--padding-s-y);\n padding-inline: var(--button--padding-s-x);\n column-gap: var(--button--spacing-s);\n border-radius: var(--button--corner-radius-s);\n\n &:where(.outline) {\n padding-block: calc(\n var(--button--padding-s-y) - var(--button--border-width)\n );\n padding-inline: calc(\n var(--button--padding-s-x) - var(--button--border-width)\n );\n }\n\n &:where(:has(.icon):not(:has(.text))) {\n padding: var(--button--padding-s-icon-only);\n\n &:where(.outline) {\n padding: calc(\n var(--button--padding-s-icon-only) - var(--button--border-width)\n );\n }\n }\n\n .content {\n column-gap: var(--button--spacing-s);\n }\n }\n\n /* Variants */\n\n @mixin variant($color, $variant) {\n &:where(.#{$color}.#{$variant}) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--default\n );\n color: var(--button--#{$color}-#{$variant}-content-color--default);\n\n &:hover:where(:not([data-readonly])) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--hover\n );\n }\n\n &[data-pressed]:where(:not([data-readonly])) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--pressed\n );\n }\n\n &[disabled],\n &[data-disabled],\n &.ariaDisabled,\n &.isPending,\n &.isFailed,\n &.isSucceeded {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--disabled\n );\n color: var(--button--#{$color}-#{$variant}-content-color--disabled);\n }\n }\n }\n\n @include variant(primary, solid);\n @include variant(
|
|
1
|
+
{"version":3,"file":"Button.module.mjs","names":[],"sources":["../../../../../../../src/components/Button/Button.module.scss"],"sourcesContent":["@use \"@/styles/mixins/ellipsis\";\n@use \"@/styles/mixins/focus\";\n@use \"@/styles/mixins/avatarButton\";\n\n.button {\n position: relative;\n font-family: Inter, sans-serif;\n font-size: var(--font-size-text--m);\n font-weight: bold;\n line-height: var(--line-height);\n border: none;\n border-radius: var(--button--corner-radius);\n padding-block: var(--button--padding-y);\n padding-inline: var(--button--padding-x);\n transition-property: color, background-color;\n transition-duration: var(--transition--duration--default);\n max-width: 100%;\n display: grid;\n align-items: center;\n grid-template-areas: \"content\";\n width: fit-content;\n\n &:where(.outline) {\n border-width: var(--button--border-width);\n border-style: var(--button--border-style);\n padding-block: calc(var(--button--padding-y) - var(--button--border-width));\n padding-inline: calc(\n var(--button--padding-x) - var(--button--border-width)\n );\n }\n\n @include focus.focus;\n\n @extend .primary;\n @extend .solid;\n\n /* Elements */\n .content {\n display: flex;\n column-gap: var(--button--spacing);\n align-items: center;\n justify-content: center;\n }\n\n .content,\n .stateIcon {\n grid-area: content;\n }\n\n .stateIcon {\n justify-self: center;\n }\n\n &:where(:has(.icon):not(:has(.text))) {\n padding: var(--button--padding-icon-only);\n\n &:where(.outline) {\n padding: calc(\n var(--button--padding-icon-only) - var(--button--border-width)\n );\n }\n }\n\n &:where(:has(.text) .icon) {\n margin-inline-start: var(--button--spacing);\n }\n\n .counterBadge {\n position: absolute;\n top: calc(var(--size-px--xxs) * -1);\n inset-inline-end: calc(var(--size-px--xxs) * -1);\n }\n\n /* States */\n\n &.isPending,\n &.isFailed,\n &.isSucceeded {\n .content {\n opacity: 0;\n }\n\n &.plain {\n .content:has(.text) {\n opacity: 1;\n }\n }\n }\n\n &.isPending {\n .stateIcon {\n color: var(--button--pending-icon-color);\n }\n }\n\n /* Size */\n\n &:where(.size-s) {\n font-size: var(--button--font-size-s);\n line-height: var(--button--line-height-s);\n padding-block: var(--button--padding-s-y);\n padding-inline: var(--button--padding-s-x);\n column-gap: var(--button--spacing-s);\n border-radius: var(--button--corner-radius-s);\n\n &:where(.outline) {\n padding-block: calc(\n var(--button--padding-s-y) - var(--button--border-width)\n );\n padding-inline: calc(\n var(--button--padding-s-x) - var(--button--border-width)\n );\n }\n\n &:where(:has(.icon):not(:has(.text))) {\n padding: var(--button--padding-s-icon-only);\n\n &:where(.outline) {\n padding: calc(\n var(--button--padding-s-icon-only) - var(--button--border-width)\n );\n }\n }\n\n .content {\n column-gap: var(--button--spacing-s);\n }\n }\n\n /* Variants */\n\n @mixin variant($color, $variant) {\n &:where(.#{$color}.#{$variant}) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--default\n );\n color: var(--button--#{$color}-#{$variant}-content-color--default);\n\n &:hover:where(:not([data-readonly])) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--hover\n );\n }\n\n &[data-pressed]:where(:not([data-readonly])) {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--pressed\n );\n }\n\n &[disabled],\n &[data-disabled],\n &.ariaDisabled,\n &.isPending,\n &.isFailed,\n &.isSucceeded {\n background-color: var(\n --button--#{$color}-#{$variant}-background-color--disabled\n );\n color: var(--button--#{$color}-#{$variant}-content-color--disabled);\n }\n }\n }\n\n @include variant(primary, solid);\n @include variant(success, solid);\n @include variant(danger, solid);\n @include variant(secondary, solid);\n @include variant(dark, solid);\n @include variant(light, solid);\n @include variant(dark-static, solid);\n @include variant(light-static, solid);\n @include variant(primary, plain);\n @include variant(success, plain);\n @include variant(danger, plain);\n @include variant(secondary, plain);\n @include variant(dark, plain);\n @include variant(light, plain);\n @include variant(dark-static, plain);\n @include variant(light-static, plain);\n @include variant(primary, soft);\n @include variant(success, soft);\n @include variant(danger, soft);\n @include variant(secondary, soft);\n @include variant(dark, soft);\n @include variant(light, soft);\n @include variant(dark-static, soft);\n @include variant(light-static, soft);\n @include variant(primary, outline);\n @include variant(success, outline);\n @include variant(danger, outline);\n @include variant(secondary, outline);\n @include variant(dark, outline);\n @include variant(light, outline);\n @include variant(dark-static, outline);\n @include variant(light-static, outline);\n\n /* Outline */\n\n @mixin outline($color, $variant) {\n &:where(.#{$color}.#{$variant}) {\n &.outline {\n border-color: var(\n --button--#{$color}-#{$variant}-border-color--default\n );\n\n &[disabled],\n &[data-disabled],\n &.ariaDisabled,\n &.isPending,\n &.isFailed {\n border-color: var(\n --button--#{$color}-#{$variant}-border-color--disabled\n );\n }\n }\n }\n }\n\n @include outline(primary, outline);\n @include outline(success, outline);\n @include outline(danger, outline);\n @include outline(secondary, outline);\n @include outline(dark, outline);\n @include outline(light, outline);\n @include outline(dark-static, outline);\n @include outline(light-static, outline);\n @include avatarButton.avatarButton();\n\n &:has(.image) {\n padding: 0;\n background: none;\n height: fit-content;\n\n &:hover:where(:not([data-readonly])) .image {\n background: var(--button--dark-plain-background-color--hover);\n filter: brightness(var(--image-button--brightness--hover));\n }\n\n &[data-pressed]:where(:not([data-readonly])) .image {\n background: var(--button--dark-plain-background-color--pressed);\n filter: brightness(var(--image-button--brightness--pressed));\n }\n\n .image {\n width: 100%;\n }\n }\n}\n"],"mappings":""}
|
|
@@ -25,7 +25,7 @@ var Chat = flowComponent("Chat", (props) => {
|
|
|
25
25
|
}
|
|
26
26
|
},
|
|
27
27
|
Button: { className: dynamic((props) => {
|
|
28
|
-
return props.color === "accent" ? Chat_module_default.
|
|
28
|
+
return props.color === "success" || props.color === "accent" ? Chat_module_default.successButton : Chat_module_default.button;
|
|
29
29
|
}) }
|
|
30
30
|
};
|
|
31
31
|
return /* @__PURE__ */ jsx(PropsContextProvider, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chat.mjs","names":[],"sources":["../../../../../../../src/components/Chat/Chat.tsx"],"sourcesContent":["import type { CSSProperties, FC, PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport styles from \"./Chat.module.scss\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface ChatProps extends PropsWithChildren, PropsWithClassName {\n /** The height of the chat. */\n height?: CSSProperties[\"height\"];\n}\n\n/** @flr-generate all */\nexport const Chat: FC<ChatProps> = flowComponent(\n \"Chat\",\n (props) => {\n const { height, className, children } = props;\n\n const rootClassName = clsx(styles.chat, className);\n\n const propsContext: PropsContext = {\n MessageThread: {\n tunnel: {\n id: \"messageThread\",\n component: \"Chat\",\n },\n },\n FileCardList: {\n className: styles.fileCardList,\n tunnel: {\n id: \"fileCardList\",\n component: \"Chat\",\n },\n },\n Button: {\n className: dynamic((props) => {\n return props.color === \"accent\"
|
|
1
|
+
{"version":3,"file":"Chat.mjs","names":[],"sources":["../../../../../../../src/components/Chat/Chat.tsx"],"sourcesContent":["import type { CSSProperties, FC, PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport styles from \"./Chat.module.scss\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface ChatProps extends PropsWithChildren, PropsWithClassName {\n /** The height of the chat. */\n height?: CSSProperties[\"height\"];\n}\n\n/** @flr-generate all */\nexport const Chat: FC<ChatProps> = flowComponent(\n \"Chat\",\n (props) => {\n const { height, className, children } = props;\n\n const rootClassName = clsx(styles.chat, className);\n\n const propsContext: PropsContext = {\n MessageThread: {\n tunnel: {\n id: \"messageThread\",\n component: \"Chat\",\n },\n },\n FileCardList: {\n className: styles.fileCardList,\n tunnel: {\n id: \"fileCardList\",\n component: \"Chat\",\n },\n },\n Button: {\n className: dynamic((props) => {\n return props.color === \"success\" || props.color === \"accent\"\n ? styles.successButton\n : styles.button;\n }),\n },\n };\n\n return (\n <PropsContextProvider props={propsContext}>\n <div style={{ height }} className={rootClassName}>\n <div className={styles.messageThreadContainer}>\n <UiComponentTunnelExit id=\"messageThread\" component=\"Chat\" />\n </div>\n <div className={styles.controls}>{children}</div>\n <UiComponentTunnelExit id=\"fileCardList\" component=\"Chat\" />\n </div>\n </PropsContextProvider>\n );\n },\n {\n type: \"layout\",\n },\n);\n\nexport default Chat;\n"],"mappings":";;;;;;;;;;;AAkBA,IAAa,OAAsB,cACjC,SACC,UAAU;CACT,MAAM,EAAE,QAAQ,WAAW,aAAa;CAExC,MAAM,gBAAgB,KAAK,oBAAO,MAAM,SAAS;CAEjD,MAAM,eAA6B;EACjC,eAAe,EACb,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,cAAc;GACZ,WAAW,oBAAO;GAClB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;EACF;EACA,QAAQ,EACN,WAAW,SAAS,UAAU;GAC5B,OAAO,MAAM,UAAU,aAAa,MAAM,UAAU,WAChD,oBAAO,gBACP,oBAAO;EACb,CAAC,EACH;CACF;CAEA,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAC3B,UAAA,qBAAC,OAAD;GAAK,OAAO,EAAE,OAAO;GAAG,WAAW;GAAnC,UAAA;IACE,oBAAC,OAAD;KAAK,WAAW,oBAAO;KACrB,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAgB,WAAU;KAAQ,CAAA;IACzD,CAAA;IACL,oBAAC,OAAD;KAAK,WAAW,oBAAO;KAAW;IAAc,CAAA;IAChD,oBAAC,uBAAD;KAAuB,IAAG;KAAe,WAAU;IAAQ,CAAA;GACxD;;CACe,CAAA;AAE1B,GACA,EACE,MAAM,SACR,CACF"}
|
|
@@ -5,17 +5,17 @@ var chat = "flow--chat";
|
|
|
5
5
|
var messageThreadContainer = "flow--chat--message-thread-container";
|
|
6
6
|
var fileCardList = "flow--chat--file-card-list";
|
|
7
7
|
var controls = "flow--chat--controls";
|
|
8
|
-
var
|
|
8
|
+
var successButton = "flow--chat--success-button";
|
|
9
9
|
var button = "flow--chat--button";
|
|
10
10
|
var Chat_module_default = {
|
|
11
11
|
chat,
|
|
12
12
|
messageThreadContainer,
|
|
13
13
|
fileCardList,
|
|
14
14
|
controls,
|
|
15
|
-
|
|
15
|
+
successButton,
|
|
16
16
|
button
|
|
17
17
|
};
|
|
18
18
|
//#endregion
|
|
19
|
-
export {
|
|
19
|
+
export { button, chat, controls, Chat_module_default as default, fileCardList, messageThreadContainer, successButton };
|
|
20
20
|
|
|
21
21
|
//# sourceMappingURL=Chat.module.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chat.module.mjs","names":[],"sources":["../../../../../../../src/components/Chat/Chat.module.scss"],"sourcesContent":["@use \"@/styles/mixins/scrollbar\";\n\n.chat {\n display: flex;\n flex-direction: column;\n width: 100%;\n\n .messageThreadContainer {\n @include scrollbar.scrollbar;\n\n overflow: auto;\n padding-bottom: var(--chat--spacing);\n padding-inline-end: var(--size-px--m);\n margin-inline-end: calc(var(--size-px--m) * -1);\n flex-grow: 1;\n display: flex;\n flex-direction: column-reverse;\n }\n\n .fileCardList {\n margin-top: var(--chat--spacing);\n }\n\n .controls:not(:has(form)),\n .controls form {\n display: flex;\n align-items: flex-start;\n gap: var(--chat--spacing);\n flex-wrap: wrap;\n padding-top: var(--chat--spacing);\n\n > :first-child {\n order: 0;\n width: 100%;\n }\n\n .
|
|
1
|
+
{"version":3,"file":"Chat.module.mjs","names":[],"sources":["../../../../../../../src/components/Chat/Chat.module.scss"],"sourcesContent":["@use \"@/styles/mixins/scrollbar\";\n\n.chat {\n display: flex;\n flex-direction: column;\n width: 100%;\n\n .messageThreadContainer {\n @include scrollbar.scrollbar;\n\n overflow: auto;\n padding-bottom: var(--chat--spacing);\n padding-inline-end: var(--size-px--m);\n margin-inline-end: calc(var(--size-px--m) * -1);\n flex-grow: 1;\n display: flex;\n flex-direction: column-reverse;\n }\n\n .fileCardList {\n margin-top: var(--chat--spacing);\n }\n\n .controls:not(:has(form)),\n .controls form {\n display: flex;\n align-items: flex-start;\n gap: var(--chat--spacing);\n flex-wrap: wrap;\n padding-top: var(--chat--spacing);\n\n > :first-child {\n order: 0;\n width: 100%;\n }\n\n .successButton,\n .button {\n order: 1;\n }\n\n .successButton {\n margin-inline-start: auto;\n }\n }\n}\n\n@media (max-width: 550px) {\n .successButton,\n .button {\n flex-grow: 1;\n }\n}\n"],"mappings":""}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
|
|
4
|
+
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
|
+
import Combine_module_default from "./Combine.module.mjs";
|
|
6
|
+
import clsx from "clsx";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
//#region src/components/Combine/Combine.tsx
|
|
9
|
+
/**
|
|
10
|
+
* The arrangement itself, shared with the deprecated `Align` alias so both
|
|
11
|
+
* names render the exact same output.
|
|
12
|
+
*/
|
|
13
|
+
var CombineImplementation = (props) => {
|
|
14
|
+
const { children, className } = props;
|
|
15
|
+
const rootClassName = clsx(Combine_module_default.combine, className);
|
|
16
|
+
const propsContext = {
|
|
17
|
+
Text: { className: Combine_module_default.text },
|
|
18
|
+
Button: { className: Combine_module_default.button },
|
|
19
|
+
Avatar: {
|
|
20
|
+
className: Combine_module_default.avatar,
|
|
21
|
+
size: "m"
|
|
22
|
+
},
|
|
23
|
+
CopyButton: {
|
|
24
|
+
size: "s",
|
|
25
|
+
className: Combine_module_default.copyButton
|
|
26
|
+
},
|
|
27
|
+
Icon: {
|
|
28
|
+
size: "s",
|
|
29
|
+
className: Combine_module_default.icon,
|
|
30
|
+
color: "neutral"
|
|
31
|
+
},
|
|
32
|
+
ContextualHelpTrigger: { Button: { className: Combine_module_default.contextualHelpTriggerButton } }
|
|
33
|
+
};
|
|
34
|
+
return /* @__PURE__ */ jsx(PropsContextProvider, {
|
|
35
|
+
props: propsContext,
|
|
36
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
37
|
+
className: rootClassName,
|
|
38
|
+
children
|
|
39
|
+
})
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
/**
|
|
43
|
+
* @flowStatus new
|
|
44
|
+
* @flr-generate all
|
|
45
|
+
*/
|
|
46
|
+
var Combine = flowComponent("Combine", CombineImplementation, { type: "layout" });
|
|
47
|
+
//#endregion
|
|
48
|
+
export { Combine, Combine as default, CombineImplementation };
|
|
49
|
+
|
|
50
|
+
//# sourceMappingURL=Combine.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Combine.mjs","names":[],"sources":["../../../../../../../src/components/Combine/Combine.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport styles from \"./Combine.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport interface CombineProps\n extends PropsWithChildren, PropsWithClassName, FlowComponentProps {}\n\n/**\n * The arrangement itself, shared with the deprecated `Align` alias so both\n * names render the exact same output.\n */\nexport const CombineImplementation: FC<CombineProps> = (props) => {\n const { children, className } = props;\n\n const rootClassName = clsx(styles.combine, className);\n\n const propsContext: PropsContext = {\n Text: { className: styles.text },\n Button: { className: styles.button },\n Avatar: { className: styles.avatar, size: \"m\" },\n CopyButton: { size: \"s\", className: styles.copyButton },\n Icon: { size: \"s\", className: styles.icon, color: \"neutral\" },\n ContextualHelpTrigger: {\n Button: {\n className: styles.contextualHelpTriggerButton,\n },\n },\n };\n\n return (\n <PropsContextProvider props={propsContext}>\n <div className={rootClassName}>{children}</div>\n </PropsContextProvider>\n );\n};\n\n/**\n * @flowStatus new\n * @flr-generate all\n */\nexport const Combine = flowComponent(\"Combine\", CombineImplementation, {\n type: \"layout\",\n});\n\nexport default Combine;\n"],"mappings":";;;;;;;;;;;;AAgBA,IAAa,yBAA2C,UAAU;CAChE,MAAM,EAAE,UAAU,cAAc;CAEhC,MAAM,gBAAgB,KAAK,uBAAO,SAAS,SAAS;CAEpD,MAAM,eAA6B;EACjC,MAAM,EAAE,WAAW,uBAAO,KAAK;EAC/B,QAAQ,EAAE,WAAW,uBAAO,OAAO;EACnC,QAAQ;GAAE,WAAW,uBAAO;GAAQ,MAAM;EAAI;EAC9C,YAAY;GAAE,MAAM;GAAK,WAAW,uBAAO;EAAW;EACtD,MAAM;GAAE,MAAM;GAAK,WAAW,uBAAO;GAAM,OAAO;EAAU;EAC5D,uBAAuB,EACrB,QAAQ,EACN,WAAW,uBAAO,4BACpB,EACF;CACF;CAEA,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAC3B,UAAA,oBAAC,OAAD;GAAK,WAAW;GAAgB;EAAc,CAAA;CAC1B,CAAA;AAE1B;;;;;AAMA,IAAa,UAAU,cAAc,WAAW,uBAAuB,EACrE,MAAM,SACR,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
//#region src/components/Combine/Combine.module.scss
|
|
4
|
+
var combine = "flow--combine";
|
|
5
|
+
var avatar = "flow--combine--avatar";
|
|
6
|
+
var text = "flow--combine--text";
|
|
7
|
+
var button = "flow--combine--button";
|
|
8
|
+
var contextualHelpTriggerButton = "flow--combine--contextual-help-trigger-button";
|
|
9
|
+
var copyButton = "flow--combine--copy-button";
|
|
10
|
+
var icon = "flow--combine--icon";
|
|
11
|
+
var Combine_module_default = {
|
|
12
|
+
combine,
|
|
13
|
+
avatar,
|
|
14
|
+
text,
|
|
15
|
+
button,
|
|
16
|
+
contextualHelpTriggerButton,
|
|
17
|
+
copyButton,
|
|
18
|
+
icon
|
|
19
|
+
};
|
|
20
|
+
//#endregion
|
|
21
|
+
export { avatar, button, combine, contextualHelpTriggerButton, copyButton, Combine_module_default as default, icon, text };
|
|
22
|
+
|
|
23
|
+
//# sourceMappingURL=Combine.module.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Combine.module.mjs","names":[],"sources":["../../../../../../../src/components/Combine/Combine.module.scss"],"sourcesContent":[".combine {\n &:has(.avatar):has(.text) {\n display: flex;\n gap: var(--combine--avatar-text--spacing);\n height: fit-content;\n\n --first-two-lines-height: calc(var(--line-height-s) * 2);\n\n min-height: var(--first-two-lines-height);\n\n .text {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n align-self: center;\n font-size: var(--font-size-text--s);\n }\n\n .avatar {\n margin-top: calc(\n (var(--first-two-lines-height) - var(--avatar--size--m)) / 2\n );\n }\n }\n\n &:has(:global(.flow--form-field)):has(.button) {\n display: flex;\n align-items: flex-start;\n column-gap: var(--combine--input-button--spacing);\n\n :global(.flow--form-field) {\n flex-grow: 1;\n }\n\n &:has(label) {\n .button {\n margin-top: calc(var(--line-height-s) + var(--form-control--spacing-y));\n }\n }\n }\n\n &:has(.text):has(.contextualHelpTriggerButton),\n &:has(.text):has(.copyButton) {\n display: flex;\n align-items: center;\n column-gap: var(--combine--text-button--spacing);\n }\n\n &:has(> .text):has(> .icon) {\n display: flex;\n align-items: center;\n column-gap: var(--combine--icon-text--spacing);\n }\n}\n\n@media (max-width: 550px) {\n .combine:has(:global(.flow--form-field)):has(.button) {\n flex-direction: column;\n row-gap: var(--section--spacing);\n align-items: stretch;\n\n .button {\n width: 100%;\n }\n\n &:has(label) {\n .button {\n margin-top: 0;\n }\n }\n }\n}\n"],"mappings":""}
|
|
@@ -20,6 +20,11 @@ var Message = flowComponent("Message", (props) => {
|
|
|
20
20
|
const rootClassName = clsx(Message_module_default.message, Message_module_default[type], className);
|
|
21
21
|
const style = color ? { "--message-background": color } : void 0;
|
|
22
22
|
const formatter = useLocalizedStringFormatter(__locale_default, "Message");
|
|
23
|
+
const senderContext = {
|
|
24
|
+
wrapWith: /* @__PURE__ */ jsx(ClearPropsContext, {}),
|
|
25
|
+
className: Message_module_default.user,
|
|
26
|
+
Avatar: { Initials: { "aria-hidden": true } }
|
|
27
|
+
};
|
|
23
28
|
const propsContext = {
|
|
24
29
|
Content: {
|
|
25
30
|
className: Message_module_default.content,
|
|
@@ -54,11 +59,8 @@ var Message = flowComponent("Message", (props) => {
|
|
|
54
59
|
"aria-label": formatter.format("options")
|
|
55
60
|
} },
|
|
56
61
|
Text: { className: Message_module_default.date },
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
className: Message_module_default.user,
|
|
60
|
-
Avatar: { Initials: { "aria-hidden": true } }
|
|
61
|
-
},
|
|
62
|
+
Combine: senderContext,
|
|
63
|
+
Align: senderContext,
|
|
62
64
|
children: dynamic((props) => /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Aria.VisuallyHidden, { children: formatter.format("headerLabel") }), props.children] }))
|
|
63
65
|
},
|
|
64
66
|
Button: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Message.mjs","names":[],"sources":["../../../../../../../src/components/Message/Message.tsx"],"sourcesContent":["import { type CSSProperties, type PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./Message.module.scss\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport { IconContextMenu } from \"@/components/Icon/components/icons\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport ClearPropsContext from \"@/lib/propsContext/components/ClearPropsContext\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider\";\nimport * as Aria from \"react-aria-components\";\n\nexport interface MessageProps\n extends\n PropsWithChildren,\n PropsWithClassName,\n FlowComponentProps,\n PropsWithElementType<\"article\" | \"li\"> {\n /** Determines the color and orientation of the message. @default \"responder\" */\n type?: \"responder\" | \"sender\";\n /** A custom background color of the message as a CSS color value. */\n color?: string;\n}\n\n/** @flr-generate all */\nexport const Message = flowComponent(\"Message\", (props) => {\n const {\n type = \"responder\",\n children,\n className,\n color,\n elementType = \"article\",\n } = props;\n\n const Element = elementType;\n\n const rootClassName = clsx(styles.message, styles[type], className);\n\n const style = color\n ? ({ \"--message-background\": color } as CSSProperties)\n : undefined;\n\n const formatter = useLocalizedStringFormatter(locales, \"Message\");\n\n const propsContext: PropsContext = {\n Content: {\n className: styles.content,\n children: dynamic((props) => {\n return (\n <>\n <div className={styles.tipBorder} aria-hidden />\n <div className={styles.tip} aria-hidden />\n {props.children}\n </>\n );\n }),\n },\n Header: {\n className: styles.header,\n Button: {\n className: styles.headerAction,\n size: \"s\",\n variant: \"plain\",\n color: \"secondary\",\n },\n ContextMenuTrigger: {\n Button: {\n className: styles.headerAction,\n size: \"s\",\n variant: \"plain\",\n color: \"secondary\",\n children: <IconContextMenu />,\n \"aria-label\": formatter.format(\"options\"),\n },\n },\n Text: { className: styles.date },\n
|
|
1
|
+
{"version":3,"file":"Message.mjs","names":[],"sources":["../../../../../../../src/components/Message/Message.tsx"],"sourcesContent":["import { type CSSProperties, type PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./Message.module.scss\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport {\n dynamic,\n type PropsContext,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport { IconContextMenu } from \"@/components/Icon/components/icons\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport ClearPropsContext from \"@/lib/propsContext/components/ClearPropsContext\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider\";\nimport * as Aria from \"react-aria-components\";\n\nexport interface MessageProps\n extends\n PropsWithChildren,\n PropsWithClassName,\n FlowComponentProps,\n PropsWithElementType<\"article\" | \"li\"> {\n /** Determines the color and orientation of the message. @default \"responder\" */\n type?: \"responder\" | \"sender\";\n /** A custom background color of the message as a CSS color value. */\n color?: string;\n}\n\n/** @flr-generate all */\nexport const Message = flowComponent(\"Message\", (props) => {\n const {\n type = \"responder\",\n children,\n className,\n color,\n elementType = \"article\",\n } = props;\n\n const Element = elementType;\n\n const rootClassName = clsx(styles.message, styles[type], className);\n\n const style = color\n ? ({ \"--message-background\": color } as CSSProperties)\n : undefined;\n\n const formatter = useLocalizedStringFormatter(locales, \"Message\");\n\n const senderContext: PropsContext[\"Combine\"] = {\n wrapWith: <ClearPropsContext />,\n className: styles.user,\n Avatar: { Initials: { \"aria-hidden\": true } },\n };\n\n const propsContext: PropsContext = {\n Content: {\n className: styles.content,\n children: dynamic((props) => {\n return (\n <>\n <div className={styles.tipBorder} aria-hidden />\n <div className={styles.tip} aria-hidden />\n {props.children}\n </>\n );\n }),\n },\n Header: {\n className: styles.header,\n Button: {\n className: styles.headerAction,\n size: \"s\",\n variant: \"plain\",\n color: \"secondary\",\n },\n ContextMenuTrigger: {\n Button: {\n className: styles.headerAction,\n size: \"s\",\n variant: \"plain\",\n color: \"secondary\",\n children: <IconContextMenu />,\n \"aria-label\": formatter.format(\"options\"),\n },\n },\n Text: { className: styles.date },\n Combine: senderContext,\n // Deprecated alias of Combine — keep it arranged the same way.\n Align: senderContext,\n children: dynamic((props) => (\n <>\n <Aria.VisuallyHidden>\n {formatter.format(\"headerLabel\")}\n </Aria.VisuallyHidden>\n {props.children}\n </>\n )),\n },\n\n Button: {\n size: \"s\",\n className: styles.action,\n },\n ActionGroup: {\n preserveOrder: true,\n size: \"s\",\n className: styles.actionGroup,\n Button: {\n className: styles.actionGroupAction,\n },\n },\n };\n\n return (\n <PropsContextProvider props={propsContext}>\n <Element className={rootClassName} style={style}>\n {children}\n </Element>\n </PropsContextProvider>\n );\n});\n\nexport default Message;\n"],"mappings":";;;;;;;;;;;;;;;;AAmCA,IAAa,UAAU,cAAc,YAAY,UAAU;CACzD,MAAM,EACJ,OAAO,aACP,UACA,WACA,OACA,cAAc,cACZ;CAEJ,MAAM,UAAU;CAEhB,MAAM,gBAAgB,KAAK,uBAAO,SAAS,uBAAO,OAAO,SAAS;CAElE,MAAM,QAAQ,QACT,EAAE,wBAAwB,MAAM,IACjC,KAAA;CAEJ,MAAM,YAAY,4BAA4B,kBAAS,SAAS;CAEhE,MAAM,gBAAyC;EAC7C,UAAU,oBAAC,mBAAD,CAAoB,CAAA;EAC9B,WAAW,uBAAO;EAClB,QAAQ,EAAE,UAAU,EAAE,eAAe,KAAK,EAAE;CAC9C;CAEA,MAAM,eAA6B;EACjC,SAAS;GACP,WAAW,uBAAO;GAClB,UAAU,SAAS,UAAU;IAC3B,OACE,qBAAA,YAAA,EAAA,UAAA;KACE,oBAAC,OAAD;MAAK,WAAW,uBAAO;MAAW,eAAA;KAAa,CAAA;KAC/C,oBAAC,OAAD;MAAK,WAAW,uBAAO;MAAK,eAAA;KAAa,CAAA;KACxC,MAAM;IACP,EAAA,CAAA;GAEN,CAAC;EACH;EACA,QAAQ;GACN,WAAW,uBAAO;GAClB,QAAQ;IACN,WAAW,uBAAO;IAClB,MAAM;IACN,SAAS;IACT,OAAO;GACT;GACA,oBAAoB,EAClB,QAAQ;IACN,WAAW,uBAAO;IAClB,MAAM;IACN,SAAS;IACT,OAAO;IACP,UAAU,oBAAC,iBAAD,CAAkB,CAAA;IAC5B,cAAc,UAAU,OAAO,SAAS;GAC1C,EACF;GACA,MAAM,EAAE,WAAW,uBAAO,KAAK;GAC/B,SAAS;GAET,OAAO;GACP,UAAU,SAAS,UACjB,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,KAAK,gBAAN,EAAA,UACG,UAAU,OAAO,aAAa,EACZ,CAAA,GACpB,MAAM,QACP,EAAA,CAAA,CACH;EACH;EAEA,QAAQ;GACN,MAAM;GACN,WAAW,uBAAO;EACpB;EACA,aAAa;GACX,eAAe;GACf,MAAM;GACN,WAAW,uBAAO;GAClB,QAAQ,EACN,WAAW,uBAAO,kBACpB;EACF;CACF;CAEA,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAC3B,UAAA,oBAAC,SAAD;GAAS,WAAW;GAAsB;GACvC;EACM,CAAA;CACW,CAAA;AAE1B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../../src/components/propTypes/index.ts"],"sourcesContent":["import type { TextProps } from \"@/components/Text\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport type { IconProps } from \"@/components/Icon\";\nimport type { LabelProps } from \"@/components/Label\";\nimport type { ContentProps } from \"@/components/Content\";\nimport type { LayoutCardProps } from \"@/components/LayoutCard\";\nimport type { LinkProps } from \"@/components/Link\";\nimport type { LightBoxProps } from \"@/components/LightBox\";\nimport type { FieldErrorProps } from \"@/components/FieldError\";\nimport type { FieldDescriptionProps } from \"@/components/FieldDescription\";\nimport type { AlertProps } from \"@/components/Alert\";\nimport type { HeadingProps } from \"@/components/Heading\";\nimport type { TabNavigationProps } from \"@/components/TabNavigation\";\nimport type { InitialsProps } from \"@/components/Initials\";\nimport type { ImageProps } from \"@/components/Image\";\nimport type { CopyButtonProps } from \"@/components/CopyButton\";\nimport type { HeaderProps } from \"@/components/Header/\";\nimport type { SwitchProps } from \"@/components/Switch\";\nimport type { AlertBadgeProps } from \"@/components/AlertBadge\";\nimport type { ActionGroupProps } from \"@/components/ActionGroup\";\nimport type { AvatarProps } from \"@/components/Avatar\";\nimport type { ActionProps } from \"@/components/Action\";\nimport type {\n ContextMenuProps,\n ContextMenuTriggerProps,\n MenuItemProps,\n} from \"@/components/ContextMenu\";\nimport type { SelectProps } from \"@/components/Select\";\nimport type {\n RadioButtonProps,\n RadioGroupProps,\n RadioProps,\n} from \"@/components/RadioGroup\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport type { NumberFieldProps } from \"@/components/NumberField\";\nimport type { TextAreaProps } from \"@/components/TextArea\";\nimport type { CheckboxGroupProps } from \"@/components/CheckboxGroup\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport type { CheckboxButtonProps } from \"@/components/CheckboxButton\";\nimport type { TabsProps } from \"@/components/Tabs\";\nimport type { ModalProps, ModalTriggerProps } from \"@/components/Modal\";\nimport type { SectionProps } from \"@/components/Section\";\nimport type { SliderProps } from \"@/components/Slider\";\nimport type { CounterBadgeProps } from \"@/components/CounterBadge\";\nimport type { FlowComponentName } from \"@/components/propTypes/types\";\nimport type {\n ContextualHelpProps,\n ContextualHelpTriggerProps,\n} from \"@/components/ContextualHelp\";\nimport type { PopoverProps, PopoverTriggerProps } from \"@/components/Popover\";\nimport type { ContextMenuSectionProps } from \"@/components/ContextMenu/components/ContextMenuSection\";\nimport type { ListItemViewContentProps, ListProps } from \"@/components/List\";\nimport type { PasswordCreationFieldProps } from \"@/components/PasswordCreationField\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { BadgeProps } from \"@/components/Badge\";\nimport type { DatePickerProps } from \"@/components/DatePicker\";\nimport type * as Aria from \"react-aria-components\";\nimport type { DateRangePickerProps } from \"@/components/DateRangePicker\";\nimport type { TimeFieldProps } from \"@/components/TimeField\";\nimport type { AlertIconProps } from \"@/components/AlertIcon\";\nimport type { ListSummaryProps } from \"@/components/List/components/ListSummary/ListSummary\";\nimport type { SegmentedControlProps } from \"@/components/SegmentedControl\";\nimport type { SegmentProps } from \"@/components/SegmentedControl/components/Segment\";\nimport type { FileCardProps } from \"@/components/FileCard\";\nimport type { FileFieldProps } from \"@/components/FileField\";\nimport type { AlignProps } from \"@/components/Align\";\nimport type { CountryOptionsProps } from \"@/components/CountryOptions\";\nimport type { ComboBoxProps } from \"@/components/ComboBox\";\nimport type { OptionProps } from \"@/components/Option\";\nimport type { MessageProps } from \"@/components/Message\";\nimport type { MessageThreadProps } from \"@/components/MessageThread\";\nimport type { FileCardListProps } from \"@/components/FileCardList\";\nimport type { AccentBoxProps } from \"@/components/AccentBox\";\nimport type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport type { MenuTriggerProps } from \"@/components/OverlayTrigger\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport type { FileDropZoneProps } from \"@/components/FileDropZone\";\nimport type { NavigationProps } from \"@/components/Navigation\";\nimport type { NavigationGroupProps } from \"@/components/Navigation/components/NavigationGroup\";\nimport type { AutocompleteProps } from \"@/components/Autocomplete/Autocomplete\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport type { MarkdownEditorProps } from \"@/components/MarkdownEditor\";\nimport type { AlertTextProps } from \"@/components/AlertText\";\nimport type { IllustratedMessageProps } from \"@/components/IllustratedMessage\";\nimport type { RatingProps } from \"@/components/Rating\";\nimport type { CodeEditorProps } from \"@/components/CodeEditor\";\nimport type { KbdProps } from \"@/components/Kbd/Kbd\";\nimport type { AccordionProps } from \"@/components/Accordion\";\nimport type { ChatProps } from \"@/components/Chat\";\nimport type { SectionHeaderProps } from \"@/components/Section/components/SectionHeader/SectionHeader\";\nimport type {\n LightBoxGalleryItemProps,\n LightBoxGalleryProps,\n} from \"@/components/LightBox\";\n\nexport * from \"./types\";\n\nexport interface FlowComponentPropsTypes {\n AccentBox: AccentBoxProps;\n Action: ActionProps;\n ActionGroup: ActionGroupProps;\n Accordion: AccordionProps;\n Alert: AlertProps;\n AlertBadge: AlertBadgeProps;\n AlertIcon: AlertIconProps;\n AlertText: AlertTextProps;\n Align: AlignProps;\n Avatar: AvatarProps;\n Autocomplete: AutocompleteProps;\n Badge: BadgeProps;\n Button: ButtonProps;\n CodeEditor: CodeEditorProps;\n Chat: ChatProps;\n Checkbox: CheckboxProps;\n CheckboxButton: CheckboxButtonProps;\n CheckboxGroup: CheckboxGroupProps;\n ColumnLayout: ColumnLayoutProps;\n ComboBox: ComboBoxProps;\n Content: ContentProps;\n ContextMenu: ContextMenuProps;\n ContextMenuSection: ContextMenuSectionProps;\n ContextMenuTrigger: ContextMenuTriggerProps;\n ContextualHelp: ContextualHelpProps;\n ContextualHelpTrigger: ContextualHelpTriggerProps;\n CopyButton: CopyButtonProps;\n CounterBadge: CounterBadgeProps;\n CountryOptions: CountryOptionsProps;\n DatePicker: DatePickerProps<Aria.DateValue>;\n DateRangePicker: DateRangePickerProps<Aria.DateValue>;\n FieldDescription: FieldDescriptionProps;\n FieldError: FieldErrorProps;\n FileCard: FileCardProps;\n FileCardList: FileCardListProps;\n FileField: FileFieldProps;\n FileDropZone: FileDropZoneProps;\n Header: HeaderProps;\n Heading: HeadingProps;\n TabNavigation: TabNavigationProps;\n Icon: IconProps;\n IllustratedMessage: IllustratedMessageProps;\n Image: ImageProps;\n Initials: InitialsProps;\n Label: LabelProps;\n LayoutCard: LayoutCardProps;\n LightBox: LightBoxProps;\n LightBoxGallery: LightBoxGalleryProps;\n LightBoxGalleryItem: LightBoxGalleryItemProps;\n Link: LinkProps;\n List: ListProps<never>;\n ListItemView: ListItemViewContentProps;\n ListSummary: ListSummaryProps;\n MarkdownEditor: MarkdownEditorProps;\n MenuItem: MenuItemProps;\n MenuTrigger: MenuTriggerProps;\n Message: MessageProps;\n MessageThread: MessageThreadProps;\n Modal: ModalProps;\n ModalTrigger: ModalTriggerProps;\n Navigation: NavigationProps;\n NavigationGroup: NavigationGroupProps;\n NumberField: NumberFieldProps;\n Option: OptionProps;\n Options: OptionsProps;\n Popover: PopoverProps;\n PopoverTrigger: PopoverTriggerProps;\n PasswordCreationField: PasswordCreationFieldProps;\n ProgressBar: ProgressBarProps;\n Radio: RadioProps;\n RadioButton: RadioButtonProps;\n RadioGroup: RadioGroupProps;\n Rating: RatingProps;\n SearchField: SearchFieldProps;\n Section: SectionProps;\n Segment: SegmentProps;\n SegmentedControl: SegmentedControlProps;\n Select: SelectProps;\n Kbd: KbdProps;\n SectionHeader: SectionHeaderProps;\n Slider: SliderProps;\n Switch: SwitchProps;\n Tabs: TabsProps;\n TabTitle: TabsProps;\n Text: TextProps;\n TextArea: TextAreaProps;\n TextField: TextFieldProps;\n TimeField: TimeFieldProps;\n}\n\nconst propsContextSupportingComponentsMap: Record<\n keyof FlowComponentPropsTypes,\n true\n> = {\n AccentBox: true,\n Action: true,\n ActionGroup: true,\n Accordion: true,\n Avatar: true,\n Autocomplete: true,\n Alert: true,\n AlertBadge: true,\n AlertIcon: true,\n AlertText: true,\n Align: true,\n Badge: true,\n Button: true,\n CodeEditor: true,\n Chat: true,\n Checkbox: true,\n CheckboxButton: true,\n CheckboxGroup: true,\n ColumnLayout: true,\n ComboBox: true,\n Content: true,\n ContextMenu: true,\n ContextMenuSection: true,\n ContextMenuTrigger: true,\n ContextualHelp: true,\n ContextualHelpTrigger: true,\n CopyButton: true,\n CounterBadge: true,\n CountryOptions: true,\n DatePicker: true,\n DateRangePicker: true,\n FieldDescription: true,\n FieldError: true,\n FileCard: true,\n FileCardList: true,\n FileField: true,\n FileDropZone: true,\n Header: true,\n Heading: true,\n TabNavigation: true,\n Icon: true,\n IllustratedMessage: true,\n Image: true,\n Initials: true,\n Kbd: true,\n Label: true,\n LayoutCard: true,\n LightBox: true,\n LightBoxGallery: true,\n LightBoxGalleryItem: true,\n Link: true,\n List: true,\n ListItemView: true,\n ListSummary: true,\n MarkdownEditor: true,\n MenuItem: true,\n MenuTrigger: true,\n Message: true,\n MessageThread: true,\n Modal: true,\n ModalTrigger: true,\n Navigation: true,\n NavigationGroup: true,\n NumberField: true,\n Radio: true,\n Option: true,\n Options: true,\n Popover: true,\n PopoverTrigger: true,\n PasswordCreationField: true,\n ProgressBar: true,\n RadioButton: true,\n RadioGroup: true,\n Rating: true,\n SearchField: true,\n Section: true,\n SectionHeader: true,\n Segment: true,\n SegmentedControl: true,\n Select: true,\n Slider: true,\n Switch: true,\n Tabs: true,\n TabTitle: true,\n TestComponent: true,\n Text: true,\n TextArea: true,\n TextField: true,\n TimeField: true,\n};\n\nexport const propsContextSupportingComponents = Object.keys(\n propsContextSupportingComponentsMap,\n) as FlowComponentName[];\n"],"mappings":";AA2RA,IAAa,mCAAmC,OAAO,KACrD;CA5FA,WAAW;CACX,QAAQ;CACR,aAAa;CACb,WAAW;CACX,QAAQ;CACR,cAAc;CACd,OAAO;CACP,YAAY;CACZ,WAAW;CACX,WAAW;CACX,OAAO;CACP,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,gBAAgB;CAChB,eAAe;CACf,cAAc;CACd,UAAU;CACV,SAAS;CACT,aAAa;CACb,oBAAoB;CACpB,oBAAoB;CACpB,gBAAgB;CAChB,uBAAuB;CACvB,YAAY;CACZ,cAAc;CACd,gBAAgB;CAChB,YAAY;CACZ,iBAAiB;CACjB,kBAAkB;CAClB,YAAY;CACZ,UAAU;CACV,cAAc;CACd,WAAW;CACX,cAAc;CACd,QAAQ;CACR,SAAS;CACT,eAAe;CACf,MAAM;CACN,oBAAoB;CACpB,OAAO;CACP,UAAU;CACV,KAAK;CACL,OAAO;CACP,YAAY;CACZ,UAAU;CACV,iBAAiB;CACjB,qBAAqB;CACrB,MAAM;CACN,MAAM;CACN,cAAc;CACd,aAAa;CACb,gBAAgB;CAChB,UAAU;CACV,aAAa;CACb,SAAS;CACT,eAAe;CACf,OAAO;CACP,cAAc;CACd,YAAY;CACZ,iBAAiB;CACjB,aAAa;CACb,OAAO;CACP,QAAQ;CACR,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,uBAAuB;CACvB,aAAa;CACb,aAAa;CACb,YAAY;CACZ,QAAQ;CACR,aAAa;CACb,SAAS;CACT,eAAe;CACf,SAAS;CACT,kBAAkB;CAClB,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,MAAM;CACN,UAAU;CACV,eAAe;CACf,MAAM;CACN,UAAU;CACV,WAAW;CACX,WAAW;AAIX,CACF"}
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../../../src/components/propTypes/index.ts"],"sourcesContent":["import type { TextProps } from \"@/components/Text\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport type { IconProps } from \"@/components/Icon\";\nimport type { LabelProps } from \"@/components/Label\";\nimport type { ContentProps } from \"@/components/Content\";\nimport type { LayoutCardProps } from \"@/components/LayoutCard\";\nimport type { LinkProps } from \"@/components/Link\";\nimport type { LightBoxProps } from \"@/components/LightBox\";\nimport type { FieldErrorProps } from \"@/components/FieldError\";\nimport type { FieldDescriptionProps } from \"@/components/FieldDescription\";\nimport type { AlertProps } from \"@/components/Alert\";\nimport type { HeadingProps } from \"@/components/Heading\";\nimport type { TabNavigationProps } from \"@/components/TabNavigation\";\nimport type { InitialsProps } from \"@/components/Initials\";\nimport type { ImageProps } from \"@/components/Image\";\nimport type { CopyButtonProps } from \"@/components/CopyButton\";\nimport type { HeaderProps } from \"@/components/Header/\";\nimport type { SwitchProps } from \"@/components/Switch\";\nimport type { AlertBadgeProps } from \"@/components/AlertBadge\";\nimport type { ActionGroupProps } from \"@/components/ActionGroup\";\nimport type { AvatarProps } from \"@/components/Avatar\";\nimport type { ActionProps } from \"@/components/Action\";\nimport type {\n ContextMenuProps,\n ContextMenuTriggerProps,\n MenuItemProps,\n} from \"@/components/ContextMenu\";\nimport type { SelectProps } from \"@/components/Select\";\nimport type {\n RadioButtonProps,\n RadioGroupProps,\n RadioProps,\n} from \"@/components/RadioGroup\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport type { NumberFieldProps } from \"@/components/NumberField\";\nimport type { TextAreaProps } from \"@/components/TextArea\";\nimport type { CheckboxGroupProps } from \"@/components/CheckboxGroup\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport type { CheckboxButtonProps } from \"@/components/CheckboxButton\";\nimport type { TabsProps } from \"@/components/Tabs\";\nimport type { ModalProps, ModalTriggerProps } from \"@/components/Modal\";\nimport type { SectionProps } from \"@/components/Section\";\nimport type { SliderProps } from \"@/components/Slider\";\nimport type { CounterBadgeProps } from \"@/components/CounterBadge\";\nimport type { FlowComponentName } from \"@/components/propTypes/types\";\nimport type {\n ContextualHelpProps,\n ContextualHelpTriggerProps,\n} from \"@/components/ContextualHelp\";\nimport type { PopoverProps, PopoverTriggerProps } from \"@/components/Popover\";\nimport type { ContextMenuSectionProps } from \"@/components/ContextMenu/components/ContextMenuSection\";\nimport type { ListItemViewContentProps, ListProps } from \"@/components/List\";\nimport type { PasswordCreationFieldProps } from \"@/components/PasswordCreationField\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { BadgeProps } from \"@/components/Badge\";\nimport type { DatePickerProps } from \"@/components/DatePicker\";\nimport type * as Aria from \"react-aria-components\";\nimport type { DateRangePickerProps } from \"@/components/DateRangePicker\";\nimport type { TimeFieldProps } from \"@/components/TimeField\";\nimport type { AlertIconProps } from \"@/components/AlertIcon\";\nimport type { ListSummaryProps } from \"@/components/List/components/ListSummary/ListSummary\";\nimport type { SegmentedControlProps } from \"@/components/SegmentedControl\";\nimport type { SegmentProps } from \"@/components/SegmentedControl/components/Segment\";\nimport type { FileCardProps } from \"@/components/FileCard\";\nimport type { FileFieldProps } from \"@/components/FileField\";\nimport type { AlignProps } from \"@/components/Align\";\nimport type { CombineProps } from \"@/components/Combine\";\nimport type { CountryOptionsProps } from \"@/components/CountryOptions\";\nimport type { ComboBoxProps } from \"@/components/ComboBox\";\nimport type { OptionProps } from \"@/components/Option\";\nimport type { MessageProps } from \"@/components/Message\";\nimport type { MessageThreadProps } from \"@/components/MessageThread\";\nimport type { FileCardListProps } from \"@/components/FileCardList\";\nimport type { AccentBoxProps } from \"@/components/AccentBox\";\nimport type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport type { MenuTriggerProps } from \"@/components/OverlayTrigger\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport type { FileDropZoneProps } from \"@/components/FileDropZone\";\nimport type { NavigationProps } from \"@/components/Navigation\";\nimport type { NavigationGroupProps } from \"@/components/Navigation/components/NavigationGroup\";\nimport type { AutocompleteProps } from \"@/components/Autocomplete/Autocomplete\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport type { MarkdownEditorProps } from \"@/components/MarkdownEditor\";\nimport type { AlertTextProps } from \"@/components/AlertText\";\nimport type { IllustratedMessageProps } from \"@/components/IllustratedMessage\";\nimport type { RatingProps } from \"@/components/Rating\";\nimport type { CodeEditorProps } from \"@/components/CodeEditor\";\nimport type { KbdProps } from \"@/components/Kbd/Kbd\";\nimport type { AccordionProps } from \"@/components/Accordion\";\nimport type { ChatProps } from \"@/components/Chat\";\nimport type { SectionHeaderProps } from \"@/components/Section/components/SectionHeader/SectionHeader\";\nimport type {\n LightBoxGalleryItemProps,\n LightBoxGalleryProps,\n} from \"@/components/LightBox\";\n\nexport * from \"./types\";\n\nexport interface FlowComponentPropsTypes {\n AccentBox: AccentBoxProps;\n Action: ActionProps;\n ActionGroup: ActionGroupProps;\n Accordion: AccordionProps;\n Alert: AlertProps;\n AlertBadge: AlertBadgeProps;\n AlertIcon: AlertIconProps;\n AlertText: AlertTextProps;\n Align: AlignProps;\n Combine: CombineProps;\n Avatar: AvatarProps;\n Autocomplete: AutocompleteProps;\n Badge: BadgeProps;\n Button: ButtonProps;\n CodeEditor: CodeEditorProps;\n Chat: ChatProps;\n Checkbox: CheckboxProps;\n CheckboxButton: CheckboxButtonProps;\n CheckboxGroup: CheckboxGroupProps;\n ColumnLayout: ColumnLayoutProps;\n ComboBox: ComboBoxProps;\n Content: ContentProps;\n ContextMenu: ContextMenuProps;\n ContextMenuSection: ContextMenuSectionProps;\n ContextMenuTrigger: ContextMenuTriggerProps;\n ContextualHelp: ContextualHelpProps;\n ContextualHelpTrigger: ContextualHelpTriggerProps;\n CopyButton: CopyButtonProps;\n CounterBadge: CounterBadgeProps;\n CountryOptions: CountryOptionsProps;\n DatePicker: DatePickerProps<Aria.DateValue>;\n DateRangePicker: DateRangePickerProps<Aria.DateValue>;\n FieldDescription: FieldDescriptionProps;\n FieldError: FieldErrorProps;\n FileCard: FileCardProps;\n FileCardList: FileCardListProps;\n FileField: FileFieldProps;\n FileDropZone: FileDropZoneProps;\n Header: HeaderProps;\n Heading: HeadingProps;\n TabNavigation: TabNavigationProps;\n Icon: IconProps;\n IllustratedMessage: IllustratedMessageProps;\n Image: ImageProps;\n Initials: InitialsProps;\n Label: LabelProps;\n LayoutCard: LayoutCardProps;\n LightBox: LightBoxProps;\n LightBoxGallery: LightBoxGalleryProps;\n LightBoxGalleryItem: LightBoxGalleryItemProps;\n Link: LinkProps;\n List: ListProps<never>;\n ListItemView: ListItemViewContentProps;\n ListSummary: ListSummaryProps;\n MarkdownEditor: MarkdownEditorProps;\n MenuItem: MenuItemProps;\n MenuTrigger: MenuTriggerProps;\n Message: MessageProps;\n MessageThread: MessageThreadProps;\n Modal: ModalProps;\n ModalTrigger: ModalTriggerProps;\n Navigation: NavigationProps;\n NavigationGroup: NavigationGroupProps;\n NumberField: NumberFieldProps;\n Option: OptionProps;\n Options: OptionsProps;\n Popover: PopoverProps;\n PopoverTrigger: PopoverTriggerProps;\n PasswordCreationField: PasswordCreationFieldProps;\n ProgressBar: ProgressBarProps;\n Radio: RadioProps;\n RadioButton: RadioButtonProps;\n RadioGroup: RadioGroupProps;\n Rating: RatingProps;\n SearchField: SearchFieldProps;\n Section: SectionProps;\n Segment: SegmentProps;\n SegmentedControl: SegmentedControlProps;\n Select: SelectProps;\n Kbd: KbdProps;\n SectionHeader: SectionHeaderProps;\n Slider: SliderProps;\n Switch: SwitchProps;\n Tabs: TabsProps;\n TabTitle: TabsProps;\n Text: TextProps;\n TextArea: TextAreaProps;\n TextField: TextFieldProps;\n TimeField: TimeFieldProps;\n}\n\nconst propsContextSupportingComponentsMap: Record<\n keyof FlowComponentPropsTypes,\n true\n> = {\n AccentBox: true,\n Action: true,\n ActionGroup: true,\n Accordion: true,\n Avatar: true,\n Autocomplete: true,\n Alert: true,\n AlertBadge: true,\n AlertIcon: true,\n AlertText: true,\n Align: true,\n Combine: true,\n Badge: true,\n Button: true,\n CodeEditor: true,\n Chat: true,\n Checkbox: true,\n CheckboxButton: true,\n CheckboxGroup: true,\n ColumnLayout: true,\n ComboBox: true,\n Content: true,\n ContextMenu: true,\n ContextMenuSection: true,\n ContextMenuTrigger: true,\n ContextualHelp: true,\n ContextualHelpTrigger: true,\n CopyButton: true,\n CounterBadge: true,\n CountryOptions: true,\n DatePicker: true,\n DateRangePicker: true,\n FieldDescription: true,\n FieldError: true,\n FileCard: true,\n FileCardList: true,\n FileField: true,\n FileDropZone: true,\n Header: true,\n Heading: true,\n TabNavigation: true,\n Icon: true,\n IllustratedMessage: true,\n Image: true,\n Initials: true,\n Kbd: true,\n Label: true,\n LayoutCard: true,\n LightBox: true,\n LightBoxGallery: true,\n LightBoxGalleryItem: true,\n Link: true,\n List: true,\n ListItemView: true,\n ListSummary: true,\n MarkdownEditor: true,\n MenuItem: true,\n MenuTrigger: true,\n Message: true,\n MessageThread: true,\n Modal: true,\n ModalTrigger: true,\n Navigation: true,\n NavigationGroup: true,\n NumberField: true,\n Radio: true,\n Option: true,\n Options: true,\n Popover: true,\n PopoverTrigger: true,\n PasswordCreationField: true,\n ProgressBar: true,\n RadioButton: true,\n RadioGroup: true,\n Rating: true,\n SearchField: true,\n Section: true,\n SectionHeader: true,\n Segment: true,\n SegmentedControl: true,\n Select: true,\n Slider: true,\n Switch: true,\n Tabs: true,\n TabTitle: true,\n TestComponent: true,\n Text: true,\n TextArea: true,\n TextField: true,\n TimeField: true,\n};\n\nexport const propsContextSupportingComponents = Object.keys(\n propsContextSupportingComponentsMap,\n) as FlowComponentName[];\n"],"mappings":";AA8RA,IAAa,mCAAmC,OAAO,KACrD;CA7FA,WAAW;CACX,QAAQ;CACR,aAAa;CACb,WAAW;CACX,QAAQ;CACR,cAAc;CACd,OAAO;CACP,YAAY;CACZ,WAAW;CACX,WAAW;CACX,OAAO;CACP,SAAS;CACT,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,gBAAgB;CAChB,eAAe;CACf,cAAc;CACd,UAAU;CACV,SAAS;CACT,aAAa;CACb,oBAAoB;CACpB,oBAAoB;CACpB,gBAAgB;CAChB,uBAAuB;CACvB,YAAY;CACZ,cAAc;CACd,gBAAgB;CAChB,YAAY;CACZ,iBAAiB;CACjB,kBAAkB;CAClB,YAAY;CACZ,UAAU;CACV,cAAc;CACd,WAAW;CACX,cAAc;CACd,QAAQ;CACR,SAAS;CACT,eAAe;CACf,MAAM;CACN,oBAAoB;CACpB,OAAO;CACP,UAAU;CACV,KAAK;CACL,OAAO;CACP,YAAY;CACZ,UAAU;CACV,iBAAiB;CACjB,qBAAqB;CACrB,MAAM;CACN,MAAM;CACN,cAAc;CACd,aAAa;CACb,gBAAgB;CAChB,UAAU;CACV,aAAa;CACb,SAAS;CACT,eAAe;CACf,OAAO;CACP,cAAc;CACd,YAAY;CACZ,iBAAiB;CACjB,aAAa;CACb,OAAO;CACP,QAAQ;CACR,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,uBAAuB;CACvB,aAAa;CACb,aAAa;CACb,YAAY;CACZ,QAAQ;CACR,aAAa;CACb,SAAS;CACT,eAAe;CACf,SAAS;CACT,kBAAkB;CAClB,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,MAAM;CACN,UAAU;CACV,eAAe;CACf,MAAM;CACN,UAAU;CACV,WAAW;CACX,WAAW;AAIX,CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SubmitButton.mjs","names":[],"sources":["../../../../../../../../../src/integrations/react-hook-form/components/SubmitButton/SubmitButton.tsx"],"sourcesContent":["import type { ActionProps } from \"@/components/Action\";\nimport { type ButtonProps } from \"@/components/Button\";\nimport FormAction from \"@/integrations/react-hook-form/components/FormAction\";\nimport ButtonView from \"@/views/ButtonView\";\nimport type { FC } from \"react\";\n\ntype SupportedActionProps = Pick<ActionProps, \"showFeedback\">;\n\nexport type SubmitButtonProps = ButtonProps & SupportedActionProps;\n\nexport const SubmitButton: FC<SubmitButtonProps> = (props) => {\n const { showFeedback, ...buttonProps } = props;\n return (\n <FormAction submit showFeedback={showFeedback}>\n <ButtonView color=\"
|
|
1
|
+
{"version":3,"file":"SubmitButton.mjs","names":[],"sources":["../../../../../../../../../src/integrations/react-hook-form/components/SubmitButton/SubmitButton.tsx"],"sourcesContent":["import type { ActionProps } from \"@/components/Action\";\nimport { type ButtonProps } from \"@/components/Button\";\nimport FormAction from \"@/integrations/react-hook-form/components/FormAction\";\nimport ButtonView from \"@/views/ButtonView\";\nimport type { FC } from \"react\";\n\ntype SupportedActionProps = Pick<ActionProps, \"showFeedback\">;\n\nexport type SubmitButtonProps = ButtonProps & SupportedActionProps;\n\nexport const SubmitButton: FC<SubmitButtonProps> = (props) => {\n const { showFeedback, ...buttonProps } = props;\n return (\n <FormAction submit showFeedback={showFeedback}>\n <ButtonView color=\"success\" {...buttonProps} />\n </FormAction>\n );\n};\n\nexport default SubmitButton;\n"],"mappings":";;;;;;AAUA,IAAa,gBAAuC,UAAU;CAC5D,MAAM,EAAE,cAAc,GAAG,gBAAgB;CACzC,OACE,oBAAC,YAAD;EAAY,QAAA;EAAqB;EAC/B,UAAA,oBAAC,YAAD;GAAY,OAAM;GAAU,GAAI;EAAc,CAAA;CACpC,CAAA;AAEhB"}
|
|
@@ -39,8 +39,9 @@ var component_status_default = {
|
|
|
39
39
|
"isNew": false
|
|
40
40
|
},
|
|
41
41
|
"@mittwald/flow-react-components#Align": {
|
|
42
|
-
"level": "
|
|
43
|
-
"isNew": false
|
|
42
|
+
"level": "deprecated",
|
|
43
|
+
"isNew": false,
|
|
44
|
+
"deprecationNotice": "Use Combine instead"
|
|
44
45
|
},
|
|
45
46
|
"@mittwald/flow-react-components#Autocomplete": {
|
|
46
47
|
"level": "stable",
|
|
@@ -114,6 +115,10 @@ var component_status_default = {
|
|
|
114
115
|
"level": "stable",
|
|
115
116
|
"isNew": false
|
|
116
117
|
},
|
|
118
|
+
"@mittwald/flow-react-components#Combine": {
|
|
119
|
+
"level": "stable",
|
|
120
|
+
"isNew": true
|
|
121
|
+
},
|
|
117
122
|
"@mittwald/flow-react-components#ComboBox": {
|
|
118
123
|
"level": "stable",
|
|
119
124
|
"isNew": false
|