@ankhorage/zora 1.0.0 → 1.0.2
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 +34 -0
- package/README.md +16 -9
- package/dist/components/card/Card.d.ts.map +1 -1
- package/dist/components/card/Card.js +2 -1
- package/dist/components/card/Card.js.map +1 -1
- package/dist/components/checkbox/CheckboxGroup.d.ts.map +1 -1
- package/dist/components/checkbox/CheckboxGroup.js +2 -1
- package/dist/components/checkbox/CheckboxGroup.js.map +1 -1
- package/dist/components/drawer/Drawer.d.ts.map +1 -1
- package/dist/components/drawer/Drawer.js +2 -1
- package/dist/components/drawer/Drawer.js.map +1 -1
- package/dist/components/form/Form.d.ts.map +1 -1
- package/dist/components/form/Form.js +1 -1
- package/dist/components/form/Form.js.map +1 -1
- package/dist/components/form/FormActions.d.ts.map +1 -1
- package/dist/components/form/FormActions.js +1 -1
- package/dist/components/form/FormActions.js.map +1 -1
- package/dist/components/form/FormError.d.ts.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.d.ts.map +1 -1
- package/dist/components/form/FormField.js +2 -1
- package/dist/components/form/FormField.js.map +1 -1
- package/dist/components/modal/Modal.d.ts.map +1 -1
- package/dist/components/modal/Modal.js +2 -1
- package/dist/components/modal/Modal.js.map +1 -1
- package/dist/components/radio/RadioGroup.d.ts.map +1 -1
- package/dist/components/radio/RadioGroup.js +2 -1
- package/dist/components/radio/RadioGroup.js.map +1 -1
- package/dist/components/select/Select.d.ts.map +1 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/select/Select.js.map +1 -1
- package/dist/components/tabs/Tabs.d.ts.map +1 -1
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/tabs/Tabs.js.map +1 -1
- package/dist/components/toolbar/Toolbar.d.ts.map +1 -1
- package/dist/components/toolbar/Toolbar.js +1 -1
- package/dist/components/toolbar/Toolbar.js.map +1 -1
- package/dist/layout/app-shell/AppShell.d.ts.map +1 -1
- package/dist/layout/app-shell/AppShell.js +1 -1
- package/dist/layout/app-shell/AppShell.js.map +1 -1
- package/dist/layout/auth-layout/AuthLayout.d.ts.map +1 -1
- package/dist/layout/auth-layout/AuthLayout.js +1 -1
- package/dist/layout/auth-layout/AuthLayout.js.map +1 -1
- package/dist/layout/page/Page.d.ts.map +1 -1
- package/dist/layout/page/Page.js +1 -1
- package/dist/layout/page/Page.js.map +1 -1
- package/dist/layout/page-header/PageHeader.d.ts.map +1 -1
- package/dist/layout/page-header/PageHeader.js +1 -1
- package/dist/layout/page-header/PageHeader.js.map +1 -1
- package/dist/layout/page-section/PageSection.d.ts.map +1 -1
- package/dist/layout/page-section/PageSection.js +1 -1
- package/dist/layout/page-section/PageSection.js.map +1 -1
- package/dist/layout/sidebar-layout/SidebarLayout.d.ts.map +1 -1
- package/dist/layout/sidebar-layout/SidebarLayout.js +1 -1
- package/dist/layout/sidebar-layout/SidebarLayout.js.map +1 -1
- package/dist/layout/topbar-layout/TopbarLayout.d.ts.map +1 -1
- package/dist/layout/topbar-layout/TopbarLayout.js +1 -1
- package/dist/layout/topbar-layout/TopbarLayout.js.map +1 -1
- package/dist/patterns/auth/ForgotPasswordForm.d.ts.map +1 -1
- package/dist/patterns/auth/ForgotPasswordForm.js +1 -1
- package/dist/patterns/auth/ForgotPasswordForm.js.map +1 -1
- package/dist/patterns/auth/OtpForm.d.ts.map +1 -1
- package/dist/patterns/auth/OtpForm.js +1 -1
- package/dist/patterns/auth/OtpForm.js.map +1 -1
- package/dist/patterns/auth/SignInForm.d.ts.map +1 -1
- package/dist/patterns/auth/SignInForm.js +1 -1
- package/dist/patterns/auth/SignInForm.js.map +1 -1
- package/dist/patterns/auth/SignUpForm.d.ts.map +1 -1
- package/dist/patterns/auth/SignUpForm.js +1 -1
- package/dist/patterns/auth/SignUpForm.js.map +1 -1
- package/dist/patterns/collection-editor/CollectionEditor.d.ts.map +1 -1
- package/dist/patterns/collection-editor/CollectionEditor.js +1 -1
- package/dist/patterns/collection-editor/CollectionEditor.js.map +1 -1
- package/dist/patterns/confirm-dialog/ConfirmDialog.d.ts.map +1 -1
- package/dist/patterns/confirm-dialog/ConfirmDialog.js +1 -1
- package/dist/patterns/confirm-dialog/ConfirmDialog.js.map +1 -1
- package/dist/patterns/disclosure-section/DisclosureSection.d.ts.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.d.ts.map +1 -1
- package/dist/patterns/empty-state/EmptyState.js +1 -1
- package/dist/patterns/empty-state/EmptyState.js.map +1 -1
- package/dist/patterns/form-field/FormField.d.ts.map +1 -1
- package/dist/patterns/form-field/FormField.js +2 -1
- package/dist/patterns/form-field/FormField.js.map +1 -1
- package/dist/patterns/inspector-field/InspectorField.d.ts.map +1 -1
- package/dist/patterns/inspector-field/InspectorField.js +1 -1
- package/dist/patterns/inspector-field/InspectorField.js.map +1 -1
- package/dist/patterns/notice/Notice.d.ts.map +1 -1
- package/dist/patterns/notice/Notice.js +1 -1
- package/dist/patterns/notice/Notice.js.map +1 -1
- package/dist/patterns/section-header/SectionHeader.d.ts.map +1 -1
- package/dist/patterns/section-header/SectionHeader.js +1 -1
- package/dist/patterns/section-header/SectionHeader.js.map +1 -1
- package/dist/patterns/settings-row/SettingsRow.d.ts.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.d.ts.map +1 -1
- package/dist/patterns/theme-composer/ThemeComposer.js +98 -6
- package/dist/patterns/theme-composer/ThemeComposer.js.map +1 -1
- package/dist/patterns/theme-composer/types.d.ts +2 -0
- package/dist/patterns/theme-composer/types.d.ts.map +1 -1
- package/dist/patterns/theme-composer/types.js.map +1 -1
- package/dist/patterns/tile-grid/PaletteItem.d.ts.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/tile-grid/TileGrid.d.ts.map +1 -1
- package/dist/patterns/tile-grid/TileGrid.js +1 -1
- package/dist/patterns/tile-grid/TileGrid.js.map +1 -1
- package/dist/patterns/tree-view/TreeItem.d.ts.map +1 -1
- package/dist/patterns/tree-view/TreeItem.js +1 -1
- package/dist/patterns/tree-view/TreeItem.js.map +1 -1
- package/dist/patterns/tree-view/TreeView.d.ts.map +1 -1
- package/dist/patterns/tree-view/TreeView.js +1 -1
- package/dist/patterns/tree-view/TreeView.js.map +1 -1
- package/package.json +1 -1
- package/src/audit.test.ts +242 -0
- package/src/components/card/Card.tsx +2 -1
- package/src/components/checkbox/CheckboxGroup.tsx +2 -1
- package/src/components/drawer/Drawer.tsx +2 -1
- package/src/components/form/Form.tsx +1 -1
- package/src/components/form/FormActions.tsx +1 -1
- package/src/components/form/FormError.tsx +1 -1
- package/src/components/form/FormField.tsx +2 -1
- package/src/components/modal/Modal.tsx +2 -1
- package/src/components/radio/RadioGroup.tsx +2 -1
- package/src/components/select/Select.tsx +1 -1
- package/src/components/tabs/Tabs.tsx +1 -1
- package/src/components/toolbar/Toolbar.tsx +1 -1
- package/src/layout/app-shell/AppShell.tsx +1 -1
- package/src/layout/auth-layout/AuthLayout.tsx +1 -1
- package/src/layout/page/Page.tsx +1 -1
- package/src/layout/page-header/PageHeader.tsx +1 -1
- package/src/layout/page-section/PageSection.tsx +1 -1
- package/src/layout/sidebar-layout/SidebarLayout.tsx +1 -1
- package/src/layout/topbar-layout/TopbarLayout.tsx +1 -1
- package/src/patterns/auth/ForgotPasswordForm.tsx +1 -1
- package/src/patterns/auth/OtpForm.tsx +1 -1
- package/src/patterns/auth/SignInForm.tsx +1 -1
- package/src/patterns/auth/SignUpForm.tsx +1 -1
- package/src/patterns/collection-editor/CollectionEditor.tsx +1 -1
- package/src/patterns/confirm-dialog/ConfirmDialog.tsx +1 -1
- package/src/patterns/disclosure-section/DisclosureSection.tsx +1 -1
- package/src/patterns/empty-state/EmptyState.tsx +1 -1
- package/src/patterns/form-field/FormField.tsx +2 -1
- package/src/patterns/inspector-field/InspectorField.tsx +1 -1
- package/src/patterns/notice/Notice.tsx +1 -1
- package/src/patterns/section-header/SectionHeader.tsx +1 -1
- package/src/patterns/settings-row/SettingsRow.tsx +1 -1
- package/src/patterns/theme-composer/ThemeComposer.test.ts +148 -2
- package/src/patterns/theme-composer/ThemeComposer.tsx +129 -5
- package/src/patterns/theme-composer/types.ts +3 -0
- package/src/patterns/tile-grid/PaletteItem.tsx +1 -1
- package/src/patterns/tile-grid/TileGrid.tsx +1 -1
- package/src/patterns/tree-view/TreeItem.tsx +1 -1
- package/src/patterns/tree-view/TreeView.tsx +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { Box, Stack } from '@ankhorage/surface';
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import { Badge } from '../../components/badge';
|
|
4
3
|
import { Card } from '../../components/card';
|
|
4
|
+
import { Box, Stack } from '../../foundation';
|
|
5
5
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
6
6
|
function NoticeInner({ themeId: _themeId, mode: _mode, title, description, children, actions, tone = 'primary', testID, }) {
|
|
7
7
|
return (<Card description={description} eyebrow={<Badge tone={tone}>{String(tone).toUpperCase()}</Badge>} testID={testID} title={title} tone="subtle">
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Notice.js","sourceRoot":"","sources":["../../../src/patterns/notice/Notice.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
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,IAAI,GAAG,SAAS,EAChB,MAAM,GACM;IACZ,OAAO,CACL,CAAC,IAAI,CACH,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CACjE,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 tone = 'primary',\n testID,\n}: NoticeProps) {\n return (\n <Card\n description={description}\n eyebrow={<Badge tone={tone}>{String(tone).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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SectionHeader.d.ts","sourceRoot":"","sources":["../../../src/patterns/section-header/SectionHeader.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SectionHeader.d.ts","sourceRoot":"","sources":["../../../src/patterns/section-header/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAuClD,eAAO,MAAM,aAAa,0DAAyC,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { Box, Stack } from '@ankhorage/surface';
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import { Heading } from '../../components/heading';
|
|
4
3
|
import { Text } from '../../components/text';
|
|
4
|
+
import { Box, Stack } from '../../foundation';
|
|
5
5
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
6
6
|
function SectionHeaderInner({ themeId: _themeId, mode: _mode, title, description, eyebrow, actions, testID, }) {
|
|
7
7
|
return (<Stack align={{ base: 'flex-start', md: 'center' }} direction={{ base: 'column', md: 'row' }} gap="m" justify="space-between" testID={testID}>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SectionHeader.js","sourceRoot":"","sources":["../../../src/patterns/section-header/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
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,CAAC,CAAC,CACX;QAAA,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CACb;UAAA,CAAC,OAAO,CAAC,CAAC,CAAC,CACT,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CACpD;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,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CACpC;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={1}>\n <Stack gap=\"xs\">\n {eyebrow ? (\n <Text tone=\"muted\" variant=\"caption\" weight=\"semiBold\">\n {eyebrow}\n </Text>\n ) : null}\n <Heading level={3}>{title}</Heading>\n {description ? (\n <Text tone=\"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"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsRow.d.ts","sourceRoot":"","sources":["../../../src/patterns/settings-row/SettingsRow.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SettingsRow.d.ts","sourceRoot":"","sources":["../../../src/patterns/settings-row/SettingsRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAuChD,eAAO,MAAM,WAAW,wDAAuC,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { Box } from '@ankhorage/surface';
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import { Card } from '../../components/card';
|
|
4
3
|
import { Text } from '../../components/text';
|
|
4
|
+
import { Box } from '../../foundation';
|
|
5
5
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
6
6
|
function SettingsRowInner({ themeId: _themeId, mode: _mode, title, description, meta, control, onPress, disabled = false, testID, }) {
|
|
7
7
|
// Prevent nested interactive elements:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsRow.js","sourceRoot":"","sources":["../../../src/patterns/settings-row/SettingsRow.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
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,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAClC;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 tone=\"muted\" variant=\"caption\">\n {meta}\n </Text>\n </Box>\n ) : null}\n </Card>\n );\n}\n\nexport const SettingsRow = withZoraThemeScope(SettingsRowInner);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeComposer.d.ts","sourceRoot":"","sources":["../../../src/patterns/theme-composer/ThemeComposer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ThemeComposer.d.ts","sourceRoot":"","sources":["../../../src/patterns/theme-composer/ThemeComposer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAoSlD,eAAO,MAAM,aAAa,0DAAyC,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { COLOR_HARMONIES, parseHexColorOrThrow } from '@ankhorage/color-theory';
|
|
2
|
-
import {
|
|
2
|
+
import { APP_CATEGORIES } from '@ankhorage/contracts';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import { Badge } from '../../components/badge';
|
|
5
5
|
import { Button } from '../../components/button';
|
|
@@ -9,8 +9,12 @@ import { Input } from '../../components/input';
|
|
|
9
9
|
import { Select } from '../../components/select';
|
|
10
10
|
import { Tabs } from '../../components/tabs';
|
|
11
11
|
import { Text } from '../../components/text';
|
|
12
|
+
import { Box, Stack } from '../../foundation';
|
|
12
13
|
import { useZoraTheme } from '../../theme/useZoraTheme';
|
|
13
14
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
15
|
+
const HEX_ERROR_MESSAGE = 'Enter a valid 6-digit hex color.';
|
|
16
|
+
const HEX_INPUT_PLACEHOLDER = 'Enter hex color';
|
|
17
|
+
const NAME_ERROR_MESSAGE = 'Theme name cannot be empty.';
|
|
14
18
|
function isValidHex(value) {
|
|
15
19
|
try {
|
|
16
20
|
parseHexColorOrThrow(value);
|
|
@@ -20,20 +24,42 @@ function isValidHex(value) {
|
|
|
20
24
|
return false;
|
|
21
25
|
}
|
|
22
26
|
}
|
|
27
|
+
function formatAppCategoryLabel(category) {
|
|
28
|
+
return category
|
|
29
|
+
.split('_')
|
|
30
|
+
.map((part) => part.charAt(0).toUpperCase() + part.slice(1))
|
|
31
|
+
.join(' ');
|
|
32
|
+
}
|
|
23
33
|
const HARMONY_OPTIONS = COLOR_HARMONIES.map((h) => ({ value: h, label: h }));
|
|
24
34
|
const MODE_TABS = [
|
|
25
35
|
{ value: 'light', label: 'Light' },
|
|
26
36
|
{ value: 'dark', label: 'Dark' },
|
|
27
37
|
];
|
|
28
|
-
function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeChange, onSubmit, testID, }) {
|
|
38
|
+
function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeChange, onSubmit, appCategories, testID, }) {
|
|
29
39
|
const { theme } = useZoraTheme();
|
|
30
40
|
const [hexInput, setHexInput] = React.useState(value.primaryColor);
|
|
31
41
|
const [hexError, setHexError] = React.useState(undefined);
|
|
32
|
-
|
|
42
|
+
const [nameInput, setNameInput] = React.useState(value.name);
|
|
43
|
+
const [nameError, setNameError] = React.useState(undefined);
|
|
44
|
+
// Keep local inputs in sync when value changes externally
|
|
33
45
|
React.useEffect(() => {
|
|
34
46
|
setHexInput(value.primaryColor);
|
|
35
47
|
setHexError(undefined);
|
|
36
48
|
}, [value.primaryColor]);
|
|
49
|
+
React.useEffect(() => {
|
|
50
|
+
setNameInput(value.name);
|
|
51
|
+
setNameError(undefined);
|
|
52
|
+
}, [value.name]);
|
|
53
|
+
function handleNameChange(text) {
|
|
54
|
+
setNameInput(text);
|
|
55
|
+
if (text.trim().length === 0) {
|
|
56
|
+
setNameError(NAME_ERROR_MESSAGE);
|
|
57
|
+
}
|
|
58
|
+
else {
|
|
59
|
+
setNameError(undefined);
|
|
60
|
+
onChange({ ...value, name: text });
|
|
61
|
+
}
|
|
62
|
+
}
|
|
37
63
|
function handleHexChange(text) {
|
|
38
64
|
// Ensure leading hash
|
|
39
65
|
const normalized = text.startsWith('#') ? text : `#${text}`;
|
|
@@ -43,17 +69,63 @@ function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeCh
|
|
|
43
69
|
onChange({ ...value, primaryColor: normalized });
|
|
44
70
|
}
|
|
45
71
|
else {
|
|
46
|
-
setHexError(
|
|
72
|
+
setHexError(HEX_ERROR_MESSAGE);
|
|
47
73
|
}
|
|
48
74
|
}
|
|
75
|
+
function handleSubmit() {
|
|
76
|
+
const hasValidName = nameInput.trim().length > 0;
|
|
77
|
+
const hasValidHex = isValidHex(hexInput);
|
|
78
|
+
if (!hasValidName) {
|
|
79
|
+
setNameError(NAME_ERROR_MESSAGE);
|
|
80
|
+
}
|
|
81
|
+
if (!hasValidHex) {
|
|
82
|
+
setHexError(HEX_ERROR_MESSAGE);
|
|
83
|
+
}
|
|
84
|
+
if (!hasValidName || !hasValidHex) {
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
onSubmit?.({
|
|
88
|
+
...value,
|
|
89
|
+
name: nameInput,
|
|
90
|
+
primaryColor: hexInput,
|
|
91
|
+
});
|
|
92
|
+
}
|
|
49
93
|
const activeMode = mode ?? 'light';
|
|
94
|
+
const categoryOptions = (appCategories ?? APP_CATEGORIES).map((c) => ({
|
|
95
|
+
value: c,
|
|
96
|
+
label: formatAppCategoryLabel(c),
|
|
97
|
+
}));
|
|
50
98
|
return (<Stack gap="l" testID={testID}>
|
|
99
|
+
{/* Section: Theme identity */}
|
|
100
|
+
<Card title="Theme identity" description="Name your theme. The ID is assigned automatically and shown for reference.">
|
|
101
|
+
<Stack gap="m">
|
|
102
|
+
<Stack gap="xs">
|
|
103
|
+
<Text variant="label">Name</Text>
|
|
104
|
+
<Input value={nameInput} onChangeText={handleNameChange} placeholder="My theme" autoCorrect={false} invalid={nameError !== undefined} testID={testID ? `${testID}-name-input` : undefined}/>
|
|
105
|
+
{nameError ? (<Text tone="danger" variant="bodySmall">
|
|
106
|
+
{nameError}
|
|
107
|
+
</Text>) : null}
|
|
108
|
+
</Stack>
|
|
109
|
+
<Stack gap="xs">
|
|
110
|
+
<Text variant="label">ID</Text>
|
|
111
|
+
<Text tone="muted" variant="bodySmall" testID={testID ? `${testID}-id-display` : undefined}>
|
|
112
|
+
{value.id}
|
|
113
|
+
</Text>
|
|
114
|
+
</Stack>
|
|
115
|
+
</Stack>
|
|
116
|
+
</Card>
|
|
117
|
+
|
|
118
|
+
{/* Section: App category */}
|
|
119
|
+
<Card title="App category" description="Choose the category that best describes this app.">
|
|
120
|
+
<Select value={value.appCategory} options={categoryOptions} onValueChange={(c) => onChange({ ...value, appCategory: c })} testID={testID ? `${testID}-category-select` : undefined}/>
|
|
121
|
+
</Card>
|
|
122
|
+
|
|
51
123
|
{/* Section: Primary Color */}
|
|
52
124
|
<Card title="Primary color" description="Set the seed color for your theme palette.">
|
|
53
125
|
<Stack gap="m">
|
|
54
126
|
<Stack direction="row" gap="m" align="center">
|
|
55
127
|
<Box flex={1}>
|
|
56
|
-
<Input value={hexInput} onChangeText={handleHexChange} placeholder=
|
|
128
|
+
<Input value={hexInput} onChangeText={handleHexChange} placeholder={HEX_INPUT_PLACEHOLDER} autoCapitalize="none" autoCorrect={false} maxLength={7} invalid={hexError !== undefined} testID={testID ? `${testID}-hex-input` : undefined}/>
|
|
57
129
|
</Box>
|
|
58
130
|
{/* Color preview chip */}
|
|
59
131
|
<Box width={36} height={36} radius="m" style={{
|
|
@@ -81,6 +153,26 @@ function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeCh
|
|
|
81
153
|
{/* Section: Preview */}
|
|
82
154
|
<Card title="Preview" description="A quick look at how your theme renders common controls.">
|
|
83
155
|
<Stack gap="m">
|
|
156
|
+
<Stack gap="xs">
|
|
157
|
+
<Text variant="label">Name</Text>
|
|
158
|
+
<Text>{value.name}</Text>
|
|
159
|
+
</Stack>
|
|
160
|
+
<Stack gap="xs">
|
|
161
|
+
<Text variant="label">Category</Text>
|
|
162
|
+
<Text>{formatAppCategoryLabel(value.appCategory)}</Text>
|
|
163
|
+
</Stack>
|
|
164
|
+
<Stack gap="xs">
|
|
165
|
+
<Text variant="label">Primary color</Text>
|
|
166
|
+
<Text tone="muted" variant="bodySmall">
|
|
167
|
+
{value.primaryColor}
|
|
168
|
+
</Text>
|
|
169
|
+
</Stack>
|
|
170
|
+
<Stack gap="xs">
|
|
171
|
+
<Text variant="label">Harmony</Text>
|
|
172
|
+
<Text tone="muted" variant="bodySmall">
|
|
173
|
+
{value.harmony}
|
|
174
|
+
</Text>
|
|
175
|
+
</Stack>
|
|
84
176
|
<Heading level={4}>Heading</Heading>
|
|
85
177
|
<Text>Body text — this shows default text color and weight.</Text>
|
|
86
178
|
<Text tone="muted" variant="bodySmall">
|
|
@@ -114,7 +206,7 @@ function ThemeComposerInner({ themeId: _themeId, value, onChange, mode, onModeCh
|
|
|
114
206
|
</Card>
|
|
115
207
|
|
|
116
208
|
{/* Submit */}
|
|
117
|
-
{onSubmit ? (<Button tone="primary" emphasis="solid" onPress={
|
|
209
|
+
{onSubmit ? (<Button tone="primary" emphasis="solid" onPress={handleSubmit} testID={testID ? `${testID}-submit` : undefined}>
|
|
118
210
|
Apply theme
|
|
119
211
|
</Button>) : null}
|
|
120
212
|
</Stack>);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeComposer.js","sourceRoot":"","sources":["../../../src/patterns/theme-composer/ThemeComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { COLOR_HARMONIES, parseHexColorOrThrow } from '@ankhorage/color-theory';\nimport { Box, Stack } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Badge } from '../../components/badge';\nimport { Button } from '../../components/button';\nimport { Card } from '../../components/card';\nimport { Heading } from '../../components/heading';\nimport { Input } from '../../components/input';\nimport { Select } from '../../components/select';\nimport { Tabs } from '../../components/tabs';\nimport { Text } from '../../components/text';\nimport type { ZoraThemeMode } from '../../theme/types';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ThemeComposerProps } from './types';\n\nfunction isValidHex(value: string): boolean {\n try {\n parseHexColorOrThrow(value);\n return true;\n } catch {\n return false;\n }\n}\n\nconst HARMONY_OPTIONS = COLOR_HARMONIES.map((h) => ({ value: h, label: h }));\n\nconst MODE_TABS = [\n { value: 'light' as ZoraThemeMode, label: 'Light' },\n { value: 'dark' as ZoraThemeMode, label: 'Dark' },\n];\n\nfunction ThemeComposerInner({\n themeId: _themeId,\n value,\n onChange,\n mode,\n onModeChange,\n onSubmit,\n testID,\n}: ThemeComposerProps) {\n const { theme } = useZoraTheme();\n\n const [hexInput, setHexInput] = React.useState<string>(value.primaryColor);\n const [hexError, setHexError] = React.useState<string | undefined>(undefined);\n\n // Keep local hex input in sync when value.primaryColor changes externally\n React.useEffect(() => {\n setHexInput(value.primaryColor);\n setHexError(undefined);\n }, [value.primaryColor]);\n\n function handleHexChange(text: string) {\n // Ensure leading hash\n const normalized = text.startsWith('#') ? text : `#${text}`;\n setHexInput(normalized);\n\n if (isValidHex(normalized)) {\n setHexError(undefined);\n onChange({ ...value, primaryColor: normalized });\n } else {\n setHexError('Enter a valid 6-digit hex color (e.g. #0f766e).');\n }\n }\n\n const activeMode = mode ?? 'light';\n\n return (\n <Stack gap=\"l\" testID={testID}>\n {/* Section: Primary Color */}\n <Card title=\"Primary color\" description=\"Set the seed color for your theme palette.\">\n <Stack gap=\"m\">\n <Stack direction=\"row\" gap=\"m\" align=\"center\">\n <Box flex={1}>\n <Input\n value={hexInput}\n onChangeText={handleHexChange}\n placeholder=\"#0f766e\"\n autoCapitalize=\"none\"\n autoCorrect={false}\n maxLength={7}\n invalid={hexError !== undefined}\n testID={testID ? `${testID}-hex-input` : undefined}\n />\n </Box>\n {/* Color preview chip */}\n <Box\n width={36}\n height={36}\n radius=\"m\"\n style={{\n backgroundColor: isValidHex(hexInput) ? hexInput : theme.colors.border,\n borderWidth: 1,\n borderColor: theme.colors.border,\n }}\n />\n </Stack>\n {hexError ? (\n <Text tone=\"danger\" variant=\"bodySmall\">\n {hexError}\n </Text>\n ) : null}\n </Stack>\n </Card>\n\n {/* Section: Harmony */}\n <Card\n title=\"Harmony\"\n description=\"Choose how accent hues are generated from your primary color.\"\n >\n <Select\n value={value.harmony}\n options={HARMONY_OPTIONS}\n onValueChange={(h) => onChange({ ...value, harmony: h })}\n testID={testID ? `${testID}-harmony-select` : undefined}\n />\n </Card>\n\n {/* Section: Mode */}\n <Card title=\"Mode\" description=\"Switch between light and dark presentation.\">\n <Tabs\n value={activeMode}\n items={MODE_TABS}\n onValueChange={(m) => onModeChange?.(m)}\n variant=\"segmented\"\n testID={testID ? `${testID}-mode-tabs` : undefined}\n />\n </Card>\n\n {/* Section: Preview */}\n <Card title=\"Preview\" description=\"A quick look at how your theme renders common controls.\">\n <Stack gap=\"m\">\n <Heading level={4}>Heading</Heading>\n <Text>Body text — this shows default text color and weight.</Text>\n <Text tone=\"muted\" variant=\"bodySmall\">\n Muted caption text.\n </Text>\n <Stack direction=\"row\" gap=\"s\" align=\"center\">\n <Button tone=\"primary\" emphasis=\"solid\" size=\"m\">\n Primary\n </Button>\n <Button tone=\"neutral\" emphasis=\"soft\" size=\"m\">\n Neutral\n </Button>\n <Button tone=\"danger\" emphasis=\"ghost\" size=\"m\">\n Danger\n </Button>\n </Stack>\n <Stack direction=\"row\" gap=\"s\" align=\"center\">\n <Badge tone=\"primary\">Primary</Badge>\n <Badge tone=\"success\" emphasis=\"soft\">\n Success\n </Badge>\n <Badge tone=\"warning\" emphasis=\"soft\">\n Warning\n </Badge>\n <Badge tone=\"danger\" emphasis=\"soft\">\n Danger\n </Badge>\n </Stack>\n <Card\n tone=\"subtle\"\n title=\"Nested card\"\n description=\"Subtle tone inside the preview.\"\n compact\n />\n </Stack>\n </Card>\n\n {/* Submit */}\n {onSubmit ? (\n <Button\n tone=\"primary\"\n emphasis=\"solid\"\n onPress={() => onSubmit(value)}\n testID={testID ? `${testID}-submit` : undefined}\n >\n Apply theme\n </Button>\n ) : null}\n </Stack>\n );\n}\n\nexport const ThemeComposer = withZoraThemeScope(ThemeComposerInner);\n"]}
|
|
1
|
+
{"version":3,"file":"ThemeComposer.js","sourceRoot":"","sources":["../../../src/patterns/theme-composer/ThemeComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { COLOR_HARMONIES, parseHexColorOrThrow } from '@ankhorage/color-theory';\nimport type { AppCategory } from '@ankhorage/contracts';\nimport { APP_CATEGORIES } from '@ankhorage/contracts';\nimport React from 'react';\n\nimport { Badge } from '../../components/badge';\nimport { Button } from '../../components/button';\nimport { Card } from '../../components/card';\nimport { Heading } from '../../components/heading';\nimport { Input } from '../../components/input';\nimport { Select } from '../../components/select';\nimport { Tabs } from '../../components/tabs';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport type { ZoraThemeMode } from '../../theme/types';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ThemeComposerProps } from './types';\n\nconst HEX_ERROR_MESSAGE = 'Enter a valid 6-digit hex color.';\nconst HEX_INPUT_PLACEHOLDER = 'Enter hex color';\nconst NAME_ERROR_MESSAGE = 'Theme name cannot be empty.';\n\nfunction isValidHex(value: string): boolean {\n try {\n parseHexColorOrThrow(value);\n return true;\n } catch {\n return false;\n }\n}\n\nfunction formatAppCategoryLabel(category: AppCategory): string {\n return category\n .split('_')\n .map((part) => part.charAt(0).toUpperCase() + part.slice(1))\n .join(' ');\n}\n\nconst HARMONY_OPTIONS = COLOR_HARMONIES.map((h) => ({ value: h, label: h }));\n\nconst MODE_TABS = [\n { value: 'light' as ZoraThemeMode, label: 'Light' },\n { value: 'dark' as ZoraThemeMode, label: 'Dark' },\n];\n\nfunction ThemeComposerInner({\n themeId: _themeId,\n value,\n onChange,\n mode,\n onModeChange,\n onSubmit,\n appCategories,\n testID,\n}: ThemeComposerProps) {\n const { theme } = useZoraTheme();\n\n const [hexInput, setHexInput] = React.useState<string>(value.primaryColor);\n const [hexError, setHexError] = React.useState<string | undefined>(undefined);\n\n const [nameInput, setNameInput] = React.useState<string>(value.name);\n const [nameError, setNameError] = React.useState<string | undefined>(undefined);\n\n // Keep local inputs in sync when value changes externally\n React.useEffect(() => {\n setHexInput(value.primaryColor);\n setHexError(undefined);\n }, [value.primaryColor]);\n\n React.useEffect(() => {\n setNameInput(value.name);\n setNameError(undefined);\n }, [value.name]);\n\n function handleNameChange(text: string) {\n setNameInput(text);\n if (text.trim().length === 0) {\n setNameError(NAME_ERROR_MESSAGE);\n } else {\n setNameError(undefined);\n onChange({ ...value, name: text });\n }\n }\n\n function handleHexChange(text: string) {\n // Ensure leading hash\n const normalized = text.startsWith('#') ? text : `#${text}`;\n setHexInput(normalized);\n\n if (isValidHex(normalized)) {\n setHexError(undefined);\n onChange({ ...value, primaryColor: normalized });\n } else {\n setHexError(HEX_ERROR_MESSAGE);\n }\n }\n\n function handleSubmit() {\n const hasValidName = nameInput.trim().length > 0;\n const hasValidHex = isValidHex(hexInput);\n\n if (!hasValidName) {\n setNameError(NAME_ERROR_MESSAGE);\n }\n\n if (!hasValidHex) {\n setHexError(HEX_ERROR_MESSAGE);\n }\n\n if (!hasValidName || !hasValidHex) {\n return;\n }\n\n onSubmit?.({\n ...value,\n name: nameInput,\n primaryColor: hexInput,\n });\n }\n\n const activeMode = mode ?? 'light';\n const categoryOptions = (appCategories ?? APP_CATEGORIES).map((c) => ({\n value: c,\n label: formatAppCategoryLabel(c),\n }));\n\n return (\n <Stack gap=\"l\" testID={testID}>\n {/* Section: Theme identity */}\n <Card\n title=\"Theme identity\"\n description=\"Name your theme. The ID is assigned automatically and shown for reference.\"\n >\n <Stack gap=\"m\">\n <Stack gap=\"xs\">\n <Text variant=\"label\">Name</Text>\n <Input\n value={nameInput}\n onChangeText={handleNameChange}\n placeholder=\"My theme\"\n autoCorrect={false}\n invalid={nameError !== undefined}\n testID={testID ? `${testID}-name-input` : undefined}\n />\n {nameError ? (\n <Text tone=\"danger\" variant=\"bodySmall\">\n {nameError}\n </Text>\n ) : null}\n </Stack>\n <Stack gap=\"xs\">\n <Text variant=\"label\">ID</Text>\n <Text\n tone=\"muted\"\n variant=\"bodySmall\"\n testID={testID ? `${testID}-id-display` : undefined}\n >\n {value.id}\n </Text>\n </Stack>\n </Stack>\n </Card>\n\n {/* Section: App category */}\n <Card title=\"App category\" description=\"Choose the category that best describes this app.\">\n <Select\n value={value.appCategory}\n options={categoryOptions}\n onValueChange={(c) => onChange({ ...value, appCategory: c })}\n testID={testID ? `${testID}-category-select` : undefined}\n />\n </Card>\n\n {/* Section: Primary Color */}\n <Card title=\"Primary color\" description=\"Set the seed color for your theme palette.\">\n <Stack gap=\"m\">\n <Stack direction=\"row\" gap=\"m\" align=\"center\">\n <Box flex={1}>\n <Input\n value={hexInput}\n onChangeText={handleHexChange}\n placeholder={HEX_INPUT_PLACEHOLDER}\n autoCapitalize=\"none\"\n autoCorrect={false}\n maxLength={7}\n invalid={hexError !== undefined}\n testID={testID ? `${testID}-hex-input` : undefined}\n />\n </Box>\n {/* Color preview chip */}\n <Box\n width={36}\n height={36}\n radius=\"m\"\n style={{\n backgroundColor: isValidHex(hexInput) ? hexInput : theme.colors.border,\n borderWidth: 1,\n borderColor: theme.colors.border,\n }}\n />\n </Stack>\n {hexError ? (\n <Text tone=\"danger\" variant=\"bodySmall\">\n {hexError}\n </Text>\n ) : null}\n </Stack>\n </Card>\n\n {/* Section: Harmony */}\n <Card\n title=\"Harmony\"\n description=\"Choose how accent hues are generated from your primary color.\"\n >\n <Select\n value={value.harmony}\n options={HARMONY_OPTIONS}\n onValueChange={(h) => onChange({ ...value, harmony: h })}\n testID={testID ? `${testID}-harmony-select` : undefined}\n />\n </Card>\n\n {/* Section: Mode */}\n <Card title=\"Mode\" description=\"Switch between light and dark presentation.\">\n <Tabs\n value={activeMode}\n items={MODE_TABS}\n onValueChange={(m) => onModeChange?.(m)}\n variant=\"segmented\"\n testID={testID ? `${testID}-mode-tabs` : undefined}\n />\n </Card>\n\n {/* Section: Preview */}\n <Card title=\"Preview\" description=\"A quick look at how your theme renders common controls.\">\n <Stack gap=\"m\">\n <Stack gap=\"xs\">\n <Text variant=\"label\">Name</Text>\n <Text>{value.name}</Text>\n </Stack>\n <Stack gap=\"xs\">\n <Text variant=\"label\">Category</Text>\n <Text>{formatAppCategoryLabel(value.appCategory)}</Text>\n </Stack>\n <Stack gap=\"xs\">\n <Text variant=\"label\">Primary color</Text>\n <Text tone=\"muted\" variant=\"bodySmall\">\n {value.primaryColor}\n </Text>\n </Stack>\n <Stack gap=\"xs\">\n <Text variant=\"label\">Harmony</Text>\n <Text tone=\"muted\" variant=\"bodySmall\">\n {value.harmony}\n </Text>\n </Stack>\n <Heading level={4}>Heading</Heading>\n <Text>Body text — this shows default text color and weight.</Text>\n <Text tone=\"muted\" variant=\"bodySmall\">\n Muted caption text.\n </Text>\n <Stack direction=\"row\" gap=\"s\" align=\"center\">\n <Button tone=\"primary\" emphasis=\"solid\" size=\"m\">\n Primary\n </Button>\n <Button tone=\"neutral\" emphasis=\"soft\" size=\"m\">\n Neutral\n </Button>\n <Button tone=\"danger\" emphasis=\"ghost\" size=\"m\">\n Danger\n </Button>\n </Stack>\n <Stack direction=\"row\" gap=\"s\" align=\"center\">\n <Badge tone=\"primary\">Primary</Badge>\n <Badge tone=\"success\" emphasis=\"soft\">\n Success\n </Badge>\n <Badge tone=\"warning\" emphasis=\"soft\">\n Warning\n </Badge>\n <Badge tone=\"danger\" emphasis=\"soft\">\n Danger\n </Badge>\n </Stack>\n <Card\n tone=\"subtle\"\n title=\"Nested card\"\n description=\"Subtle tone inside the preview.\"\n compact\n />\n </Stack>\n </Card>\n\n {/* Submit */}\n {onSubmit ? (\n <Button\n tone=\"primary\"\n emphasis=\"solid\"\n onPress={handleSubmit}\n testID={testID ? `${testID}-submit` : undefined}\n >\n Apply theme\n </Button>\n ) : null}\n </Stack>\n );\n}\n\nexport const ThemeComposer = withZoraThemeScope(ThemeComposerInner);\n"]}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { AppCategory } from '@ankhorage/contracts';
|
|
1
2
|
import type { ZoraTheme, ZoraThemeMode } from '../../theme/types';
|
|
2
3
|
import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
|
|
3
4
|
export interface ThemeComposerProps extends ZoraBaseProps {
|
|
@@ -6,5 +7,6 @@ export interface ThemeComposerProps extends ZoraBaseProps {
|
|
|
6
7
|
mode?: ZoraThemeMode;
|
|
7
8
|
onModeChange?: (mode: ZoraThemeMode) => void;
|
|
8
9
|
onSubmit?: (theme: ZoraTheme) => void;
|
|
10
|
+
appCategories?: readonly AppCategory[];
|
|
9
11
|
}
|
|
10
12
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/theme-composer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACrC,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/patterns/theme-composer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACrC,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,SAAS,WAAW,EAAE,CAAC;CACxC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/theme-composer/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ZoraTheme, ZoraThemeMode } from '../../theme/types';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface ThemeComposerProps extends ZoraBaseProps {\n value: ZoraTheme;\n onChange: (theme: ZoraTheme) => void;\n mode?: ZoraThemeMode;\n onModeChange?: (mode: ZoraThemeMode) => void;\n onSubmit?: (theme: ZoraTheme) => void;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/patterns/theme-composer/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AppCategory } from '@ankhorage/contracts';\n\nimport type { ZoraTheme, ZoraThemeMode } from '../../theme/types';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport interface ThemeComposerProps extends ZoraBaseProps {\n value: ZoraTheme;\n onChange: (theme: ZoraTheme) => void;\n mode?: ZoraThemeMode;\n onModeChange?: (mode: ZoraThemeMode) => void;\n onSubmit?: (theme: ZoraTheme) => void;\n appCategories?: readonly AppCategory[];\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PaletteItem.d.ts","sourceRoot":"","sources":["../../../src/patterns/tile-grid/PaletteItem.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PaletteItem.d.ts","sourceRoot":"","sources":["../../../src/patterns/tile-grid/PaletteItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAgDhD,eAAO,MAAM,WAAW,wDAAuC,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { Box } from '@ankhorage/surface';
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import { Card } from '../../components/card';
|
|
4
3
|
import { Heading } from '../../components/heading';
|
|
5
4
|
import { Text } from '../../components/text';
|
|
5
|
+
import { Box } from '../../foundation';
|
|
6
6
|
import { useZoraTheme } from '../../theme/useZoraTheme';
|
|
7
7
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
8
8
|
function PaletteItemInner({ themeId: _themeId, mode: _mode, title, description, icon, badge, selected, disabled, onPress, testID, }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PaletteItem.js","sourceRoot":"","sources":["../../../src/patterns/tile-grid/PaletteItem.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"PaletteItem.js","sourceRoot":"","sources":["../../../src/patterns/tile-grid/PaletteItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,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,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,MAAM,GACW;IACjB,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,EAAE,CAAC;IAEjC,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CACP,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CACtC,KAAK,CAAC,CACJ,QAAQ;YACN,CAAC,CAAC;gBACE,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO;gBACjC,WAAW,EAAE,CAAC;aACf;YACH,CAAC,CAAC,SACN,CAAC,CAED;MAAA,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAC1C;QAAA,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,oBAAoB,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CACvD;QAAA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAC/B;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,OAAO,CACT;QAAA,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CACjD;YAAA,CAAC,WAAW,CACd;UAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,IAAI,CACR;QAAA,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAC5C;MAAA,EAAE,GAAG,CACP;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 { Heading } from '../../components/heading';\nimport { Text } from '../../components/text';\nimport { Box } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { PaletteItemProps } from './types';\n\nfunction PaletteItemInner({\n themeId: _themeId,\n mode: _mode,\n title,\n description,\n icon,\n badge,\n selected,\n disabled,\n onPress,\n testID,\n}: PaletteItemProps) {\n const { theme } = useZoraTheme();\n\n return (\n <Card\n compact\n disabled={disabled}\n onPress={onPress}\n testID={testID}\n tone={selected ? 'default' : 'subtle'}\n style={\n selected\n ? {\n borderColor: theme.colors.primary,\n borderWidth: 2,\n }\n : undefined\n }\n >\n <Box p=\"xs\" style={{ alignItems: 'center' }}>\n {icon ? <Box pb=\"s\">{/* Icon spec here */}</Box> : null}\n <Heading level={5} align=\"center\">\n {title}\n </Heading>\n {description ? (\n <Text align=\"center\" tone=\"muted\" variant=\"caption\">\n {description}\n </Text>\n ) : null}\n {badge ? <Box pt=\"xs\">{badge}</Box> : null}\n </Box>\n </Card>\n );\n}\n\nexport const PaletteItem = withZoraThemeScope(PaletteItemInner);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TileGrid.d.ts","sourceRoot":"","sources":["../../../src/patterns/tile-grid/TileGrid.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TileGrid.d.ts","sourceRoot":"","sources":["../../../src/patterns/tile-grid/TileGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AA4C7C,eAAO,MAAM,QAAQ,qDAAoC,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { Box } from '@ankhorage/surface';
|
|
2
1
|
import React from 'react';
|
|
2
|
+
import { Box } from '../../foundation';
|
|
3
3
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
4
4
|
function TileGridInner({ themeId: _themeId, mode: _mode, children, columns = 'responsive', compact = false, testID, }) {
|
|
5
5
|
return (<Box testID={testID} style={{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TileGrid.js","sourceRoot":"","sources":["../../../src/patterns/tile-grid/TileGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"TileGrid.js","sourceRoot":"","sources":["../../../src/patterns/tile-grid/TileGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,aAAa,CAAC,EACrB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,QAAQ,EACR,OAAO,GAAG,YAAY,EACtB,OAAO,GAAG,KAAK,EACf,MAAM,GACQ;IACd,OAAO,CACL,CAAC,GAAG,CACF,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC;YACL,aAAa,EAAE,KAAK;YACpB,QAAQ,EAAE,MAAM;YAChB,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;SACtB,CAAC,CAEF;MAAA,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YACtC,IAAI,CAAC,KAAK;gBAAE,OAAO,IAAI,CAAC;YAExB,OAAO,CACL,CAAC,GAAG,CACF,KAAK,CAAC,CACJ,OAAO,KAAK,YAAY;oBACtB,CAAC,CAAC;wBACE,SAAS,EAAE,KAAK;wBAChB,QAAQ,EAAE,CAAC;wBACX,QAAQ,EAAE,GAAG;qBACd;oBACH,CAAC,CAAC;wBACE,KAAK,EAAE,GAAG,GAAG,GAAG,OAAO,GAAG;qBAElC,CAAC,CAED;YAAA,CAAC,KAAK,CACR;UAAA,EAAE,GAAG,CAAC,CACP,CAAC;QACJ,CAAC,CAAC,CACJ;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,kBAAkB,CAAC,aAAa,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Box } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { TileGridProps } from './types';\n\nfunction TileGridInner({\n themeId: _themeId,\n mode: _mode,\n children,\n columns = 'responsive',\n compact = false,\n testID,\n}: TileGridProps) {\n return (\n <Box\n testID={testID}\n style={{\n flexDirection: 'row',\n flexWrap: 'wrap',\n gap: compact ? 8 : 16,\n }}\n >\n {React.Children.map(children, (child) => {\n if (!child) return null;\n\n return (\n <Box\n style={\n columns === 'responsive'\n ? {\n flexBasis: '30%',\n flexGrow: 1,\n minWidth: 120,\n }\n : {\n width: `${100 / columns}%`,\n }\n }\n >\n {child}\n </Box>\n );\n })}\n </Box>\n );\n}\n\nexport const TileGrid = withZoraThemeScope(TileGridInner);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeItem.d.ts","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeItem.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TreeItem.d.ts","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,OAAO,KAAK,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEjE,UAAU,aAAa,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,CAAE,SAAQ,aAAa;IACxE,IAAI,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,WAAW,EAAE,SAAS,GAAG,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,KAAK,IAAI,CAAC;IAC7B,cAAc,EAAE,CAAC,EAAE,EAAE,GAAG,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;CACnE;AA2ED,eAAO,MAAM,QAAQ,GAzEE,GAAG,SAAS,MAAM,kEAyEgB,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { Box, Stack } from '@ankhorage/surface';
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import { IconButton } from '../../components/icon-button';
|
|
3
|
+
import { Box, Stack } from '../../foundation';
|
|
4
4
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
5
5
|
import { SettingsRow } from '../settings-row';
|
|
6
6
|
function TreeItemInner({ themeId: _themeId, mode: _mode, node, depth, selectedId, expandedIds, onSelect, onToggleExpand, renderItem, testID, }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeItem.js","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeItem.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"TreeItem.js","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { IconButton } from '../../components/icon-button';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\nimport { SettingsRow } from '../settings-row';\nimport type { TreeItemNode, TreeItemRenderProps } from './types';\n\ninterface TreeItemProps<TId extends string = string> extends ZoraBaseProps {\n node: TreeItemNode<TId>;\n depth: number;\n selectedId?: TId;\n expandedIds: readonly TId[];\n onSelect?: (id: TId) => void;\n onToggleExpand: (id: TId) => void;\n renderItem?: (props: TreeItemRenderProps<TId>) => React.ReactNode;\n}\n\nfunction TreeItemInner<TId extends string = string>({\n themeId: _themeId,\n mode: _mode,\n node,\n depth,\n selectedId,\n expandedIds,\n onSelect,\n onToggleExpand,\n renderItem,\n testID,\n}: TreeItemProps<TId>) {\n const hasChildren = node.children !== undefined && node.children.length > 0;\n const isExpanded = expandedIds.includes(node.id);\n const isSelected = selectedId === node.id;\n\n const renderContent = () => {\n if (renderItem) {\n return renderItem({\n node,\n depth,\n selected: isSelected,\n expanded: isExpanded,\n hasChildren,\n });\n }\n\n return (\n <SettingsRow\n title={node.label}\n control={\n <Stack direction=\"row\" gap=\"xs\" align=\"center\">\n {node.actions}\n {hasChildren ? (\n <IconButton\n icon={{ name: isExpanded ? 'chevron-down-outline' : 'chevron-forward-outline' }}\n label={isExpanded ? 'Collapse' : 'Expand'}\n onPress={() => onToggleExpand(node.id)}\n size=\"s\"\n emphasis=\"ghost\"\n />\n ) : null}\n </Stack>\n }\n meta={node.meta}\n disabled={node.disabled}\n />\n );\n };\n\n return (\n <Box testID={testID}>\n <Box style={{ paddingLeft: depth * 16 }}>{renderContent()}</Box>\n {hasChildren && isExpanded ? (\n <Box>\n {node.children?.map((child) => (\n <TreeItem\n key={child.id}\n depth={depth + 1}\n expandedIds={expandedIds}\n node={child}\n onSelect={onSelect}\n onToggleExpand={onToggleExpand}\n renderItem={renderItem}\n selectedId={selectedId}\n />\n ))}\n </Box>\n ) : null}\n </Box>\n );\n}\n\nexport const TreeItem = withZoraThemeScope(TreeItemInner);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeView.d.ts","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeView.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TreeView.d.ts","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAiD7C,eAAO,MAAM,QAAQ,GA/CE,GAAG,SAAS,MAAM,kEA+CgB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { Stack } from '@ankhorage/surface';
|
|
2
1
|
import React from 'react';
|
|
2
|
+
import { Stack } from '../../foundation';
|
|
3
3
|
import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
|
|
4
4
|
import { TreeItem } from './TreeItem';
|
|
5
5
|
function TreeViewInner({ themeId: _themeId, mode: _mode, nodes, selectedId, expandedIds: controlledExpandedIds, defaultExpandedIds, onSelect, onExpandedChange, renderItem, testID, }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeView.js","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeView.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"TreeView.js","sourceRoot":"","sources":["../../../src/patterns/tree-view/TreeView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAGtC,SAAS,aAAa,CAA8B,EAClD,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,KAAK,EACL,UAAU,EACV,WAAW,EAAE,qBAAqB,EAClC,kBAAkB,EAClB,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,MAAM,GACa;IACnB,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAClE,kBAAkB,IAAI,EAAE,CACzB,CAAC;IAEF,MAAM,YAAY,GAAG,qBAAqB,KAAK,SAAS,CAAC;IACzD,MAAM,WAAW,GAAG,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAE/E,MAAM,kBAAkB,GAAG,CAAC,EAAO,EAAE,EAAE;QACrC,MAAM,UAAU,GAAG,WAAW,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC5C,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,WAAW,EAAE,EAAE,CAAC,CAAC;QAE3F,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,sBAAsB,CAAC,MAAM,CAAC,CAAC;QACjC,CAAC;QACD,gBAAgB,EAAE,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC/B;MAAA,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,CAAC,QAAQ,CACP,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CACb,KAAK,CAAC,CAAC,CAAC,CAAC,CACT,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,cAAc,CAAC,CAAC,kBAAkB,CAAC,CACnC,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,UAAU,CAAC,CAAC,UAAU,CAAC,EACvB,CACH,CAAC,CACJ;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,kBAAkB,CAAC,aAAa,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { TreeItem } from './TreeItem';\nimport type { TreeViewProps } from './types';\n\nfunction TreeViewInner<TId extends string = string>({\n themeId: _themeId,\n mode: _mode,\n nodes,\n selectedId,\n expandedIds: controlledExpandedIds,\n defaultExpandedIds,\n onSelect,\n onExpandedChange,\n renderItem,\n testID,\n}: TreeViewProps<TId>) {\n const [internalExpandedIds, setInternalExpandedIds] = React.useState<readonly TId[]>(\n defaultExpandedIds ?? [],\n );\n\n const isControlled = controlledExpandedIds !== undefined;\n const expandedIds = isControlled ? controlledExpandedIds : internalExpandedIds;\n\n const handleToggleExpand = (id: TId) => {\n const isExpanded = expandedIds.includes(id);\n const newIds = isExpanded ? expandedIds.filter((eid) => eid !== id) : [...expandedIds, id];\n\n if (!isControlled) {\n setInternalExpandedIds(newIds);\n }\n onExpandedChange?.(newIds);\n };\n\n return (\n <Stack gap=\"none\" testID={testID}>\n {nodes.map((node) => (\n <TreeItem\n key={node.id}\n depth={0}\n expandedIds={expandedIds}\n node={node}\n onSelect={onSelect}\n onToggleExpand={handleToggleExpand}\n renderItem={renderItem}\n selectedId={selectedId}\n />\n ))}\n </Stack>\n );\n}\n\nexport const TreeView = withZoraThemeScope(TreeViewInner);\n"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ankhorage/zora",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.2",
|
|
5
5
|
"description": "Opinionated React Native and React Native Web UI kit built on @ankhorage/surface.",
|
|
6
6
|
"homepage": "https://github.com/ankhorage/zora#readme",
|
|
7
7
|
"bugs": {
|