@ankhorage/zora 1.5.1 → 2.0.0
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/CHANGELOG.md +23 -0
- package/README.md +125 -123
- package/dist/components/app-bar/AppBar.js +4 -4
- package/dist/components/app-bar/AppBar.js.map +1 -1
- package/dist/components/avatar/Avatar.d.ts.map +1 -1
- package/dist/components/avatar/Avatar.js +19 -9
- package/dist/components/avatar/Avatar.js.map +1 -1
- package/dist/components/avatar/types.d.ts +2 -2
- package/dist/components/avatar/types.d.ts.map +1 -1
- package/dist/components/avatar/types.js.map +1 -1
- package/dist/components/avatar-group/AvatarGroup.js +2 -2
- package/dist/components/avatar-group/AvatarGroup.js.map +1 -1
- package/dist/components/avatar-group/types.d.ts +2 -2
- package/dist/components/avatar-group/types.d.ts.map +1 -1
- package/dist/components/avatar-group/types.js.map +1 -1
- package/dist/components/badge/Badge.js +3 -3
- package/dist/components/badge/Badge.js.map +1 -1
- package/dist/components/badge/types.d.ts +4 -4
- package/dist/components/badge/types.d.ts.map +1 -1
- package/dist/components/badge/types.js.map +1 -1
- package/dist/components/button/Button.js +3 -3
- package/dist/components/button/Button.js.map +1 -1
- package/dist/components/button/meta.d.ts +7 -7
- package/dist/components/button/meta.d.ts.map +1 -1
- package/dist/components/button/meta.js +8 -7
- package/dist/components/button/meta.js.map +1 -1
- package/dist/components/button/types.d.ts +4 -4
- package/dist/components/button/types.d.ts.map +1 -1
- package/dist/components/button/types.js.map +1 -1
- package/dist/components/card/Card.js +2 -2
- package/dist/components/card/Card.js.map +1 -1
- package/dist/components/checkbox/CheckboxGroup.js +5 -5
- package/dist/components/checkbox/CheckboxGroup.js.map +1 -1
- package/dist/components/checkbox/types.d.ts +1 -1
- package/dist/components/checkbox/types.d.ts.map +1 -1
- package/dist/components/checkbox/types.js.map +1 -1
- package/dist/components/chip/Chip.d.ts.map +1 -1
- package/dist/components/chip/Chip.js +9 -10
- package/dist/components/chip/Chip.js.map +1 -1
- package/dist/components/chip/resolveChipColors.d.ts +3 -3
- package/dist/components/chip/resolveChipColors.d.ts.map +1 -1
- package/dist/components/chip/resolveChipColors.js +14 -4
- package/dist/components/chip/resolveChipColors.js.map +1 -1
- package/dist/components/chip/types.d.ts +2 -2
- package/dist/components/chip/types.d.ts.map +1 -1
- package/dist/components/chip/types.js.map +1 -1
- package/dist/components/chip-group/ChipGroup.js +2 -2
- package/dist/components/chip-group/ChipGroup.js.map +1 -1
- package/dist/components/chip-group/types.d.ts +2 -2
- package/dist/components/chip-group/types.d.ts.map +1 -1
- package/dist/components/chip-group/types.js.map +1 -1
- package/dist/components/drawer/Drawer.js +1 -1
- package/dist/components/drawer/Drawer.js.map +1 -1
- package/dist/components/form/FormError.js +1 -1
- package/dist/components/form/FormError.js.map +1 -1
- package/dist/components/form/FormField.js +1 -1
- package/dist/components/form/FormField.js.map +1 -1
- package/dist/components/heading/Heading.d.ts.map +1 -1
- package/dist/components/heading/Heading.js +5 -3
- package/dist/components/heading/Heading.js.map +1 -1
- package/dist/components/heading/index.d.ts +1 -1
- package/dist/components/heading/index.d.ts.map +1 -1
- package/dist/components/heading/index.js.map +1 -1
- package/dist/components/heading/meta.d.ts +9 -3
- package/dist/components/heading/meta.d.ts.map +1 -1
- package/dist/components/heading/meta.js +10 -3
- package/dist/components/heading/meta.js.map +1 -1
- package/dist/components/heading/resolveHeadingRecipe.d.ts +4 -3
- package/dist/components/heading/resolveHeadingRecipe.d.ts.map +1 -1
- package/dist/components/heading/resolveHeadingRecipe.js +33 -12
- package/dist/components/heading/resolveHeadingRecipe.js.map +1 -1
- package/dist/components/heading/types.d.ts +5 -2
- package/dist/components/heading/types.d.ts.map +1 -1
- package/dist/components/heading/types.js.map +1 -1
- package/dist/components/icon-button/IconButton.js +3 -3
- package/dist/components/icon-button/IconButton.js.map +1 -1
- package/dist/components/icon-button/types.d.ts +3 -3
- package/dist/components/icon-button/types.d.ts.map +1 -1
- package/dist/components/icon-button/types.js.map +1 -1
- package/dist/components/input/Input.js +1 -1
- package/dist/components/input/Input.js.map +1 -1
- package/dist/components/media-card/MediaCard.js +2 -2
- package/dist/components/media-card/MediaCard.js.map +1 -1
- package/dist/components/metric-card/MetricCard.js +5 -5
- package/dist/components/metric-card/MetricCard.js.map +1 -1
- package/dist/components/metric-card/types.d.ts +2 -2
- package/dist/components/metric-card/types.d.ts.map +1 -1
- package/dist/components/metric-card/types.js.map +1 -1
- package/dist/components/modal/Modal.js +1 -1
- package/dist/components/modal/Modal.js.map +1 -1
- package/dist/components/progress/Progress.js +2 -2
- package/dist/components/progress/Progress.js.map +1 -1
- package/dist/components/progress/types.d.ts +3 -3
- package/dist/components/progress/types.d.ts.map +1 -1
- package/dist/components/progress/types.js +12 -2
- package/dist/components/progress/types.js.map +1 -1
- package/dist/components/radio/RadioGroup.js +5 -5
- package/dist/components/radio/RadioGroup.js.map +1 -1
- package/dist/components/radio/types.d.ts +1 -1
- package/dist/components/radio/types.d.ts.map +1 -1
- package/dist/components/radio/types.js.map +1 -1
- package/dist/components/rating/Rating.js +2 -2
- package/dist/components/rating/Rating.js.map +1 -1
- package/dist/components/rating/types.d.ts +3 -3
- package/dist/components/rating/types.d.ts.map +1 -1
- package/dist/components/rating/types.js +12 -2
- package/dist/components/rating/types.js.map +1 -1
- package/dist/components/tabs/Tabs.d.ts.map +1 -1
- package/dist/components/tabs/Tabs.js +4 -4
- package/dist/components/tabs/Tabs.js.map +1 -1
- package/dist/components/text/Text.d.ts.map +1 -1
- package/dist/components/text/Text.js +3 -2
- package/dist/components/text/Text.js.map +1 -1
- package/dist/components/text/index.d.ts +1 -1
- package/dist/components/text/index.d.ts.map +1 -1
- package/dist/components/text/index.js.map +1 -1
- package/dist/components/text/meta.d.ts +10 -4
- package/dist/components/text/meta.d.ts.map +1 -1
- package/dist/components/text/meta.js +11 -4
- package/dist/components/text/meta.js.map +1 -1
- package/dist/components/text/resolveTextRecipe.d.ts +4 -3
- package/dist/components/text/resolveTextRecipe.d.ts.map +1 -1
- package/dist/components/text/resolveTextRecipe.js +35 -13
- package/dist/components/text/resolveTextRecipe.js.map +1 -1
- package/dist/components/text/types.d.ts +5 -2
- package/dist/components/text/types.d.ts.map +1 -1
- package/dist/components/text/types.js.map +1 -1
- package/dist/components/toolbar/ToolbarAction.js +1 -1
- package/dist/components/toolbar/ToolbarAction.js.map +1 -1
- package/dist/index.d.ts +4 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/internal/colorModel.d.ts +10 -0
- package/dist/internal/colorModel.d.ts.map +1 -0
- package/dist/internal/colorModel.js +25 -0
- package/dist/internal/colorModel.js.map +1 -0
- package/dist/internal/recipes.d.ts +12 -11
- package/dist/internal/recipes.d.ts.map +1 -1
- package/dist/internal/recipes.js +6 -6
- package/dist/internal/recipes.js.map +1 -1
- package/dist/patterns/auth/ForgotPasswordForm.js +2 -2
- package/dist/patterns/auth/ForgotPasswordForm.js.map +1 -1
- package/dist/patterns/auth/OtpForm.js +2 -2
- package/dist/patterns/auth/OtpForm.js.map +1 -1
- package/dist/patterns/auth/SignInForm.js +4 -4
- package/dist/patterns/auth/SignInForm.js.map +1 -1
- package/dist/patterns/auth/SignUpForm.js +2 -2
- package/dist/patterns/auth/SignUpForm.js.map +1 -1
- package/dist/patterns/chat-list-item/ChatListItem.d.ts.map +1 -1
- package/dist/patterns/chat-list-item/ChatListItem.js +6 -6
- package/dist/patterns/chat-list-item/ChatListItem.js.map +1 -1
- package/dist/patterns/chat-list-item/types.d.ts +2 -2
- package/dist/patterns/chat-list-item/types.d.ts.map +1 -1
- package/dist/patterns/chat-list-item/types.js.map +1 -1
- package/dist/patterns/collection-editor/CollectionEditor.js +5 -5
- package/dist/patterns/collection-editor/CollectionEditor.js.map +1 -1
- package/dist/patterns/confirm-dialog/ConfirmDialog.js +3 -3
- package/dist/patterns/confirm-dialog/ConfirmDialog.js.map +1 -1
- package/dist/patterns/confirm-dialog/types.d.ts +3 -3
- package/dist/patterns/confirm-dialog/types.d.ts.map +1 -1
- package/dist/patterns/confirm-dialog/types.js.map +1 -1
- package/dist/patterns/disclosure-section/DisclosureSection.js +1 -1
- package/dist/patterns/disclosure-section/DisclosureSection.js.map +1 -1
- package/dist/patterns/empty-state/EmptyState.js +2 -2
- package/dist/patterns/empty-state/EmptyState.js.map +1 -1
- package/dist/patterns/empty-state/types.d.ts +3 -3
- package/dist/patterns/empty-state/types.d.ts.map +1 -1
- package/dist/patterns/empty-state/types.js.map +1 -1
- package/dist/patterns/form-field/FormField.js +1 -1
- package/dist/patterns/form-field/FormField.js.map +1 -1
- package/dist/patterns/hero/Hero.js +3 -3
- package/dist/patterns/hero/Hero.js.map +1 -1
- package/dist/patterns/hero/types.d.ts +3 -3
- package/dist/patterns/hero/types.d.ts.map +1 -1
- package/dist/patterns/hero/types.js.map +1 -1
- package/dist/patterns/image-preview/ImagePreview.js +1 -1
- package/dist/patterns/image-preview/ImagePreview.js.map +1 -1
- package/dist/patterns/image-upload-field/ImageUploadField.js +7 -7
- package/dist/patterns/image-upload-field/ImageUploadField.js.map +1 -1
- package/dist/patterns/list/ListRow.js +2 -2
- package/dist/patterns/list/ListRow.js.map +1 -1
- package/dist/patterns/message-bubble/MessageBubble.d.ts.map +1 -1
- package/dist/patterns/message-bubble/MessageBubble.js +6 -6
- package/dist/patterns/message-bubble/MessageBubble.js.map +1 -1
- package/dist/patterns/message-bubble/types.d.ts +2 -2
- package/dist/patterns/message-bubble/types.d.ts.map +1 -1
- package/dist/patterns/message-bubble/types.js.map +1 -1
- package/dist/patterns/notice/Notice.js +2 -2
- package/dist/patterns/notice/Notice.js.map +1 -1
- package/dist/patterns/notice/types.d.ts +2 -2
- package/dist/patterns/notice/types.d.ts.map +1 -1
- package/dist/patterns/notice/types.js.map +1 -1
- package/dist/patterns/post-card/PostCard.js +4 -4
- package/dist/patterns/post-card/PostCard.js.map +1 -1
- package/dist/patterns/post-card/types.d.ts +2 -2
- package/dist/patterns/post-card/types.d.ts.map +1 -1
- package/dist/patterns/post-card/types.js.map +1 -1
- package/dist/patterns/section-header/SectionHeader.js +2 -2
- package/dist/patterns/section-header/SectionHeader.js.map +1 -1
- package/dist/patterns/settings-row/SettingsRow.js +1 -1
- package/dist/patterns/settings-row/SettingsRow.js.map +1 -1
- package/dist/patterns/theme-composer/ThemeComposer.js +14 -14
- package/dist/patterns/theme-composer/ThemeComposer.js.map +1 -1
- package/dist/patterns/tile-grid/PaletteItem.js +1 -1
- package/dist/patterns/tile-grid/PaletteItem.js.map +1 -1
- package/dist/patterns/timeline/Timeline.d.ts.map +1 -1
- package/dist/patterns/timeline/Timeline.js +14 -4
- package/dist/patterns/timeline/Timeline.js.map +1 -1
- package/dist/patterns/timeline/types.d.ts +2 -2
- package/dist/patterns/timeline/types.d.ts.map +1 -1
- package/dist/patterns/timeline/types.js.map +1 -1
- package/dist/patterns/tree-view/TreeItem.js +1 -1
- package/dist/patterns/tree-view/TreeItem.js.map +1 -1
- package/package.json +2 -2
- package/src/components/app-bar/AppBar.tsx +6 -6
- package/src/components/avatar/Avatar.tsx +21 -11
- package/src/components/avatar/types.ts +2 -2
- package/src/components/avatar-group/AvatarGroup.tsx +2 -2
- package/src/components/avatar-group/types.ts +2 -2
- package/src/components/badge/Badge.tsx +4 -4
- package/src/components/badge/types.ts +4 -4
- package/src/components/button/Button.tsx +4 -4
- package/src/components/button/meta.ts +8 -7
- package/src/components/button/types.ts +4 -4
- package/src/components/card/Card.tsx +2 -2
- package/src/components/checkbox/CheckboxGroup.tsx +6 -6
- package/src/components/checkbox/types.ts +1 -1
- package/src/components/chip/Chip.tsx +9 -10
- package/src/components/chip/resolveChipColors.ts +16 -6
- package/src/components/chip/types.ts +2 -2
- package/src/components/chip-group/ChipGroup.tsx +2 -2
- package/src/components/chip-group/types.ts +2 -2
- package/src/components/drawer/Drawer.tsx +1 -1
- package/src/components/form/FormError.tsx +1 -1
- package/src/components/form/FormField.tsx +1 -1
- package/src/components/heading/Heading.tsx +6 -3
- package/src/components/heading/index.ts +2 -1
- package/src/components/heading/meta.ts +10 -3
- package/src/components/heading/resolveHeadingRecipe.test.ts +13 -10
- package/src/components/heading/resolveHeadingRecipe.ts +58 -15
- package/src/components/heading/types.ts +5 -10
- package/src/components/icon-button/IconButton.tsx +4 -4
- package/src/components/icon-button/types.ts +3 -3
- package/src/components/input/Input.tsx +2 -2
- package/src/components/media-card/MediaCard.tsx +2 -2
- package/src/components/metric-card/MetricCard.tsx +6 -6
- package/src/components/metric-card/types.ts +2 -2
- package/src/components/modal/Modal.tsx +1 -1
- package/src/components/progress/Progress.tsx +2 -2
- package/src/components/progress/types.ts +14 -4
- package/src/components/radio/RadioGroup.tsx +6 -6
- package/src/components/radio/types.ts +1 -1
- package/src/components/rating/Rating.tsx +2 -2
- package/src/components/rating/types.ts +14 -4
- package/src/components/tabs/Tabs.tsx +11 -7
- package/src/components/text/Text.tsx +4 -2
- package/src/components/text/index.ts +8 -1
- package/src/components/text/meta.ts +11 -4
- package/src/components/text/resolveTextRecipe.test.ts +18 -14
- package/src/components/text/resolveTextRecipe.ts +42 -15
- package/src/components/text/types.ts +5 -10
- package/src/components/toolbar/ToolbarAction.tsx +2 -2
- package/src/index.ts +22 -2
- package/src/internal/colorModel.ts +39 -0
- package/src/internal/recipes.test.ts +2 -2
- package/src/internal/recipes.ts +18 -18
- package/src/patterns/auth/ForgotPasswordForm.tsx +2 -2
- package/src/patterns/auth/OtpForm.tsx +2 -2
- package/src/patterns/auth/SignInForm.tsx +4 -4
- package/src/patterns/auth/SignUpForm.tsx +2 -2
- package/src/patterns/chat-list-item/ChatListItem.tsx +7 -6
- package/src/patterns/chat-list-item/types.ts +2 -2
- package/src/patterns/collection-editor/CollectionEditor.tsx +6 -6
- package/src/patterns/confirm-dialog/ConfirmDialog.tsx +4 -4
- package/src/patterns/confirm-dialog/types.ts +3 -3
- package/src/patterns/disclosure-section/DisclosureSection.tsx +2 -2
- package/src/patterns/empty-state/EmptyState.tsx +4 -4
- package/src/patterns/empty-state/types.ts +3 -3
- package/src/patterns/form-field/FormField.tsx +1 -1
- package/src/patterns/hero/Hero.tsx +4 -4
- package/src/patterns/hero/types.ts +3 -3
- package/src/patterns/image-preview/ImagePreview.tsx +1 -1
- package/src/patterns/image-upload-field/ImageUploadField.tsx +8 -8
- package/src/patterns/list/ListRow.tsx +2 -2
- package/src/patterns/message-bubble/MessageBubble.tsx +10 -6
- package/src/patterns/message-bubble/types.ts +2 -2
- package/src/patterns/notice/Notice.tsx +2 -2
- package/src/patterns/notice/types.ts +2 -2
- package/src/patterns/post-card/PostCard.tsx +5 -5
- package/src/patterns/post-card/types.ts +2 -2
- package/src/patterns/section-header/SectionHeader.tsx +2 -2
- package/src/patterns/settings-row/SettingsRow.tsx +1 -1
- package/src/patterns/theme-composer/ThemeComposer.tsx +15 -15
- package/src/patterns/tile-grid/PaletteItem.tsx +1 -1
- package/src/patterns/timeline/Timeline.tsx +15 -5
- package/src/patterns/timeline/types.ts +2 -2
- package/src/patterns/tree-view/TreeItem.tsx +1 -1
|
@@ -54,10 +54,10 @@ function ListRowInner({ themeId: _themeId, mode: _mode, testID, title, descripti
|
|
|
54
54
|
<Text variant="body" weight={selected ? 'semiBold' : 'medium'}>
|
|
55
55
|
{title}
|
|
56
56
|
</Text>
|
|
57
|
-
{description ? (<Text
|
|
57
|
+
{description ? (<Text emphasis="muted" variant="bodySmall">
|
|
58
58
|
{description}
|
|
59
59
|
</Text>) : null}
|
|
60
|
-
{meta ? (<Text
|
|
60
|
+
{meta ? (<Text emphasis="subtle" variant="caption">
|
|
61
61
|
{meta}
|
|
62
62
|
</Text>) : null}
|
|
63
63
|
</Stack>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListRow.js","sourceRoot":"","sources":["../../../src/patterns/list/ListRow.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ListRow.js","sourceRoot":"","sources":["../../../src/patterns/list/ListRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Text } from '../../components/text';\nimport { Box, Inline, Spacer, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ListRowProps, ListRowVariant } from './types';\n\nfunction resolvePadding(compact: boolean) {\n return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveContainerStyles({\n variant,\n theme,\n selected,\n pressed,\n hovered,\n disabled,\n}: {\n variant: ListRowVariant;\n theme: ReturnType<typeof useZoraTheme>['theme'];\n selected: boolean;\n pressed: boolean;\n hovered: boolean;\n disabled: boolean;\n}) {\n const borderColor = selected ? theme.semantics.border.focus : theme.semantics.border.default;\n const dividerBorderColor = selected ? theme.semantics.border.focus : 'transparent';\n\n if (variant === 'card') {\n return {\n bg: pressed\n ? theme.semantics.neutral.surfaceActive\n : hovered\n ? theme.semantics.neutral.surfaceHover\n : theme.semantics.surface.raised,\n borderColor,\n borderWidth: 1,\n radius: 'l' as const,\n opacity: disabled ? 0.72 : 1,\n };\n }\n\n return {\n bg: pressed\n ? theme.semantics.neutral.surfaceActive\n : hovered\n ? theme.semantics.neutral.surfaceHover\n : selected\n ? theme.semantics.neutral.surface\n : 'transparent',\n borderColor: dividerBorderColor,\n borderWidth: selected ? 1 : 0,\n radius: 'm' as const,\n opacity: disabled ? 0.72 : 1,\n };\n}\n\nfunction ListRowInner({\n themeId: _themeId,\n mode: _mode,\n testID,\n title,\n description,\n meta,\n leading,\n trailing,\n action,\n onPress,\n selected = false,\n disabled = false,\n compact = false,\n variant = 'divider',\n}: ListRowProps) {\n const { theme } = useZoraTheme();\n const padding = resolvePadding(compact);\n const isInteractive = Boolean(onPress) && !action;\n\n const content = (\n <Stack\n align=\"center\"\n direction=\"row\"\n style={{\n flex: 1,\n }}\n >\n {leading ? (\n <>\n <Box>{leading}</Box>\n <Spacer axis=\"horizontal\" size=\"m\" />\n </>\n ) : null}\n\n <Box flex={1}>\n <Stack gap=\"xxs\">\n <Text variant=\"body\" weight={selected ? 'semiBold' : 'medium'}>\n {title}\n </Text>\n {description ? (\n <Text emphasis=\"muted\" variant=\"bodySmall\">\n {description}\n </Text>\n ) : null}\n {meta ? (\n <Text emphasis=\"subtle\" variant=\"caption\">\n {meta}\n </Text>\n ) : null}\n </Stack>\n </Box>\n\n {trailing || action ? (\n <>\n <Spacer axis=\"horizontal\" size=\"m\" />\n <Inline align=\"center\" gap=\"s\" wrap=\"nowrap\">\n {trailing}\n {action}\n </Inline>\n </>\n ) : null}\n </Stack>\n );\n\n if (!isInteractive) {\n const styles = resolveContainerStyles({\n variant,\n theme,\n selected,\n pressed: false,\n hovered: false,\n disabled,\n });\n\n return (\n <Box\n bg={styles.bg}\n borderColor={styles.borderColor}\n borderWidth={styles.borderWidth}\n px={padding.px}\n py={padding.py}\n radius={styles.radius}\n testID={testID}\n style={{\n opacity: styles.opacity,\n }}\n >\n {content}\n </Box>\n );\n }\n\n return (\n <ButtonBase\n accessibilityRole=\"button\"\n accessibilityState={{ disabled, selected }}\n disabled={disabled}\n onPress={onPress}\n radius={variant === 'card' ? 'l' : 'm'}\n testID={testID}\n >\n {(state) => {\n const styles = resolveContainerStyles({\n variant,\n theme,\n selected,\n pressed: state.pressed,\n hovered: state.hovered,\n disabled: state.disabled,\n });\n\n return (\n <Box\n bg={styles.bg}\n borderColor={styles.borderColor}\n borderWidth={styles.borderWidth}\n px={padding.px}\n py={padding.py}\n radius={styles.radius}\n style={{\n opacity: styles.opacity,\n }}\n >\n {content}\n </Box>\n );\n }}\n </ButtonBase>\n );\n}\n\nexport const ListRow = withZoraThemeScope(ListRowInner);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageBubble.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAGV,kBAAkB,EAEnB,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"MessageBubble.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAGV,kBAAkB,EAEnB,MAAM,SAAS,CAAC;AA2PjB,eAAO,MAAM,aAAa,0DAAyC,CAAC"}
|
|
@@ -66,7 +66,7 @@ function resolveBubbleStyles({ direction, disabled, hovered, pressed, selected,
|
|
|
66
66
|
}
|
|
67
67
|
function MessageAvatar({ avatar, authorName, compact, }) {
|
|
68
68
|
const avatarName = resolveAvatarName({ avatar, authorName });
|
|
69
|
-
return (<Avatar initials={avatar.initials} label={avatar.label ?? avatarName} name={avatarName} shape={avatar.shape} size={avatar.size ?? (compact ? 'xs' : 's')} source={avatar.source}
|
|
69
|
+
return (<Avatar initials={avatar.initials} label={avatar.label ?? avatarName} name={avatarName} shape={avatar.shape} size={avatar.size ?? (compact ? 'xs' : 's')} source={avatar.source} color={avatar.color}/>);
|
|
70
70
|
}
|
|
71
71
|
function MessageBubbleInner({ themeId: _themeId, mode: _mode, testID, direction = 'incoming', text, children, author, timestamp, meta, status, leading, trailing, footer, selected = false, disabled = false, compact = false, accessibilityLabel, onPress, }) {
|
|
72
72
|
const { theme } = useZoraTheme();
|
|
@@ -84,21 +84,21 @@ function MessageBubbleInner({ themeId: _themeId, mode: _mode, testID, direction
|
|
|
84
84
|
const styles = resolveBubbleStyles({ direction, disabled, hovered, pressed, selected, theme });
|
|
85
85
|
return (<Box bg={styles.bg} borderColor={styles.borderColor} borderWidth={styles.borderWidth} px={padding.px} py={padding.py} radius={isSystem ? 'm' : 'l'} style={{ maxWidth: compact ? 420 : 560, opacity: styles.opacity }}>
|
|
86
86
|
<Stack align={isSystem ? 'center' : 'flex-start'} gap={compact ? 'xxs' : 'xs'}>
|
|
87
|
-
{hasAuthorName ? (<Text
|
|
87
|
+
{hasAuthorName ? (<Text emphasis="muted" variant="caption" weight="semiBold">
|
|
88
88
|
{authorName}
|
|
89
89
|
</Text>) : null}
|
|
90
|
-
{text != null ? (<Text align={isSystem ? 'center' : undefined}
|
|
90
|
+
{text != null ? (<Text align={isSystem ? 'center' : undefined} emphasis={disabled ? 'muted' : 'default'}>
|
|
91
91
|
{text}
|
|
92
92
|
</Text>) : null}
|
|
93
93
|
{children != null ? <Box width="100%">{children}</Box> : null}
|
|
94
94
|
{hasMetaRow ? (<Inline align="center" gap="xs" justify={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'} wrap="wrap">
|
|
95
|
-
{timestamp != null ? (<Text
|
|
95
|
+
{timestamp != null ? (<Text emphasis="subtle" variant="caption">
|
|
96
96
|
{timestamp}
|
|
97
97
|
</Text>) : null}
|
|
98
|
-
{meta != null ? (<Text
|
|
98
|
+
{meta != null ? (<Text emphasis="subtle" variant="caption">
|
|
99
99
|
{meta}
|
|
100
100
|
</Text>) : null}
|
|
101
|
-
{renderedStatus != null ? (<Text
|
|
101
|
+
{renderedStatus != null ? (<Text color={status === 'failed' ? 'danger' : undefined} emphasis={status === 'failed' ? 'default' : 'subtle'} variant="caption">
|
|
102
102
|
{renderedStatus}
|
|
103
103
|
</Text>) : null}
|
|
104
104
|
</Inline>) : null}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageBubble.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Avatar } from '../../components/avatar';\nimport { Text } from '../../components/text';\nimport { Box, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type {\n MessageBubbleAvatar,\n MessageBubbleDirection,\n MessageBubbleProps,\n MessageBubbleStatus,\n} from './types';\n\nfunction resolveAvatarName({\n avatar,\n authorName,\n}: {\n avatar: MessageBubbleAvatar | undefined;\n authorName: React.ReactNode | undefined;\n}): string | undefined {\n if (avatar?.name) return avatar.name;\n return typeof authorName === 'string' ? authorName : undefined;\n}\n\nfunction resolvePadding(compact: boolean) {\n return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveStatusLabel(status: MessageBubbleStatus): string {\n switch (status) {\n case 'sending':\n return 'Sending';\n case 'sent':\n return 'Sent';\n case 'delivered':\n return 'Delivered';\n case 'read':\n return 'Read';\n case 'failed':\n return 'Failed';\n default:\n return status;\n }\n}\n\nfunction isMessageBubbleStatus(\n status: MessageBubbleProps['status'],\n): status is MessageBubbleStatus {\n return (\n status === 'sending' ||\n status === 'sent' ||\n status === 'delivered' ||\n status === 'read' ||\n status === 'failed'\n );\n}\n\nfunction resolveStatus(status: MessageBubbleProps['status']) {\n if (status == null) return null;\n return isMessageBubbleStatus(status) ? resolveStatusLabel(status) : status;\n}\n\nfunction resolveBubbleStyles({\n direction,\n disabled,\n hovered,\n pressed,\n selected,\n theme,\n}: {\n direction: MessageBubbleDirection;\n disabled: boolean;\n hovered: boolean;\n pressed: boolean;\n selected: boolean;\n theme: ReturnType<typeof useZoraTheme>['theme'];\n}) {\n const borderColor = selected ? theme.semantics.border.focus : theme.semantics.border.default;\n\n if (direction === 'system') {\n return {\n bg: selected ? theme.semantics.neutral.surface : 'transparent',\n borderColor,\n borderWidth: selected ? 1 : 0,\n opacity: disabled ? 0.72 : 1,\n };\n }\n\n const interactiveBg = pressed\n ? theme.semantics.neutral.surfaceActive\n : hovered\n ? theme.semantics.neutral.surfaceHover\n : undefined;\n\n return {\n bg:\n interactiveBg ??\n (direction === 'outgoing' ? theme.semantics.neutral.surface : theme.semantics.surface.raised),\n borderColor,\n borderWidth: selected ? 1 : 0,\n opacity: disabled ? 0.72 : 1,\n };\n}\n\nfunction MessageAvatar({\n avatar,\n authorName,\n compact,\n}: {\n avatar: MessageBubbleAvatar;\n authorName: React.ReactNode | undefined;\n compact: boolean;\n}) {\n const avatarName = resolveAvatarName({ avatar, authorName });\n\n return (\n <Avatar\n initials={avatar.initials}\n label={avatar.label ?? avatarName}\n name={avatarName}\n shape={avatar.shape}\n size={avatar.size ?? (compact ? 'xs' : 's')}\n source={avatar.source}\n tone={avatar.tone}\n />\n );\n}\n\nfunction MessageBubbleInner({\n themeId: _themeId,\n mode: _mode,\n testID,\n direction = 'incoming',\n text,\n children,\n author,\n timestamp,\n meta,\n status,\n leading,\n trailing,\n footer,\n selected = false,\n disabled = false,\n compact = false,\n accessibilityLabel,\n onPress,\n}: MessageBubbleProps) {\n const { theme } = useZoraTheme();\n const padding = resolvePadding(compact);\n const isInteractive = Boolean(onPress);\n const isOutgoing = direction === 'outgoing';\n const isSystem = direction === 'system';\n const renderedStatus = resolveStatus(status);\n const authorName = author?.name;\n const authorAvatar = author?.avatar;\n const hasAuthorName = authorName != null && !isOutgoing && !isSystem;\n const hasAvatar = authorAvatar != null && !isOutgoing && !isSystem;\n const hasMetaRow = timestamp != null || meta != null || renderedStatus != null;\n\n const renderBubble = ({ pressed, hovered }: { pressed: boolean; hovered: boolean }) => {\n const styles = resolveBubbleStyles({ direction, disabled, hovered, pressed, selected, theme });\n\n return (\n <Box\n bg={styles.bg}\n borderColor={styles.borderColor}\n borderWidth={styles.borderWidth}\n px={padding.px}\n py={padding.py}\n radius={isSystem ? 'm' : 'l'}\n style={{ maxWidth: compact ? 420 : 560, opacity: styles.opacity }}\n >\n <Stack align={isSystem ? 'center' : 'flex-start'} gap={compact ? 'xxs' : 'xs'}>\n {hasAuthorName ? (\n <Text tone=\"muted\" variant=\"caption\" weight=\"semiBold\">\n {authorName}\n </Text>\n ) : null}\n {text != null ? (\n <Text align={isSystem ? 'center' : undefined} tone={disabled ? 'muted' : 'default'}>\n {text}\n </Text>\n ) : null}\n {children != null ? <Box width=\"100%\">{children}</Box> : null}\n {hasMetaRow ? (\n <Inline\n align=\"center\"\n gap=\"xs\"\n justify={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}\n wrap=\"wrap\"\n >\n {timestamp != null ? (\n <Text tone=\"subtle\" variant=\"caption\">\n {timestamp}\n </Text>\n ) : null}\n {meta != null ? (\n <Text tone=\"subtle\" variant=\"caption\">\n {meta}\n </Text>\n ) : null}\n {renderedStatus != null ? (\n <Text tone={status === 'failed' ? 'danger' : 'subtle'} variant=\"caption\">\n {renderedStatus}\n </Text>\n ) : null}\n </Inline>\n ) : null}\n </Stack>\n </Box>\n );\n };\n\n const bubbleContent = isInteractive ? (\n <ButtonBase\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"button\"\n accessibilityState={{ disabled, selected }}\n disabled={disabled}\n onPress={onPress}\n radius={isSystem ? 'm' : 'l'}\n testID={testID}\n >\n {(state) => renderBubble({ pressed: state.pressed, hovered: state.hovered })}\n </ButtonBase>\n ) : (\n <Box testID={testID}>{renderBubble({ pressed: false, hovered: false })}</Box>\n );\n\n return (\n <Stack gap=\"xs\" style={{ width: '100%' }}>\n <Inline\n align=\"flex-end\"\n gap=\"s\"\n justify={isSystem ? 'center' : isOutgoing ? 'flex-end' : 'flex-start'}\n wrap=\"nowrap\"\n >\n {!isOutgoing && !isSystem ? (\n <Box>\n {leading ??\n (hasAvatar ? (\n <MessageAvatar avatar={authorAvatar} authorName={authorName} compact={compact} />\n ) : null)}\n </Box>\n ) : null}\n {isOutgoing && trailing ? <Box>{trailing}</Box> : null}\n {bubbleContent}\n {isOutgoing && leading ? <Box>{leading}</Box> : null}\n {!isOutgoing && !isSystem && trailing ? <Box>{trailing}</Box> : null}\n </Inline>\n {footer != null ? (\n <Box alignSelf={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}>{footer}</Box>\n ) : null}\n </Stack>\n );\n}\n\nexport const MessageBubble = withZoraThemeScope(MessageBubbleInner);\n"]}
|
|
1
|
+
{"version":3,"file":"MessageBubble.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/MessageBubble.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Avatar } from '../../components/avatar';\nimport { Text } from '../../components/text';\nimport { Box, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type {\n MessageBubbleAvatar,\n MessageBubbleDirection,\n MessageBubbleProps,\n MessageBubbleStatus,\n} from './types';\n\nfunction resolveAvatarName({\n avatar,\n authorName,\n}: {\n avatar: MessageBubbleAvatar | undefined;\n authorName: React.ReactNode | undefined;\n}): string | undefined {\n if (avatar?.name) return avatar.name;\n return typeof authorName === 'string' ? authorName : undefined;\n}\n\nfunction resolvePadding(compact: boolean) {\n return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveStatusLabel(status: MessageBubbleStatus): string {\n switch (status) {\n case 'sending':\n return 'Sending';\n case 'sent':\n return 'Sent';\n case 'delivered':\n return 'Delivered';\n case 'read':\n return 'Read';\n case 'failed':\n return 'Failed';\n default:\n return status;\n }\n}\n\nfunction isMessageBubbleStatus(\n status: MessageBubbleProps['status'],\n): status is MessageBubbleStatus {\n return (\n status === 'sending' ||\n status === 'sent' ||\n status === 'delivered' ||\n status === 'read' ||\n status === 'failed'\n );\n}\n\nfunction resolveStatus(status: MessageBubbleProps['status']) {\n if (status == null) return null;\n return isMessageBubbleStatus(status) ? resolveStatusLabel(status) : status;\n}\n\nfunction resolveBubbleStyles({\n direction,\n disabled,\n hovered,\n pressed,\n selected,\n theme,\n}: {\n direction: MessageBubbleDirection;\n disabled: boolean;\n hovered: boolean;\n pressed: boolean;\n selected: boolean;\n theme: ReturnType<typeof useZoraTheme>['theme'];\n}) {\n const borderColor = selected ? theme.semantics.border.focus : theme.semantics.border.default;\n\n if (direction === 'system') {\n return {\n bg: selected ? theme.semantics.neutral.surface : 'transparent',\n borderColor,\n borderWidth: selected ? 1 : 0,\n opacity: disabled ? 0.72 : 1,\n };\n }\n\n const interactiveBg = pressed\n ? theme.semantics.neutral.surfaceActive\n : hovered\n ? theme.semantics.neutral.surfaceHover\n : undefined;\n\n return {\n bg:\n interactiveBg ??\n (direction === 'outgoing' ? theme.semantics.neutral.surface : theme.semantics.surface.raised),\n borderColor,\n borderWidth: selected ? 1 : 0,\n opacity: disabled ? 0.72 : 1,\n };\n}\n\nfunction MessageAvatar({\n avatar,\n authorName,\n compact,\n}: {\n avatar: MessageBubbleAvatar;\n authorName: React.ReactNode | undefined;\n compact: boolean;\n}) {\n const avatarName = resolveAvatarName({ avatar, authorName });\n\n return (\n <Avatar\n initials={avatar.initials}\n label={avatar.label ?? avatarName}\n name={avatarName}\n shape={avatar.shape}\n size={avatar.size ?? (compact ? 'xs' : 's')}\n source={avatar.source}\n color={avatar.color}\n />\n );\n}\n\nfunction MessageBubbleInner({\n themeId: _themeId,\n mode: _mode,\n testID,\n direction = 'incoming',\n text,\n children,\n author,\n timestamp,\n meta,\n status,\n leading,\n trailing,\n footer,\n selected = false,\n disabled = false,\n compact = false,\n accessibilityLabel,\n onPress,\n}: MessageBubbleProps) {\n const { theme } = useZoraTheme();\n const padding = resolvePadding(compact);\n const isInteractive = Boolean(onPress);\n const isOutgoing = direction === 'outgoing';\n const isSystem = direction === 'system';\n const renderedStatus = resolveStatus(status);\n const authorName = author?.name;\n const authorAvatar = author?.avatar;\n const hasAuthorName = authorName != null && !isOutgoing && !isSystem;\n const hasAvatar = authorAvatar != null && !isOutgoing && !isSystem;\n const hasMetaRow = timestamp != null || meta != null || renderedStatus != null;\n\n const renderBubble = ({ pressed, hovered }: { pressed: boolean; hovered: boolean }) => {\n const styles = resolveBubbleStyles({ direction, disabled, hovered, pressed, selected, theme });\n\n return (\n <Box\n bg={styles.bg}\n borderColor={styles.borderColor}\n borderWidth={styles.borderWidth}\n px={padding.px}\n py={padding.py}\n radius={isSystem ? 'm' : 'l'}\n style={{ maxWidth: compact ? 420 : 560, opacity: styles.opacity }}\n >\n <Stack align={isSystem ? 'center' : 'flex-start'} gap={compact ? 'xxs' : 'xs'}>\n {hasAuthorName ? (\n <Text emphasis=\"muted\" variant=\"caption\" weight=\"semiBold\">\n {authorName}\n </Text>\n ) : null}\n {text != null ? (\n <Text align={isSystem ? 'center' : undefined} emphasis={disabled ? 'muted' : 'default'}>\n {text}\n </Text>\n ) : null}\n {children != null ? <Box width=\"100%\">{children}</Box> : null}\n {hasMetaRow ? (\n <Inline\n align=\"center\"\n gap=\"xs\"\n justify={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}\n wrap=\"wrap\"\n >\n {timestamp != null ? (\n <Text emphasis=\"subtle\" variant=\"caption\">\n {timestamp}\n </Text>\n ) : null}\n {meta != null ? (\n <Text emphasis=\"subtle\" variant=\"caption\">\n {meta}\n </Text>\n ) : null}\n {renderedStatus != null ? (\n <Text\n color={status === 'failed' ? 'danger' : undefined}\n emphasis={status === 'failed' ? 'default' : 'subtle'}\n variant=\"caption\"\n >\n {renderedStatus}\n </Text>\n ) : null}\n </Inline>\n ) : null}\n </Stack>\n </Box>\n );\n };\n\n const bubbleContent = isInteractive ? (\n <ButtonBase\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"button\"\n accessibilityState={{ disabled, selected }}\n disabled={disabled}\n onPress={onPress}\n radius={isSystem ? 'm' : 'l'}\n testID={testID}\n >\n {(state) => renderBubble({ pressed: state.pressed, hovered: state.hovered })}\n </ButtonBase>\n ) : (\n <Box testID={testID}>{renderBubble({ pressed: false, hovered: false })}</Box>\n );\n\n return (\n <Stack gap=\"xs\" style={{ width: '100%' }}>\n <Inline\n align=\"flex-end\"\n gap=\"s\"\n justify={isSystem ? 'center' : isOutgoing ? 'flex-end' : 'flex-start'}\n wrap=\"nowrap\"\n >\n {!isOutgoing && !isSystem ? (\n <Box>\n {leading ??\n (hasAvatar ? (\n <MessageAvatar avatar={authorAvatar} authorName={authorName} compact={compact} />\n ) : null)}\n </Box>\n ) : null}\n {isOutgoing && trailing ? <Box>{trailing}</Box> : null}\n {bubbleContent}\n {isOutgoing && leading ? <Box>{leading}</Box> : null}\n {!isOutgoing && !isSystem && trailing ? <Box>{trailing}</Box> : null}\n </Inline>\n {footer != null ? (\n <Box alignSelf={isOutgoing ? 'flex-end' : isSystem ? 'center' : 'flex-start'}>{footer}</Box>\n ) : null}\n </Stack>\n );\n}\n\nexport const MessageBubble = withZoraThemeScope(MessageBubbleInner);\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
2
|
import type { ImageSourcePropType } from 'react-native';
|
|
3
3
|
import type { AvatarShape, AvatarSize } from '../../components/avatar';
|
|
4
|
-
import type {
|
|
4
|
+
import type { ZoraColor } from '../../internal/recipes';
|
|
5
5
|
import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
|
|
6
6
|
export type MessageBubbleDirection = 'incoming' | 'outgoing' | 'system';
|
|
7
7
|
export type MessageBubbleStatus = 'sending' | 'sent' | 'delivered' | 'read' | 'failed';
|
|
@@ -13,7 +13,7 @@ export interface MessageBubbleAvatar {
|
|
|
13
13
|
label?: string;
|
|
14
14
|
size?: AvatarSize;
|
|
15
15
|
shape?: AvatarShape;
|
|
16
|
-
|
|
16
|
+
color?: ZoraColor;
|
|
17
17
|
}
|
|
18
18
|
export interface MessageBubbleAuthor {
|
|
19
19
|
name?: React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAC;AACxE,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;AACvF,KAAK,0BAA0B,GAAG,mBAAmB,GAAG,OAAO,CAAC,KAAK,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAEzF,MAAM,WAAW,mBAAmB;IAClC,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,mBAAmB,CAAC;CAC9B;AAED,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD,SAAS,CAAC,EAAE,sBAAsB,CAAC;IACnC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,0BAA0B,CAAC;IACpC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type {
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/message-bubble/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type { ZoraColor } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type MessageBubbleDirection = 'incoming' | 'outgoing' | 'system';\nexport type MessageBubbleStatus = 'sending' | 'sent' | 'delivered' | 'read' | 'failed';\ntype MessageBubbleStatusContent = MessageBubbleStatus | Exclude<React.ReactNode, string>;\n\nexport interface MessageBubbleAvatar {\n source?: ImageSourcePropType;\n name?: string;\n initials?: string;\n label?: string;\n size?: AvatarSize;\n shape?: AvatarShape;\n color?: ZoraColor;\n}\n\nexport interface MessageBubbleAuthor {\n name?: React.ReactNode;\n avatar?: MessageBubbleAvatar;\n}\n\nexport interface MessageBubbleProps extends ZoraBaseProps {\n direction?: MessageBubbleDirection;\n text?: React.ReactNode;\n children?: React.ReactNode;\n author?: MessageBubbleAuthor;\n timestamp?: React.ReactNode;\n meta?: React.ReactNode;\n status?: MessageBubbleStatusContent;\n leading?: React.ReactNode;\n trailing?: React.ReactNode;\n footer?: React.ReactNode;\n selected?: boolean;\n disabled?: boolean;\n compact?: boolean;\n accessibilityLabel?: string;\n onPress?: () => void;\n}\n"]}
|
|
@@ -3,8 +3,8 @@ import { Badge } from '../../components/badge';
|
|
|
3
3
|
import { Card } from '../../components/card';
|
|
4
4
|
import { Box, Stack } from '../../foundation';
|
|
5
5
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
6
|
-
function NoticeInner({ themeId: _themeId, mode: _mode, title, description, children, actions,
|
|
7
|
-
return (<Card description={description} eyebrow={<Badge
|
|
6
|
+
function NoticeInner({ themeId: _themeId, mode: _mode, title, description, children, actions, color = 'primary', testID, }) {
|
|
7
|
+
return (<Card description={description} eyebrow={<Badge color={color}>{String(color).toUpperCase()}</Badge>} testID={testID} title={title} tone="subtle">
|
|
8
8
|
<Stack gap="m">
|
|
9
9
|
{children ? <Box>{children}</Box> : null}
|
|
10
10
|
{actions ? <Box>{actions}</Box> : null}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Notice.js","sourceRoot":"","sources":["../../../src/patterns/notice/Notice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,WAAW,CAAC,EACnB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,QAAQ,EACR,OAAO,EACP,
|
|
1
|
+
{"version":3,"file":"Notice.js","sourceRoot":"","sources":["../../../src/patterns/notice/Notice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,WAAW,CAAC,EACnB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,QAAQ,EACR,OAAO,EACP,KAAK,GAAG,SAAS,EACjB,MAAM,GACM;IACZ,OAAO,CACL,CAAC,IAAI,CACH,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CACpE,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CACZ;QAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;QAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;MAAA,EAAE,KAAK,CACT;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Badge } from '../../components/badge';\nimport { Card } from '../../components/card';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { NoticeProps } from './types';\n\nfunction NoticeInner({\n themeId: _themeId,\n mode: _mode,\n title,\n description,\n children,\n actions,\n color = 'primary',\n testID,\n}: NoticeProps) {\n return (\n <Card\n description={description}\n eyebrow={<Badge color={color}>{String(color).toUpperCase()}</Badge>}\n testID={testID}\n title={title}\n tone=\"subtle\"\n >\n <Stack gap=\"m\">\n {children ? <Box>{children}</Box> : null}\n {actions ? <Box>{actions}</Box> : null}\n </Stack>\n </Card>\n );\n}\n\nexport const Notice = withZoraThemeScope(NoticeInner);\n"]}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
|
-
import type {
|
|
2
|
+
import type { ZoraColor } from '../../internal/recipes';
|
|
3
3
|
import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
|
|
4
4
|
export interface NoticeProps extends ZoraBaseProps {
|
|
5
5
|
title: React.ReactNode;
|
|
6
6
|
description?: React.ReactNode;
|
|
7
7
|
children?: React.ReactNode;
|
|
8
8
|
actions?: React.ReactNode;
|
|
9
|
-
|
|
9
|
+
color?: ZoraColor;
|
|
10
10
|
}
|
|
11
11
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,WAAY,SAAQ,aAAa;IAChD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type {
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/notice/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { ZoraColor } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface NoticeProps extends ZoraBaseProps {\n title: React.ReactNode;\n description?: React.ReactNode;\n children?: React.ReactNode;\n actions?: React.ReactNode;\n color?: ZoraColor;\n}\n"]}
|
|
@@ -32,13 +32,13 @@ function PostCardAuthor({ author, compact = false }) {
|
|
|
32
32
|
const avatarName = resolveAuthorName(author);
|
|
33
33
|
const { avatar } = author;
|
|
34
34
|
return (<Inline align="center" gap="s" wrap="nowrap">
|
|
35
|
-
<Avatar initials={avatar?.initials} label={avatar?.label ?? avatarName} name={avatarName} shape={avatar?.shape} size={avatar?.size ?? (compact ? 's' : 'm')} source={avatar?.source}
|
|
35
|
+
<Avatar initials={avatar?.initials} label={avatar?.label ?? avatarName} name={avatarName} shape={avatar?.shape} size={avatar?.size ?? (compact ? 's' : 'm')} source={avatar?.source} color={avatar?.color}/>
|
|
36
36
|
<Box flex={1}>
|
|
37
37
|
<Stack gap="xxs">
|
|
38
38
|
<Text variant="bodySmall" weight="semiBold">
|
|
39
39
|
{author.name}
|
|
40
40
|
</Text>
|
|
41
|
-
{author.subtitle ? (<Text
|
|
41
|
+
{author.subtitle ? (<Text emphasis="muted" variant="caption">
|
|
42
42
|
{author.subtitle}
|
|
43
43
|
</Text>) : null}
|
|
44
44
|
</Stack>
|
|
@@ -72,7 +72,7 @@ function PostCardActions({ actions }) {
|
|
|
72
72
|
return null;
|
|
73
73
|
}
|
|
74
74
|
return (<Inline align="center" gap="s" wrap="wrap">
|
|
75
|
-
{actions.map((action) => (<Button key={action.id} disabled={action.disabled}
|
|
75
|
+
{actions.map((action) => (<Button key={action.id} disabled={action.disabled} variant={action.selected ? 'soft' : 'ghost'} leadingIcon={action.icon} onPress={action.onPress} size="s" color={action.selected ? 'primary' : 'neutral'}>
|
|
76
76
|
<PostActionLabel action={action}/>
|
|
77
77
|
</Button>))}
|
|
78
78
|
</Inline>);
|
|
@@ -83,7 +83,7 @@ function PostCommentPreviewItem({ comment }) {
|
|
|
83
83
|
<Box flex={1}>
|
|
84
84
|
<Stack gap="xxs">
|
|
85
85
|
<Text variant="bodySmall">{comment.text}</Text>
|
|
86
|
-
{comment.meta ? (<Text
|
|
86
|
+
{comment.meta ? (<Text emphasis="subtle" variant="caption">
|
|
87
87
|
{comment.meta}
|
|
88
88
|
</Text>) : null}
|
|
89
89
|
{comment.action ? <Box>{comment.action}</Box> : null}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PostCard.js","sourceRoot":"","sources":["../../../src/patterns/post-card/PostCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Image as ReactNativeImage } from 'react-native';\n\nimport { Avatar } from '../../components/avatar';\nimport { Button } from '../../components/button';\nimport { Card } from '../../components/card';\nimport { Text } from '../../components/text';\nimport { Box, Divider, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type {\n PostAction,\n PostAuthor,\n PostCardMedia,\n PostCardProps,\n PostCommentPreview,\n} from './types';\n\nfunction resolveAuthorName(author: PostAuthor): string | undefined {\n return typeof author.name === 'string' ? author.name : author.avatar?.name;\n}\n\nfunction resolveMediaAspectRatio(aspectRatio: number | undefined): number {\n if (aspectRatio === undefined || !Number.isFinite(aspectRatio) || aspectRatio <= 0) {\n return 16 / 9;\n }\n\n return aspectRatio;\n}\n\nfunction isPostCardMediaList(\n media: NonNullable<PostCardProps['media']>,\n): media is readonly PostCardMedia[] {\n return Array.isArray(media);\n}\n\nfunction normalizeMedia(media: PostCardProps['media']): readonly PostCardMedia[] {\n if (!media) {\n return [];\n }\n\n if (isPostCardMediaList(media)) {\n return media;\n }\n\n return [media];\n}\n\nfunction PostCardAuthor({ author, compact = false }: { author: PostAuthor; compact?: boolean }) {\n const avatarName = resolveAuthorName(author);\n const { avatar } = author;\n\n return (\n <Inline align=\"center\" gap=\"s\" wrap=\"nowrap\">\n <Avatar\n initials={avatar?.initials}\n label={avatar?.label ?? avatarName}\n name={avatarName}\n shape={avatar?.shape}\n size={avatar?.size ?? (compact ? 's' : 'm')}\n source={avatar?.source}\n tone={avatar?.tone}\n />\n <Box flex={1}>\n <Stack gap=\"xxs\">\n <Text variant=\"bodySmall\" weight=\"semiBold\">\n {author.name}\n </Text>\n {author.subtitle ? (\n <Text tone=\"muted\" variant=\"caption\">\n {author.subtitle}\n </Text>\n ) : null}\n </Stack>\n </Box>\n </Inline>\n );\n}\n\nfunction PostCardMediaItem({ media }: { media: PostCardMedia }) {\n const { theme } = useZoraTheme();\n const aspectRatio = resolveMediaAspectRatio(media.aspectRatio);\n\n if (!('source' in media)) {\n return (\n <Box radius=\"m\" style={{ overflow: 'hidden' }}>\n {media.children}\n </Box>\n );\n }\n\n return (\n <Box bg={theme.semantics.neutral.surface} radius=\"m\" style={{ overflow: 'hidden' }}>\n <Box style={{ aspectRatio, width: '100%' }}>\n <ReactNativeImage\n accessibilityLabel={media.label}\n source={media.source}\n style={{ height: '100%', width: '100%' }}\n />\n </Box>\n </Box>\n );\n}\n\nfunction PostActionLabel({ action }: { action: PostAction }) {\n if (!action.count) {\n return <>{action.label}</>;\n }\n\n return (\n <>\n {action.label} {action.count}\n </>\n );\n}\n\nfunction PostCardActions({ actions }: { actions: readonly PostAction[] }) {\n if (actions.length === 0) {\n return null;\n }\n\n return (\n <Inline align=\"center\" gap=\"s\" wrap=\"wrap\">\n {actions.map((action) => (\n <Button\n key={action.id}\n disabled={action.disabled}\n emphasis={action.selected ? 'soft' : 'ghost'}\n leadingIcon={action.icon}\n onPress={action.onPress}\n size=\"s\"\n tone={action.selected ? 'primary' : 'neutral'}\n >\n <PostActionLabel action={action} />\n </Button>\n ))}\n </Inline>\n );\n}\n\nfunction PostCommentPreviewItem({ comment }: { comment: PostCommentPreview }) {\n return (\n <Inline align=\"flex-start\" gap=\"s\" wrap=\"nowrap\">\n {comment.author ? <PostCardAuthor author={comment.author} compact /> : null}\n <Box flex={1}>\n <Stack gap=\"xxs\">\n <Text variant=\"bodySmall\">{comment.text}</Text>\n {comment.meta ? (\n <Text tone=\"subtle\" variant=\"caption\">\n {comment.meta}\n </Text>\n ) : null}\n {comment.action ? <Box>{comment.action}</Box> : null}\n </Stack>\n </Box>\n </Inline>\n );\n}\n\nfunction PostCardComments({ comments }: { comments: readonly PostCommentPreview[] }) {\n if (comments.length === 0) {\n return null;\n }\n\n return (\n <Stack gap=\"s\">\n {comments.map((comment) => (\n <PostCommentPreviewItem key={comment.id} comment={comment} />\n ))}\n </Stack>\n );\n}\n\nfunction PostCardInner({\n themeId: _themeId,\n mode: _mode,\n testID,\n author,\n text,\n children,\n media,\n actions = [],\n comments = [],\n headerAction,\n footer,\n tone = 'default',\n compact = false,\n onPress,\n}: PostCardProps) {\n const mediaItems = normalizeMedia(media);\n const gap = compact ? 's' : 'm';\n const isInteractive = Boolean(onPress) && !headerAction;\n const hasBody = text != null || children != null || mediaItems.length > 0;\n const hasEngagement = actions.length > 0 || comments.length > 0;\n\n return (\n <Card\n compact={compact}\n onPress={isInteractive ? onPress : undefined}\n testID={testID}\n tone={tone}\n >\n <Stack gap={gap}>\n <Inline align=\"center\" gap=\"m\" justify=\"space-between\" wrap=\"nowrap\">\n <Box flex={1}>\n <PostCardAuthor author={author} compact={compact} />\n </Box>\n {headerAction ? <Box>{headerAction}</Box> : null}\n </Inline>\n\n {hasBody ? (\n <Stack gap={gap}>\n {text ? <Text variant=\"body\">{text}</Text> : null}\n {children ? <Box>{children}</Box> : null}\n {mediaItems.length > 0 ? (\n <Stack gap=\"s\">\n {mediaItems.map((item, index) => (\n <PostCardMediaItem key={`${index}`} media={item} />\n ))}\n </Stack>\n ) : null}\n </Stack>\n ) : null}\n\n {hasEngagement ? <Divider /> : null}\n <PostCardActions actions={actions} />\n <PostCardComments comments={comments} />\n {footer ? <Box pt=\"xs\">{footer}</Box> : null}\n </Stack>\n </Card>\n );\n}\n\nexport const PostCard = withZoraThemeScope(PostCardInner);\n"]}
|
|
1
|
+
{"version":3,"file":"PostCard.js","sourceRoot":"","sources":["../../../src/patterns/post-card/PostCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Image as ReactNativeImage } from 'react-native';\n\nimport { Avatar } from '../../components/avatar';\nimport { Button } from '../../components/button';\nimport { Card } from '../../components/card';\nimport { Text } from '../../components/text';\nimport { Box, Divider, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type {\n PostAction,\n PostAuthor,\n PostCardMedia,\n PostCardProps,\n PostCommentPreview,\n} from './types';\n\nfunction resolveAuthorName(author: PostAuthor): string | undefined {\n return typeof author.name === 'string' ? author.name : author.avatar?.name;\n}\n\nfunction resolveMediaAspectRatio(aspectRatio: number | undefined): number {\n if (aspectRatio === undefined || !Number.isFinite(aspectRatio) || aspectRatio <= 0) {\n return 16 / 9;\n }\n\n return aspectRatio;\n}\n\nfunction isPostCardMediaList(\n media: NonNullable<PostCardProps['media']>,\n): media is readonly PostCardMedia[] {\n return Array.isArray(media);\n}\n\nfunction normalizeMedia(media: PostCardProps['media']): readonly PostCardMedia[] {\n if (!media) {\n return [];\n }\n\n if (isPostCardMediaList(media)) {\n return media;\n }\n\n return [media];\n}\n\nfunction PostCardAuthor({ author, compact = false }: { author: PostAuthor; compact?: boolean }) {\n const avatarName = resolveAuthorName(author);\n const { avatar } = author;\n\n return (\n <Inline align=\"center\" gap=\"s\" wrap=\"nowrap\">\n <Avatar\n initials={avatar?.initials}\n label={avatar?.label ?? avatarName}\n name={avatarName}\n shape={avatar?.shape}\n size={avatar?.size ?? (compact ? 's' : 'm')}\n source={avatar?.source}\n color={avatar?.color}\n />\n <Box flex={1}>\n <Stack gap=\"xxs\">\n <Text variant=\"bodySmall\" weight=\"semiBold\">\n {author.name}\n </Text>\n {author.subtitle ? (\n <Text emphasis=\"muted\" variant=\"caption\">\n {author.subtitle}\n </Text>\n ) : null}\n </Stack>\n </Box>\n </Inline>\n );\n}\n\nfunction PostCardMediaItem({ media }: { media: PostCardMedia }) {\n const { theme } = useZoraTheme();\n const aspectRatio = resolveMediaAspectRatio(media.aspectRatio);\n\n if (!('source' in media)) {\n return (\n <Box radius=\"m\" style={{ overflow: 'hidden' }}>\n {media.children}\n </Box>\n );\n }\n\n return (\n <Box bg={theme.semantics.neutral.surface} radius=\"m\" style={{ overflow: 'hidden' }}>\n <Box style={{ aspectRatio, width: '100%' }}>\n <ReactNativeImage\n accessibilityLabel={media.label}\n source={media.source}\n style={{ height: '100%', width: '100%' }}\n />\n </Box>\n </Box>\n );\n}\n\nfunction PostActionLabel({ action }: { action: PostAction }) {\n if (!action.count) {\n return <>{action.label}</>;\n }\n\n return (\n <>\n {action.label} {action.count}\n </>\n );\n}\n\nfunction PostCardActions({ actions }: { actions: readonly PostAction[] }) {\n if (actions.length === 0) {\n return null;\n }\n\n return (\n <Inline align=\"center\" gap=\"s\" wrap=\"wrap\">\n {actions.map((action) => (\n <Button\n key={action.id}\n disabled={action.disabled}\n variant={action.selected ? 'soft' : 'ghost'}\n leadingIcon={action.icon}\n onPress={action.onPress}\n size=\"s\"\n color={action.selected ? 'primary' : 'neutral'}\n >\n <PostActionLabel action={action} />\n </Button>\n ))}\n </Inline>\n );\n}\n\nfunction PostCommentPreviewItem({ comment }: { comment: PostCommentPreview }) {\n return (\n <Inline align=\"flex-start\" gap=\"s\" wrap=\"nowrap\">\n {comment.author ? <PostCardAuthor author={comment.author} compact /> : null}\n <Box flex={1}>\n <Stack gap=\"xxs\">\n <Text variant=\"bodySmall\">{comment.text}</Text>\n {comment.meta ? (\n <Text emphasis=\"subtle\" variant=\"caption\">\n {comment.meta}\n </Text>\n ) : null}\n {comment.action ? <Box>{comment.action}</Box> : null}\n </Stack>\n </Box>\n </Inline>\n );\n}\n\nfunction PostCardComments({ comments }: { comments: readonly PostCommentPreview[] }) {\n if (comments.length === 0) {\n return null;\n }\n\n return (\n <Stack gap=\"s\">\n {comments.map((comment) => (\n <PostCommentPreviewItem key={comment.id} comment={comment} />\n ))}\n </Stack>\n );\n}\n\nfunction PostCardInner({\n themeId: _themeId,\n mode: _mode,\n testID,\n author,\n text,\n children,\n media,\n actions = [],\n comments = [],\n headerAction,\n footer,\n tone = 'default',\n compact = false,\n onPress,\n}: PostCardProps) {\n const mediaItems = normalizeMedia(media);\n const gap = compact ? 's' : 'm';\n const isInteractive = Boolean(onPress) && !headerAction;\n const hasBody = text != null || children != null || mediaItems.length > 0;\n const hasEngagement = actions.length > 0 || comments.length > 0;\n\n return (\n <Card\n compact={compact}\n onPress={isInteractive ? onPress : undefined}\n testID={testID}\n tone={tone}\n >\n <Stack gap={gap}>\n <Inline align=\"center\" gap=\"m\" justify=\"space-between\" wrap=\"nowrap\">\n <Box flex={1}>\n <PostCardAuthor author={author} compact={compact} />\n </Box>\n {headerAction ? <Box>{headerAction}</Box> : null}\n </Inline>\n\n {hasBody ? (\n <Stack gap={gap}>\n {text ? <Text variant=\"body\">{text}</Text> : null}\n {children ? <Box>{children}</Box> : null}\n {mediaItems.length > 0 ? (\n <Stack gap=\"s\">\n {mediaItems.map((item, index) => (\n <PostCardMediaItem key={`${index}`} media={item} />\n ))}\n </Stack>\n ) : null}\n </Stack>\n ) : null}\n\n {hasEngagement ? <Divider /> : null}\n <PostCardActions actions={actions} />\n <PostCardComments comments={comments} />\n {footer ? <Box pt=\"xs\">{footer}</Box> : null}\n </Stack>\n </Card>\n );\n}\n\nexport const PostCard = withZoraThemeScope(PostCardInner);\n"]}
|
|
@@ -2,7 +2,7 @@ import type { ButtonIconSpec } from '@ankhorage/surface';
|
|
|
2
2
|
import type React from 'react';
|
|
3
3
|
import type { ImageSourcePropType } from 'react-native';
|
|
4
4
|
import type { AvatarShape, AvatarSize } from '../../components/avatar';
|
|
5
|
-
import type { ZoraCardTone,
|
|
5
|
+
import type { ZoraCardTone, ZoraColor } from '../../internal/recipes';
|
|
6
6
|
import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
|
|
7
7
|
export interface PostAuthorAvatar {
|
|
8
8
|
source?: ImageSourcePropType;
|
|
@@ -11,7 +11,7 @@ export interface PostAuthorAvatar {
|
|
|
11
11
|
label?: string;
|
|
12
12
|
size?: AvatarSize;
|
|
13
13
|
shape?: AvatarShape;
|
|
14
|
-
|
|
14
|
+
color?: ZoraColor;
|
|
15
15
|
}
|
|
16
16
|
export interface PostAuthor {
|
|
17
17
|
name: React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EAAE,YAAY,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,gBAAgB;IAC/B,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,gBAAgB,CAAC;CAC3B;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,mBAAmB,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,mBAAmB,CAAC;AAEtE,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,MAAM,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,aAAa,GAAG,SAAS,aAAa,EAAE,CAAC;IACjD,OAAO,CAAC,EAAE,SAAS,UAAU,EAAE,CAAC;IAChC,QAAQ,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACzC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\nimport type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type { ZoraCardTone,
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/post-card/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconSpec } from '@ankhorage/surface';\nimport type React from 'react';\nimport type { ImageSourcePropType } from 'react-native';\n\nimport type { AvatarShape, AvatarSize } from '../../components/avatar';\nimport type { ZoraCardTone, ZoraColor } from '../../internal/recipes';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface PostAuthorAvatar {\n source?: ImageSourcePropType;\n name?: string;\n initials?: string;\n label?: string;\n size?: AvatarSize;\n shape?: AvatarShape;\n color?: ZoraColor;\n}\n\nexport interface PostAuthor {\n name: React.ReactNode;\n subtitle?: React.ReactNode;\n avatar?: PostAuthorAvatar;\n}\n\ninterface PostCardSourceMedia {\n source: ImageSourcePropType;\n label: string;\n aspectRatio?: number;\n children?: never;\n}\n\ninterface PostCardCustomMedia {\n children: React.ReactNode;\n label?: string;\n aspectRatio?: number;\n source?: never;\n}\n\nexport type PostCardMedia = PostCardSourceMedia | PostCardCustomMedia;\n\nexport interface PostAction {\n id: string;\n label: string;\n icon?: ButtonIconSpec;\n count?: React.ReactNode;\n selected?: boolean;\n disabled?: boolean;\n onPress?: () => void;\n}\n\nexport interface PostCommentPreview {\n id: string;\n author?: PostAuthor;\n text: React.ReactNode;\n meta?: React.ReactNode;\n action?: React.ReactNode;\n}\n\nexport interface PostCardProps extends ZoraBaseProps {\n author: PostAuthor;\n text?: React.ReactNode;\n children?: React.ReactNode;\n media?: PostCardMedia | readonly PostCardMedia[];\n actions?: readonly PostAction[];\n comments?: readonly PostCommentPreview[];\n headerAction?: React.ReactNode;\n footer?: React.ReactNode;\n tone?: ZoraCardTone;\n compact?: boolean;\n onPress?: () => void;\n}\n"]}
|
|
@@ -7,11 +7,11 @@ function SectionHeaderInner({ themeId: _themeId, mode: _mode, title, description
|
|
|
7
7
|
return (<Stack align={{ base: 'flex-start', md: 'center' }} direction={{ base: 'column', md: 'row' }} gap="m" justify="space-between" testID={testID}>
|
|
8
8
|
<Box flex={{ md: 1 }} width={{ base: '100%', md: 'auto' }}>
|
|
9
9
|
<Stack gap="xs">
|
|
10
|
-
{eyebrow ? (<Text
|
|
10
|
+
{eyebrow ? (<Text emphasis="muted" variant="caption" weight="semiBold">
|
|
11
11
|
{eyebrow}
|
|
12
12
|
</Text>) : null}
|
|
13
13
|
<Heading level={3}>{title}</Heading>
|
|
14
|
-
{description ? (<Text
|
|
14
|
+
{description ? (<Text emphasis="muted" variant="bodySmall">
|
|
15
15
|
{description}
|
|
16
16
|
</Text>) : null}
|
|
17
17
|
</Stack>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["../../../src/patterns/section-header/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,kBAAkB,CAAC,EAC1B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,GACa;IACnB,OAAO,CACL,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAC5C,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CACzC,GAAG,CAAC,GAAG,CACP,OAAO,CAAC,eAAe,CACvB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,CACxD;QAAA,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;UAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CACT,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["../../../src/patterns/section-header/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,kBAAkB,CAAC,EAC1B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,OAAO,EACP,OAAO,EACP,MAAM,GACa;IACnB,OAAO,CACL,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAC5C,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CACzC,GAAG,CAAC,GAAG,CACP,OAAO,CAAC,eAAe,CACvB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,CACxD;QAAA,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;UAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CACT,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CACxD;cAAA,CAAC,OAAO,CACV;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACR;UAAA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,CACnC;UAAA,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CACxC;cAAA,CAAC,WAAW,CACd;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACV;QAAA,EAAE,KAAK,CACT;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACxC;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,aAAa,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Heading } from '../../components/heading';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SectionHeaderProps } from './types';\n\nfunction SectionHeaderInner({\n themeId: _themeId,\n mode: _mode,\n title,\n description,\n eyebrow,\n actions,\n testID,\n}: SectionHeaderProps) {\n return (\n <Stack\n align={{ base: 'flex-start', md: 'center' }}\n direction={{ base: 'column', md: 'row' }}\n gap=\"m\"\n justify=\"space-between\"\n testID={testID}\n >\n <Box flex={{ md: 1 }} width={{ base: '100%', md: 'auto' }}>\n <Stack gap=\"xs\">\n {eyebrow ? (\n <Text emphasis=\"muted\" variant=\"caption\" weight=\"semiBold\">\n {eyebrow}\n </Text>\n ) : null}\n <Heading level={3}>{title}</Heading>\n {description ? (\n <Text emphasis=\"muted\" variant=\"bodySmall\">\n {description}\n </Text>\n ) : null}\n </Stack>\n </Box>\n {actions ? <Box>{actions}</Box> : null}\n </Stack>\n );\n}\n\nexport const SectionHeader = withZoraThemeScope(SectionHeaderInner);\n"]}
|
|
@@ -9,7 +9,7 @@ function SettingsRowInner({ themeId: _themeId, mode: _mode, title, description,
|
|
|
9
9
|
const isInteractive = Boolean(onPress) && !control;
|
|
10
10
|
return (<Card compact actions={control} description={description} disabled={disabled} onPress={isInteractive ? onPress : undefined} testID={testID} title={title} tone="subtle">
|
|
11
11
|
{meta ? (<Box pt="xs">
|
|
12
|
-
<Text
|
|
12
|
+
<Text emphasis="muted" variant="caption">
|
|
13
13
|
{meta}
|
|
14
14
|
</Text>
|
|
15
15
|
</Box>) : null}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsRow.js","sourceRoot":"","sources":["../../../src/patterns/settings-row/SettingsRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,gBAAgB,CAAC,EACxB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,MAAM,GACW;IACjB,uCAAuC;IACvC,0FAA0F;IAC1F,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;IAEnD,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CACP,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAC7C,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,IAAI,CAAC,CAAC,CAAC,CACN,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CACV;UAAA,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"SettingsRow.js","sourceRoot":"","sources":["../../../src/patterns/settings-row/SettingsRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,gBAAgB,CAAC,EACxB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,MAAM,GACW;IACjB,uCAAuC;IACvC,0FAA0F;IAC1F,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;IAEnD,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CACP,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAC7C,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,CAAC,QAAQ,CAEb;MAAA,CAAC,IAAI,CAAC,CAAC,CAAC,CACN,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CACV;UAAA,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CACtC;YAAA,CAAC,IAAI,CACP;UAAA,EAAE,IAAI,CACR;QAAA,EAAE,GAAG,CAAC,CACP,CAAC,CAAC,CAAC,IAAI,CACV;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Card } from '../../components/card';\nimport { Text } from '../../components/text';\nimport { Box } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SettingsRowProps } from './types';\n\nfunction SettingsRowInner({\n themeId: _themeId,\n mode: _mode,\n title,\n description,\n meta,\n control,\n onPress,\n disabled = false,\n testID,\n}: SettingsRowProps) {\n // Prevent nested interactive elements:\n // If a control is present (likely contains buttons), the row itself must not be clickable\n const isInteractive = Boolean(onPress) && !control;\n\n return (\n <Card\n compact\n actions={control}\n description={description}\n disabled={disabled}\n onPress={isInteractive ? onPress : undefined}\n testID={testID}\n title={title}\n tone=\"subtle\"\n >\n {meta ? (\n <Box pt=\"xs\">\n <Text emphasis=\"muted\" variant=\"caption\">\n {meta}\n </Text>\n </Box>\n ) : null}\n </Card>\n );\n}\n\nexport const SettingsRow = withZoraThemeScope(SettingsRowInner);\n"]}
|
|
@@ -102,13 +102,13 @@ function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeCh
|
|
|
102
102
|
<Stack gap="xs">
|
|
103
103
|
<Text variant="label">Name</Text>
|
|
104
104
|
<Input value={nameInput} onChangeText={handleNameChange} placeholder="My theme" autoCorrect={false} invalid={nameError !== undefined} testID={testID ? `${testID}-name-input` : undefined}/>
|
|
105
|
-
{nameError ? (<Text
|
|
105
|
+
{nameError ? (<Text color="danger" variant="bodySmall">
|
|
106
106
|
{nameError}
|
|
107
107
|
</Text>) : null}
|
|
108
108
|
</Stack>
|
|
109
109
|
<Stack gap="xs">
|
|
110
110
|
<Text variant="label">ID</Text>
|
|
111
|
-
<Text
|
|
111
|
+
<Text emphasis="muted" variant="bodySmall" testID={testID ? `${testID}-id-display` : undefined}>
|
|
112
112
|
{value.id}
|
|
113
113
|
</Text>
|
|
114
114
|
</Stack>
|
|
@@ -134,7 +134,7 @@ function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeCh
|
|
|
134
134
|
borderColor: theme.colors.border,
|
|
135
135
|
}}/>
|
|
136
136
|
</Stack>
|
|
137
|
-
{hexError ? (<Text
|
|
137
|
+
{hexError ? (<Text color="danger" variant="bodySmall">
|
|
138
138
|
{hexError}
|
|
139
139
|
</Text>) : null}
|
|
140
140
|
</Stack>
|
|
@@ -163,41 +163,41 @@ function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeCh
|
|
|
163
163
|
</Stack>
|
|
164
164
|
<Stack gap="xs">
|
|
165
165
|
<Text variant="label">Primary color</Text>
|
|
166
|
-
<Text
|
|
166
|
+
<Text emphasis="muted" variant="bodySmall">
|
|
167
167
|
{value.primaryColor}
|
|
168
168
|
</Text>
|
|
169
169
|
</Stack>
|
|
170
170
|
<Stack gap="xs">
|
|
171
171
|
<Text variant="label">Harmony</Text>
|
|
172
|
-
<Text
|
|
172
|
+
<Text emphasis="muted" variant="bodySmall">
|
|
173
173
|
{value.harmony}
|
|
174
174
|
</Text>
|
|
175
175
|
</Stack>
|
|
176
176
|
<Heading level={4}>Heading</Heading>
|
|
177
177
|
<Text>Body text — this shows default text color and weight.</Text>
|
|
178
|
-
<Text
|
|
178
|
+
<Text emphasis="muted" variant="bodySmall">
|
|
179
179
|
Muted caption text.
|
|
180
180
|
</Text>
|
|
181
181
|
<Stack direction="row" gap="s" align="center">
|
|
182
|
-
<Button
|
|
182
|
+
<Button color="primary" variant="solid" size="m">
|
|
183
183
|
Primary
|
|
184
184
|
</Button>
|
|
185
|
-
<Button
|
|
185
|
+
<Button color="neutral" variant="soft" size="m">
|
|
186
186
|
Neutral
|
|
187
187
|
</Button>
|
|
188
|
-
<Button
|
|
188
|
+
<Button color="danger" variant="ghost" size="m">
|
|
189
189
|
Danger
|
|
190
190
|
</Button>
|
|
191
191
|
</Stack>
|
|
192
192
|
<Stack direction="row" gap="s" align="center">
|
|
193
|
-
<Badge
|
|
194
|
-
<Badge
|
|
193
|
+
<Badge color="primary">Primary</Badge>
|
|
194
|
+
<Badge color="success" variant="soft">
|
|
195
195
|
Success
|
|
196
196
|
</Badge>
|
|
197
|
-
<Badge
|
|
197
|
+
<Badge color="warning" variant="soft">
|
|
198
198
|
Warning
|
|
199
199
|
</Badge>
|
|
200
|
-
<Badge
|
|
200
|
+
<Badge color="danger" variant="soft">
|
|
201
201
|
Danger
|
|
202
202
|
</Badge>
|
|
203
203
|
</Stack>
|
|
@@ -206,7 +206,7 @@ function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeCh
|
|
|
206
206
|
</Card>
|
|
207
207
|
|
|
208
208
|
{/* Submit */}
|
|
209
|
-
{onSubmit ? (<Button
|
|
209
|
+
{onSubmit ? (<Button color="primary" variant="solid" onPress={handleSubmit} testID={testID ? `${testID}-submit` : undefined}>
|
|
210
210
|
Apply theme
|
|
211
211
|
</Button>) : null}
|
|
212
212
|
</Stack>);
|