thread-ui 0.9.0 → 0.12.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/README.md +7 -1
- package/dist/components/data-display/filter-controls/variants/filter-controls.js +1 -1
- package/dist/components/data-display/filter-controls/variants/filter-controls.js.map +1 -1
- package/dist/components/data-display/filter-controls/variants/inline-filter-controls.js +1 -1
- package/dist/components/data-display/filter-controls/variants/inline-filter-controls.js.map +1 -1
- package/dist/components/data-display/sort-controls/sort-controls.js +1 -1
- package/dist/components/data-display/sort-controls/sort-controls.js.map +1 -1
- package/dist/components/form-elements/form-label/form-label.js +1 -1
- package/dist/components/form-elements/form-label/form-label.js.map +1 -1
- package/dist/components/media/image-panel/image-panel.js +47 -47
- package/dist/components/media/image-panel/image-panel.js.map +1 -1
- package/dist/components/media/media-card/media-card.js +22 -5
- package/dist/components/media/media-card/media-card.js.map +1 -1
- package/dist/components/navigation/nav-menu/components/nav-link/nav-link.js +2 -4
- package/dist/components/navigation/nav-menu/components/nav-link/nav-link.js.map +1 -1
- package/dist/components/typography/body/body.types.d.ts +31 -0
- package/dist/components/typography/body/body.types.js +2 -0
- package/dist/components/typography/body/body.types.js.map +1 -0
- package/dist/components/typography/body/list.d.ts +15 -0
- package/dist/components/typography/body/list.js +47 -0
- package/dist/components/typography/body/list.js.map +1 -0
- package/dist/components/typography/body/text.d.ts +12 -0
- package/dist/components/typography/body/text.js +30 -0
- package/dist/components/typography/body/text.js.map +1 -0
- package/dist/components/typography/code/code.d.ts +2 -0
- package/dist/components/typography/code/code.js +23 -0
- package/dist/components/typography/code/code.js.map +1 -0
- package/dist/components/typography/code/code.types.d.ts +9 -0
- package/dist/components/typography/code/code.types.js +2 -0
- package/dist/components/typography/code/code.types.js.map +1 -0
- package/dist/components/typography/heading/heading.d.ts +38 -0
- package/dist/components/typography/heading/heading.js +53 -0
- package/dist/components/typography/heading/heading.js.map +1 -0
- package/dist/components/typography/heading/heading.types.d.ts +13 -0
- package/dist/components/typography/heading/heading.types.js +2 -0
- package/dist/components/typography/heading/heading.types.js.map +1 -0
- package/dist/components/typography/heading/render-heading.d.ts +16 -0
- package/dist/components/typography/heading/render-heading.js +52 -0
- package/dist/components/typography/heading/render-heading.js.map +1 -0
- package/dist/components/typography/index.d.ts +8 -2
- package/dist/components/typography/index.js +4 -1
- package/dist/components/typography/index.js.map +1 -1
- package/dist/components/typography/page-header/page-header.js +5 -8
- package/dist/components/typography/page-header/page-header.js.map +1 -1
- package/dist/components/typography/shared-utils/get-presentation-styles.d.ts +2 -0
- package/dist/components/typography/shared-utils/get-presentation-styles.js +31 -0
- package/dist/components/typography/shared-utils/get-presentation-styles.js.map +1 -0
- package/dist/components/typography/shared-utils/get-typography-styles.d.ts +3 -0
- package/dist/components/typography/shared-utils/get-typography-styles.js +56 -0
- package/dist/components/typography/shared-utils/get-typography-styles.js.map +1 -0
- package/dist/components/typography/typography.d.ts +55 -22
- package/dist/components/typography/typography.js +198 -127
- package/dist/components/typography/typography.js.map +1 -1
- package/dist/components/typography/typography.types.d.ts +23 -0
- package/dist/components/typography/typography.types.js +2 -0
- package/dist/components/typography/typography.types.js.map +1 -0
- package/dist/components/ui/card/card.js +3 -32
- package/dist/components/ui/card/card.js.map +1 -1
- package/dist/components/ui/divider/divider.d.ts +1 -1
- package/dist/components/ui/divider/divider.js +20 -6
- package/dist/components/ui/divider/divider.js.map +1 -1
- package/dist/components/ui/divider/divider.types.d.ts +3 -0
- package/dist/components/ui/index.d.ts +1 -0
- package/dist/components/ui/index.js +1 -0
- package/dist/components/ui/index.js.map +1 -1
- package/dist/components/ui/tab-view/components/tab-item-content.d.ts +5 -0
- package/dist/components/ui/tab-view/components/tab-item-content.js +23 -0
- package/dist/components/ui/tab-view/components/tab-item-content.js.map +1 -0
- package/dist/components/ui/tab-view/components/tab-view-content.d.ts +1 -0
- package/dist/components/ui/tab-view/components/tab-view-content.js +8 -0
- package/dist/components/ui/tab-view/components/tab-view-content.js.map +1 -0
- package/dist/components/ui/tab-view/components/tab-view-controls.d.ts +1 -0
- package/dist/components/ui/tab-view/components/tab-view-controls.js +66 -0
- package/dist/components/ui/tab-view/components/tab-view-controls.js.map +1 -0
- package/dist/components/ui/tab-view/index.d.ts +2 -0
- package/dist/components/ui/tab-view/index.js +2 -0
- package/dist/components/ui/tab-view/index.js.map +1 -0
- package/dist/components/ui/tab-view/tab-view-context.d.ts +34 -0
- package/dist/components/ui/tab-view/tab-view-context.js +4 -0
- package/dist/components/ui/tab-view/tab-view-context.js.map +1 -0
- package/dist/components/ui/tab-view/tab-view.d.ts +18 -0
- package/dist/components/ui/tab-view/tab-view.js +42 -0
- package/dist/components/ui/tab-view/tab-view.js.map +1 -0
- package/dist/components/ui/tab-view/tab-view.types.d.ts +39 -0
- package/dist/components/ui/tab-view/tab-view.types.js +2 -0
- package/dist/components/ui/tab-view/tab-view.types.js.map +1 -0
- package/dist/styled-system/styles.css +1 -1
- package/dist/styled-system/tokens/index.js +477 -353
- package/dist/styled-system/tokens/tokens.d.ts +19 -19
- package/dist/styles/panda.css +1 -1
- package/dist/styles/theme.css +37 -0
- package/dist/theme/css-name-configurations/theme-css-names.d.ts +54 -0
- package/dist/theme/css-name-configurations/theme-css-names.js +52 -0
- package/dist/theme/css-name-configurations/theme-css-names.js.map +1 -1
- package/dist/theme/default-theme.js +53 -0
- package/dist/theme/default-theme.js.map +1 -1
- package/dist/theme/index.d.ts +2 -1
- package/dist/theme/index.js +2 -1
- package/dist/theme/index.js.map +1 -1
- package/dist/theme/theme-docs/misc-elements.d.ts +6 -0
- package/dist/theme/theme-docs/misc-elements.js +20 -0
- package/dist/theme/theme-docs/misc-elements.js.map +1 -0
- package/dist/theme/theme-surface-system.d.ts +2 -0
- package/dist/theme/theme-surface-system.js +8 -0
- package/dist/theme/theme-surface-system.js.map +1 -1
- package/dist/theme/theme-typography-system.d.ts +10 -0
- package/dist/theme/theme-typography-system.js +51 -0
- package/dist/theme/theme-typography-system.js.map +1 -0
- package/dist/types/theme/theme.types.d.ts +90 -7
- package/dist/utils/context/create-stateful-component-context/create-stateful-component-context.d.ts +11 -0
- package/dist/utils/context/create-stateful-component-context/create-stateful-component-context.js +21 -0
- package/dist/utils/context/create-stateful-component-context/create-stateful-component-context.js.map +1 -0
- package/dist/utils/context/create-stateful-component-context/index.d.ts +1 -0
- package/dist/utils/context/create-stateful-component-context/index.js +2 -0
- package/dist/utils/context/create-stateful-component-context/index.js.map +1 -0
- package/dist/utils/context/index.d.ts +1 -0
- package/dist/utils/context/index.js +1 -0
- package/dist/utils/context/index.js.map +1 -1
- package/dist/utils/theme-utilities/get-resolved-layer-values/get-resolved-layer-values.d.ts +1 -1
- package/dist/utils/theme-utilities/get-resolved-layer-values/get-resolved-layer-values.js +8 -1
- package/dist/utils/theme-utilities/get-resolved-layer-values/get-resolved-layer-values.js.map +1 -1
- package/dist/utils/theme-utilities/get-resolved-typography-values/get-resolved-typography-values.d.ts +12 -0
- package/dist/utils/theme-utilities/get-resolved-typography-values/get-resolved-typography-values.js +13 -0
- package/dist/utils/theme-utilities/get-resolved-typography-values/get-resolved-typography-values.js.map +1 -0
- package/dist/utils/theme-utilities/get-resolved-typography-values/index.d.ts +1 -0
- package/dist/utils/theme-utilities/get-resolved-typography-values/index.js +2 -0
- package/dist/utils/theme-utilities/get-resolved-typography-values/index.js.map +1 -0
- package/dist/utils/theme-utilities/get-surface-styles/get-surface-styles.d.ts +3 -0
- package/dist/utils/theme-utilities/get-surface-styles/get-surface-styles.js +38 -0
- package/dist/utils/theme-utilities/get-surface-styles/get-surface-styles.js.map +1 -0
- package/dist/utils/theme-utilities/get-surface-styles/index.d.ts +1 -0
- package/dist/utils/theme-utilities/get-surface-styles/index.js +2 -0
- package/dist/utils/theme-utilities/get-surface-styles/index.js.map +1 -0
- package/dist/utils/theme-utilities/get-text-color-styles/get-text-color-styles.d.ts +11 -0
- package/dist/utils/theme-utilities/get-text-color-styles/get-text-color-styles.js +34 -0
- package/dist/utils/theme-utilities/get-text-color-styles/get-text-color-styles.js.map +1 -0
- package/dist/utils/theme-utilities/get-text-color-styles/index.d.ts +1 -0
- package/dist/utils/theme-utilities/get-text-color-styles/index.js +2 -0
- package/dist/utils/theme-utilities/get-text-color-styles/index.js.map +1 -0
- package/dist/utils/theme-utilities/index.d.ts +3 -0
- package/dist/utils/theme-utilities/index.js +3 -0
- package/dist/utils/theme-utilities/index.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -48,6 +48,12 @@ Thread UI uses a **layer-based elevation system**. Every component either sits o
|
|
|
48
48
|
1. **Light mode communicates elevation through shadows.** Surface, elevated, and overlay share the same background color — shadows and z-index differentiate them.
|
|
49
49
|
2. **Dark mode communicates elevation through lightness.** Each layer step up is slightly lighter. Shadows are nearly invisible against dark surfaces.
|
|
50
50
|
|
|
51
|
+
### Typography
|
|
52
|
+
|
|
53
|
+
Thread's typography system is built on **roles** — semantic chords that combine font family, size, weight, line height, letter spacing, and bottom margin into named presets like `title`, `h1`–`h3`, `body`, and `code`. Each role is defined once in the theme and consumed by components (`<Title>`, `<H1>`, `<Text>`, `<Code>`, etc.) so visual hierarchy stays consistent across the app.
|
|
54
|
+
|
|
55
|
+
Individual tokens (font sizes, weights, line heights, etc.) can be overridden per-instance for fine control, or theme-wide via `ThemeProvider`. Spacing flows through a shared scale (`none` → `xxl`) so heading and paragraph rhythm follows the same vocabulary as the rest of the system.
|
|
56
|
+
|
|
51
57
|
## Features
|
|
52
58
|
|
|
53
59
|
### Custom Themes
|
|
@@ -90,7 +96,7 @@ Component CSS is pre-generated using Panda CSS, so components render correctly s
|
|
|
90
96
|
|
|
91
97
|
### UI Elements
|
|
92
98
|
|
|
93
|
-
`Button` `Card` `Divider` `Icon` `IconButton` `Modal` `
|
|
99
|
+
`Button` `Card` `Divider` `DotsLoader` `Icon` `IconButton` `Modal` `SkeletonLayoutLoader` `SkeletonLoader` `SpinLoader` `TabView` `Toggle`
|
|
94
100
|
|
|
95
101
|
### Media Display
|
|
96
102
|
|
|
@@ -43,7 +43,7 @@ const styles = {
|
|
|
43
43
|
*/
|
|
44
44
|
export const FilterControls = ({ fields, activeFilters, onToggle, onClear, onClearAll, size = 'sm', isDefault, color, hideReset = false, showFilterLabel = false, }) => {
|
|
45
45
|
const getActive = (key) => activeFilters.find((f) => f.key === key);
|
|
46
|
-
return (_jsxs("div", { className: styles.container({ size }), children: [showFilterLabel && _jsx(Text, {
|
|
46
|
+
return (_jsxs("div", { className: styles.container({ size }), children: [showFilterLabel && _jsx(Text, { weight: "semibold", children: "Filters" }), _jsxs("div", { className: styles.controlsContainer({ size }), children: [fields.map(({ key, label, icon, color: fieldColor, options }) => {
|
|
47
47
|
const active = getActive(key);
|
|
48
48
|
const selectedValues = (active?.values ?? []);
|
|
49
49
|
return (_jsx(MultiDropdown, { size: size, id: String(key), title: label, options: options, values: selectedValues, onToggle: (value) => onToggle(key, value), onClear: () => onClear(key), icon: icon, showLabel: false, color: active ? color : undefined }, String(key)));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-controls.js","sourceRoot":"","sources":["../../../../../src/components/data-display/filter-controls/variants/filter-controls.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAEvD,MAAM,MAAM,GAAG;IACd,SAAS,EAAE,GAAG,CAAC;QACd,IAAI,EAAE;YACL,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;SACvB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAChB,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAChB,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;aAChB;SACD;KACD,CAAC;IACF,iBAAiB,EAAE,GAAG,CAAC;QACtB,IAAI,EAAE;YACL,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,KAAK,EAAE,aAAa;SACpB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAChB,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAChB,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;aAChB;SACD;KACD,CAAC;CACF,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAK,EAClC,MAAM,EACN,aAAa,EACb,QAAQ,EACR,OAAO,EACP,UAAU,EACV,IAAI,GAAG,IAAI,EACX,SAAS,EACT,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,eAAe,GAAG,KAAK,GACC,EAAE,EAAE;IAC5B,MAAM,SAAS,GAAG,CAAC,GAAY,EAA+B,EAAE,CAC/D,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC;IAE1C,OAAO,CACN,eAAK,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,CAAC,aACxC,eAAe,IAAI,KAAC,IAAI,IAAC,
|
|
1
|
+
{"version":3,"file":"filter-controls.js","sourceRoot":"","sources":["../../../../../src/components/data-display/filter-controls/variants/filter-controls.tsx"],"names":[],"mappings":"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"}
|
|
@@ -56,7 +56,7 @@ const styles = {
|
|
|
56
56
|
* <FilterBar {...filterControlsProps} />
|
|
57
57
|
*/
|
|
58
58
|
export const InlineFilterControls = ({ fields, isActive, onToggle, onClearAll, size = 'sm', isDefault, color = 'tertiary', fieldTitleDisplay = 'inline', hideReset = false, showFilterLabel = false, }) => {
|
|
59
|
-
return (_jsxs("div", { className: styles.container({ size }), children: [showFilterLabel && _jsx(Text, {
|
|
59
|
+
return (_jsxs("div", { className: styles.container({ size }), children: [showFilterLabel && _jsx(Text, { weight: "semibold", children: "Filters" }), fields.map(({ key, label, icon, color: fieldColor, options }) => (_jsxs("div", { className: styles.container({
|
|
60
60
|
size,
|
|
61
61
|
filterGroup: true,
|
|
62
62
|
titleInline: fieldTitleDisplay === 'inline',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inline-filter-controls.js","sourceRoot":"","sources":["../../../../../src/components/data-display/filter-controls/variants/inline-filter-controls.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE/C,OAAO,EAAE,MAAM,EAAe,IAAI,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE3D,MAAM,MAAM,GAAG;IACd,SAAS,EAAE,GAAG,CAAC;QACd,IAAI,EAAE;YACL,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,UAAU,EAAE,OAAO;YACnB,QAAQ,EAAE,MAAM;SAChB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAChB,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;gBAChB,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE;aAChB;YACD,WAAW,EAAE;gBACZ,IAAI,EAAE;oBACL,QAAQ,EAAE,SAAS;iBACnB;aACD;YACD,WAAW,EAAE;gBACZ,IAAI,EAAE;oBACL,UAAU,EAAE,QAAQ;oBACpB,aAAa,EAAE,KAAK;iBACpB;aACD;SACD;KACD,CAAC;IACF,UAAU,EAAE,GAAG,CAAC;QACf,IAAI,EAAE;YACL,UAAU,EAAE,UAAU;YACtB,KAAK,EAAE,gBAAgB;SACvB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE;gBACxC,EAAE,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE;gBACxC,EAAE,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE;aACxC;SACD;KACD,CAAC;CACF,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAK,EACxC,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,IAAI,GAAG,IAAI,EACX,SAAS,EACT,KAAK,GAAG,UAAU,EAClB,iBAAiB,GAAG,QAAQ,EAC5B,SAAS,GAAG,KAAK,EACjB,eAAe,GAAG,KAAK,GACO,EAAE,EAAE;IAClC,OAAO,CACN,eAAK,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,CAAC,aACxC,eAAe,IAAI,KAAC,IAAI,IAAC,
|
|
1
|
+
{"version":3,"file":"inline-filter-controls.js","sourceRoot":"","sources":["../../../../../src/components/data-display/filter-controls/variants/inline-filter-controls.tsx"],"names":[],"mappings":"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"}
|
|
@@ -42,7 +42,7 @@ const styles = {
|
|
|
42
42
|
*/
|
|
43
43
|
export const SortControls = ({ color = 'tertiary', fields, activeSort, onToggle, onClear, size = 'sm', isDefault, hideReset = false, neutralWhenInactive = false, showSortLabel = false, }) => {
|
|
44
44
|
const getState = (key) => activeSort.find((s) => s.key === key);
|
|
45
|
-
return (_jsxs("div", { className: styles.container({ inner: false, size }), children: [showSortLabel && _jsx(Text, {
|
|
45
|
+
return (_jsxs("div", { className: styles.container({ inner: false, size }), children: [showSortLabel && _jsx(Text, { weight: "semibold", children: "Sort" }), _jsxs("div", { className: styles.container({ inner: true, size }), children: [fields.map(({ key, label, icon, color: fieldColor }) => {
|
|
46
46
|
const state = getState(key);
|
|
47
47
|
const resolvedFieldColor = !state && neutralWhenInactive ? 'neutral' : (fieldColor ?? color);
|
|
48
48
|
const buttonProps = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sort-controls.js","sourceRoot":"","sources":["../../../../src/components/data-display/sort-controls/sort-controls.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AACb,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,MAAM,EAAe,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE3D,MAAM,MAAM,GAAG;IACd,SAAS,EAAE,GAAG,CAAC;QACd,IAAI,EAAE;YACL,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,KAAK;SACpB;QACD,QAAQ,EAAE;YACT,KAAK,EAAE;gBACN,IAAI,EAAE,EAAE;gBACR,KAAK,EAAE;oBACN,UAAU,EAAE,OAAO;oBACnB,aAAa,EAAE,QAAQ;iBACvB;aACD;YACD,IAAI,EAAE;gBACL,EAAE,EAAE;oBACH,GAAG,EAAE,GAAG;iBACR;gBACD,EAAE,EAAE;oBACH,GAAG,EAAE,GAAG;iBACR;gBACD,EAAE,EAAE;oBACH,GAAG,EAAE,GAAG;iBACR;aACD;SACD;KACD,CAAC;CACF,CAAC;AAEF;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAK,EAChC,KAAK,GAAG,UAAU,EAClB,MAAM,EACN,UAAU,EACV,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,IAAI,EACX,SAAS,EACT,SAAS,GAAG,KAAK,EACjB,mBAAmB,GAAG,KAAK,EAC3B,aAAa,GAAG,KAAK,GACC,EAAE,EAAE;IAC1B,MAAM,QAAQ,GAAG,CAAC,GAAY,EAA6B,EAAE,CAC5D,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC;IAEvC,OAAO,CACN,eAAK,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,aACtD,aAAa,IAAI,KAAC,IAAI,IAAC,
|
|
1
|
+
{"version":3,"file":"sort-controls.js","sourceRoot":"","sources":["../../../../src/components/data-display/sort-controls/sort-controls.tsx"],"names":[],"mappings":"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"}
|
|
@@ -39,6 +39,6 @@ export const FormLabel = ({ name, id = name, title, size = 'md' }) => {
|
|
|
39
39
|
return 'lg';
|
|
40
40
|
}
|
|
41
41
|
})();
|
|
42
|
-
return (_jsx("label", { id: id, htmlFor: name, className: styles({ size }), children: _jsx(Text, {
|
|
42
|
+
return (_jsx("label", { id: id, htmlFor: name, className: styles({ size }), children: _jsx(Text, { weight: "semibold", size: textSizeFromSizeProp, children: title }) }));
|
|
43
43
|
};
|
|
44
44
|
//# sourceMappingURL=form-label.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-label.js","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,MAAM,MAAM,GAAG,GAAG,CAAC;IAClB,IAAI,EAAE;QACL,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,YAAY;KACvB;IACD,QAAQ,EAAE;QACT,IAAI,EAAE;YACL,EAAE,EAAE;gBACH,YAAY,EAAE,GAAG;aACjB;YACD,EAAE,EAAE;gBACH,YAAY,EAAE,KAAK;aACnB;YACD,EAAE,EAAE;gBACH,YAAY,EAAE,GAAG;aACjB;SACD;KACD;CACD,CAAC,CAAC;AAEH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,GAAG,IAAI,EAAE,KAAK,EAAE,IAAI,GAAG,IAAI,EAAkB,EAAE,EAAE;IACpF,MAAM,oBAAoB,GAAG,CAAC,GAAG,EAAE;QAClC,QAAQ,IAAI,EAAE,CAAC;YACd,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC;YACb,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC;YACb,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC;YACb;gBACC,OAAO,IAAI,CAAC;QACd,CAAC;IACF,CAAC,CAAC,EAAE,CAAC;IAEL,OAAO,CACN,gBAAO,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC,YACxD,KAAC,IAAI,IAAC,
|
|
1
|
+
{"version":3,"file":"form-label.js","sourceRoot":"","sources":["../../../../src/components/form-elements/form-label/form-label.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,MAAM,MAAM,GAAG,GAAG,CAAC;IAClB,IAAI,EAAE;QACL,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,YAAY;KACvB;IACD,QAAQ,EAAE;QACT,IAAI,EAAE;YACL,EAAE,EAAE;gBACH,YAAY,EAAE,GAAG;aACjB;YACD,EAAE,EAAE;gBACH,YAAY,EAAE,KAAK;aACnB;YACD,EAAE,EAAE;gBACH,YAAY,EAAE,GAAG;aACjB;SACD;KACD;CACD,CAAC,CAAC;AAEH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,GAAG,IAAI,EAAE,KAAK,EAAE,IAAI,GAAG,IAAI,EAAkB,EAAE,EAAE;IACpF,MAAM,oBAAoB,GAAG,CAAC,GAAG,EAAE;QAClC,QAAQ,IAAI,EAAE,CAAC;YACd,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC;YACb,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC;YACb,KAAK,IAAI;gBACR,OAAO,IAAI,CAAC;YACb;gBACC,OAAO,IAAI,CAAC;QACd,CAAC;IACF,CAAC,CAAC,EAAE,CAAC;IAEL,OAAO,CACN,gBAAO,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC,YACxD,KAAC,IAAI,IAAC,MAAM,EAAC,UAAU,EAAC,IAAI,EAAE,oBAAoB,YAChD,KAAK,GACA,GACA,CACR,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -29,6 +29,52 @@ const renderPanelImage = (image, smImage) => {
|
|
|
29
29
|
return renderImage(image, undefined, cx(classes.image, classes.standardImg));
|
|
30
30
|
}
|
|
31
31
|
};
|
|
32
|
+
const panelStyles = cva({
|
|
33
|
+
base: {
|
|
34
|
+
display: 'flex',
|
|
35
|
+
gap: { base: '12px', lg: '20px' },
|
|
36
|
+
justifyContent: 'center',
|
|
37
|
+
alignItems: 'stretch',
|
|
38
|
+
width: '100%',
|
|
39
|
+
marginRight: 'auto',
|
|
40
|
+
maxWidth: { base: 'none', md: '800px', lg: '1400px' },
|
|
41
|
+
marginLeft: 'auto',
|
|
42
|
+
paddingRight: '2rem',
|
|
43
|
+
paddingLeft: '2rem',
|
|
44
|
+
},
|
|
45
|
+
variants: {
|
|
46
|
+
contentBelow: {
|
|
47
|
+
true: { flexDirection: { base: 'column' } },
|
|
48
|
+
false: { flexDirection: { base: 'column-reverse' } },
|
|
49
|
+
},
|
|
50
|
+
contentLeft: {
|
|
51
|
+
true: { flexDirection: { lg: 'row-reverse' } },
|
|
52
|
+
false: { flexDirection: { lg: 'row' } },
|
|
53
|
+
},
|
|
54
|
+
},
|
|
55
|
+
defaultVariants: {
|
|
56
|
+
contentBelow: false,
|
|
57
|
+
contentLeft: false,
|
|
58
|
+
},
|
|
59
|
+
});
|
|
60
|
+
const styles = {
|
|
61
|
+
imageBlock: css({
|
|
62
|
+
width: { base: '100%', lg: '66.666667%' },
|
|
63
|
+
}),
|
|
64
|
+
images: css({
|
|
65
|
+
position: 'relative',
|
|
66
|
+
width: '100%',
|
|
67
|
+
height: '100%',
|
|
68
|
+
}),
|
|
69
|
+
textBlock: css({
|
|
70
|
+
display: 'flex',
|
|
71
|
+
justifyContent: 'center',
|
|
72
|
+
alignItems: 'center',
|
|
73
|
+
marginLeft: 'auto',
|
|
74
|
+
marginRight: 'auto',
|
|
75
|
+
width: { base: '100%', lg: '41.666667%' },
|
|
76
|
+
}),
|
|
77
|
+
};
|
|
32
78
|
/**
|
|
33
79
|
* Two-column panel with an image and a text block. Supports responsive image swapping,
|
|
34
80
|
* flexible content positioning, and colored title variants.
|
|
@@ -44,52 +90,6 @@ const renderPanelImage = (image, smImage) => {
|
|
|
44
90
|
* />
|
|
45
91
|
*/
|
|
46
92
|
export const ImagePanel = ({ title, subtitle, contents, image, smImage, contentBelow = false, contentLeft = false, titleColor = 'standard', }) => {
|
|
47
|
-
|
|
48
|
-
base: {
|
|
49
|
-
display: 'flex',
|
|
50
|
-
gap: { base: '12px', lg: '20px' },
|
|
51
|
-
justifyContent: 'center',
|
|
52
|
-
alignItems: 'stretch',
|
|
53
|
-
width: '100%',
|
|
54
|
-
marginRight: 'auto',
|
|
55
|
-
maxWidth: { base: 'none', md: '800px', lg: '1400px' },
|
|
56
|
-
marginLeft: 'auto',
|
|
57
|
-
paddingRight: '2rem',
|
|
58
|
-
paddingLeft: '2rem',
|
|
59
|
-
},
|
|
60
|
-
variants: {
|
|
61
|
-
contentBelow: {
|
|
62
|
-
true: { flexDirection: { base: 'column' } },
|
|
63
|
-
false: { flexDirection: { base: 'column-reverse' } },
|
|
64
|
-
},
|
|
65
|
-
contentLeft: {
|
|
66
|
-
true: { flexDirection: { lg: 'row-reverse' } },
|
|
67
|
-
false: { flexDirection: { lg: 'row' } },
|
|
68
|
-
},
|
|
69
|
-
},
|
|
70
|
-
defaultVariants: {
|
|
71
|
-
contentBelow: false,
|
|
72
|
-
contentLeft: false,
|
|
73
|
-
},
|
|
74
|
-
});
|
|
75
|
-
const styles = {
|
|
76
|
-
imageBlock: css({
|
|
77
|
-
width: { base: '100%', lg: '66.666667%' },
|
|
78
|
-
}),
|
|
79
|
-
images: css({
|
|
80
|
-
position: 'relative',
|
|
81
|
-
width: '100%',
|
|
82
|
-
height: '100%',
|
|
83
|
-
}),
|
|
84
|
-
textBlock: css({
|
|
85
|
-
display: 'flex',
|
|
86
|
-
justifyContent: 'center',
|
|
87
|
-
alignItems: 'center',
|
|
88
|
-
marginLeft: 'auto',
|
|
89
|
-
marginRight: 'auto',
|
|
90
|
-
width: { base: '100%', lg: '41.666667%' },
|
|
91
|
-
}),
|
|
92
|
-
};
|
|
93
|
-
return (_jsxs("div", { className: panelStyles({ contentBelow, contentLeft }), children: [_jsx("div", { className: styles.imageBlock, children: _jsx("div", { className: styles.images, children: renderPanelImage(image, smImage) }) }), _jsx("div", { className: styles.textBlock, children: _jsxs("div", { children: [_jsxs(Title, { color: titleColor, children: [title, subtitle && _jsx(Subtitle, { children: subtitle })] }), contents?.map((txt, _) => (_jsx(Text, { children: txt }, _)))] }) })] }));
|
|
93
|
+
return (_jsxs("div", { className: panelStyles({ contentBelow, contentLeft }), children: [_jsx("div", { className: styles.imageBlock, children: _jsx("div", { className: styles.images, children: renderPanelImage(image, smImage) }) }), _jsx("div", { className: styles.textBlock, children: _jsxs("div", { children: [_jsxs(Title, { color: titleColor, children: [title, subtitle && _jsx(Subtitle, { fontFamily: "heading", children: subtitle })] }), contents?.map((txt, _) => (_jsx(Text, { children: txt }, _)))] }) })] }));
|
|
94
94
|
};
|
|
95
95
|
//# sourceMappingURL=image-panel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image-panel.js","sourceRoot":"","sources":["../../../../src/components/media/image-panel/image-panel.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAErD,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AAEnD,MAAM,gBAAgB,GAAG,CAAC,KAAiB,EAAE,OAAoB,EAAE,EAAE;IACpE,MAAM,OAAO,GAAG;QACf,KAAK,EAAE,GAAG,CAAC;YACV,OAAO,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,EAAE;YAClC,YAAY,EAAE,IAAI;SAClB,CAAC;QACF,OAAO,EAAE,GAAG,CAAC;YACZ,QAAQ,EAAE,UAAU;YACpB,OAAO,EAAE,EAAE,IAAI,EAAE,kBAAkB,EAAE,EAAE,EAAE,iBAAiB,EAAE;YAC5D,QAAQ,EAAE,IAAI;SACd,CAAC;QACF,WAAW,EAAE,GAAG,CAAC;YAChB,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;SACd,CAAC;QACF,mBAAmB,EAAE,GAAG,CAAC;YACxB,OAAO,EAAE,EAAE,IAAI,EAAE,iBAAiB,EAAE,EAAE,EAAE,kBAAkB,EAAE;YAC5D,SAAS,EAAE,IAAI;SACf,CAAC;KACF,CAAC;IACF,IAAI,OAAO,EAAE,CAAC;QACb,OAAO,CACN,8BACE,WAAW,CAAC,OAAO,EAAE,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,EACnE,WAAW,CACX,KAAK,EACL,SAAS,EACT,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,WAAW,EAAE,OAAO,CAAC,mBAAmB,CAAC,CACnE,IACC,CACH,CAAC;IACH,CAAC;SAAM,CAAC;QACP,OAAO,WAAW,CAAC,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;IAC9E,CAAC;AACF,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"image-panel.js","sourceRoot":"","sources":["../../../../src/components/media/image-panel/image-panel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -143,14 +143,31 @@ const styles = {
|
|
|
143
143
|
}),
|
|
144
144
|
descriptionWrapper: css({
|
|
145
145
|
maxHeight: {
|
|
146
|
-
base: '
|
|
146
|
+
base: '[300px]',
|
|
147
147
|
md: 'none',
|
|
148
|
-
lg: '
|
|
148
|
+
lg: '[500px]',
|
|
149
149
|
},
|
|
150
150
|
overflowY: {
|
|
151
151
|
base: 'auto',
|
|
152
152
|
md: 'visible',
|
|
153
|
-
lg: '
|
|
153
|
+
lg: 'auto',
|
|
154
|
+
},
|
|
155
|
+
// Firefox
|
|
156
|
+
scrollbarWidth: 'thin',
|
|
157
|
+
scrollbarColor: 'token(colors.structure.default) transparent',
|
|
158
|
+
// WebKit (Chrome, Safari, Edge)
|
|
159
|
+
'&::-webkit-scrollbar': {
|
|
160
|
+
width: '2px',
|
|
161
|
+
},
|
|
162
|
+
'&::-webkit-scrollbar-track': {
|
|
163
|
+
background: 'transparent',
|
|
164
|
+
},
|
|
165
|
+
'&::-webkit-scrollbar-thumb': {
|
|
166
|
+
backgroundColor: 'structure.subtle',
|
|
167
|
+
borderRadius: 'md',
|
|
168
|
+
},
|
|
169
|
+
'&::-webkit-scrollbar-thumb:hover': {
|
|
170
|
+
backgroundColor: 'structure.subtle',
|
|
154
171
|
},
|
|
155
172
|
}),
|
|
156
173
|
details: css({
|
|
@@ -176,12 +193,12 @@ export const MediaCard = ({ description, details, detailsPosition = 'text', imag
|
|
|
176
193
|
// Resolve from layer, allow individual overrides
|
|
177
194
|
const layerConfig = SurfaceLayerMap[layer];
|
|
178
195
|
const linksSection = links.map((link, index) => isValidElement(link) ? (cloneElement(link, { key: index })) : (_jsx(LinkWrapper, { link: link.url, children: _jsx(Icon, { name: link.iconName, size: 24 }) }, index)));
|
|
179
|
-
const mediaDetails = details && (_jsx("div", { className: styles.details, children: details.map((detail, index) => (_jsxs("span", { children: [_jsx(Text, { align: "center", size: "xs", children: detail.title }), _jsx(Text, { align: "center", size: "xs",
|
|
196
|
+
const mediaDetails = details && (_jsx("div", { className: styles.details, children: details.map((detail, index) => (_jsxs("span", { children: [_jsx(Text, { align: "center", size: "xs", children: detail.title }), _jsx(Text, { align: "center", size: "xs", weight: "semibold", children: detail.details })] }, index))) }));
|
|
180
197
|
return (_jsxs("div", { className: styles.container({
|
|
181
198
|
size,
|
|
182
199
|
bg: layerConfig.bg,
|
|
183
200
|
shadow: layerConfig.shadow,
|
|
184
201
|
structure: layerConfig.structure,
|
|
185
|
-
}), children: [_jsx("div", { className: styles.title, children: _jsx(H1, { align: "center", inline: true, children: title }) }), _jsx(Divider, { marginY: "8px" }), _jsxs("div", { className: styles.contents({ imagePosition }), children: [_jsxs("div", { className: styles.imageBlock, children: [renderImage(image, undefined, styles.image), _jsx("div", { className: styles.links, children: linksSection }), detailsPosition === 'image' && mediaDetails] }), _jsx("div", { className: styles.dividerWrapper, children: _jsx(Divider, {}) }), _jsxs("div", { className: styles.description, children: [detailsPosition === 'text' && mediaDetails, _jsx("div", { className: styles.descriptionWrapper, children: description.map((item, index) => (_jsx(Text, { align: "
|
|
202
|
+
}), children: [_jsx("div", { className: styles.title, children: _jsx(H1, { align: "center", inline: true, children: title }) }), _jsx(Divider, { marginY: "8px" }), _jsxs("div", { className: styles.contents({ imagePosition }), children: [_jsxs("div", { className: styles.imageBlock, children: [renderImage(image, undefined, styles.image), _jsx("div", { className: styles.links, children: linksSection }), detailsPosition === 'image' && mediaDetails] }), _jsx("div", { className: styles.dividerWrapper, children: _jsx(Divider, {}) }), _jsxs("div", { className: styles.description, children: [detailsPosition === 'text' && mediaDetails, _jsx("div", { className: styles.descriptionWrapper, children: description.map((item, index) => (_jsx(Text, { indent: true, align: "left", size: "sm", children: item }, index))) })] })] })] }));
|
|
186
203
|
};
|
|
187
204
|
//# sourceMappingURL=media-card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"media-card.js","sourceRoot":"","sources":["../../../../src/components/media/media-card/media-card.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"media-card.js","sourceRoot":"","sources":["../../../../src/components/media/media-card/media-card.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { LinkWrapper } from '../../../../../internal-components';
|
|
3
3
|
import { css, cva } from '../../../../../styled-system/css';
|
|
4
|
+
import { Text } from '../../../../../components/typography';
|
|
4
5
|
const styles = {
|
|
5
6
|
li: css({
|
|
6
7
|
display: 'flex',
|
|
@@ -16,9 +17,6 @@ const styles = {
|
|
|
16
17
|
alignItems: 'center',
|
|
17
18
|
justifyContent: 'center',
|
|
18
19
|
borderRadius: 'md',
|
|
19
|
-
color: 'text.standard',
|
|
20
|
-
fontSize: '0.875rem',
|
|
21
|
-
fontWeight: 500,
|
|
22
20
|
textDecoration: 'none',
|
|
23
21
|
transition: 'all 150ms ease-in-out',
|
|
24
22
|
margin: 'auto',
|
|
@@ -46,6 +44,6 @@ const styles = {
|
|
|
46
44
|
}),
|
|
47
45
|
};
|
|
48
46
|
export const NavLink = ({ children, href, halfPadding = false, isDropdownItem }) => {
|
|
49
|
-
return (_jsx("li", { className: styles.li, children: _jsx(LinkWrapper, { link: href, className: styles.link({ halfPadding, isDropdownItem }), children: children }) }));
|
|
47
|
+
return (_jsx("li", { className: styles.li, children: _jsx(LinkWrapper, { link: href, className: styles.link({ halfPadding, isDropdownItem }), children: _jsx(Text, { size: "sm", inline: true, weight: "medium", children: children }) }) }));
|
|
50
48
|
};
|
|
51
49
|
//# sourceMappingURL=nav-link.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-link.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/nav-menu/components/nav-link/nav-link.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE/C,MAAM,MAAM,GAAG;IACd,EAAE,EAAE,GAAG,CAAC;QACP,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,aAAa,EAAE,MAAM;KACrB,CAAC;IACF,IAAI,EAAE,GAAG,CAAC;QACT,IAAI,EAAE;YACL,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE;YAC5C,OAAO,EAAE,aAAa;YACtB,aAAa,EAAE,QAAQ;YACvB,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,QAAQ,EAAE;YACtC,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,YAAY,EAAE,IAAI;YAClB,
|
|
1
|
+
{"version":3,"file":"nav-link.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/nav-menu/components/nav-link/nav-link.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,MAAM,MAAM,GAAG;IACd,EAAE,EAAE,GAAG,CAAC;QACP,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,aAAa,EAAE,MAAM;KACrB,CAAC;IACF,IAAI,EAAE,GAAG,CAAC;QACT,IAAI,EAAE;YACL,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE;YAC5C,OAAO,EAAE,aAAa;YACtB,aAAa,EAAE,QAAQ;YACvB,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,QAAQ,EAAE;YACtC,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,YAAY,EAAE,IAAI;YAClB,cAAc,EAAE,MAAM;YACtB,UAAU,EAAE,uBAAuB;YACnC,MAAM,EAAE,MAAM;YACd,MAAM,EAAE;gBACP,eAAe,EAAE,OAAO;aACxB;YACD,OAAO,EAAE;gBACR,eAAe,EAAE,QAAQ;aACzB;SACD;QACD,QAAQ,EAAE;YACT,WAAW,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,KAAK,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE;aAC9B;YACD,cAAc,EAAE;gBACf,IAAI,EAAE,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE;gBACpD,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,aAAa,EAAE,EAAE;aACrD;SACD;QACD,eAAe,EAAE;YAChB,WAAW,EAAE,KAAK;YAClB,cAAc,EAAE,KAAK;SACrB;KACD,CAAC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,GAAG,KAAK,EAAE,cAAc,EAAgB,EAAE,EAAE;IAChG,OAAO,CACN,aAAI,SAAS,EAAE,MAAM,CAAC,EAAE,YACvB,KAAC,WAAW,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,WAAW,EAAE,cAAc,EAAE,CAAC,YAC/E,KAAC,IAAI,IAAC,IAAI,EAAC,IAAI,EAAC,MAAM,QAAC,MAAM,EAAC,QAAQ,YACpC,QAAQ,GACH,GACM,GACV,CACL,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { BodyFontSizeOptions, FontFamilyOptions, FontWeightOptions, LetterSpacingOptions, LineHeightOptions, Prettify, SpacingScaleOptions } from '../../../types';
|
|
2
|
+
import { TypographyProps } from '../typography.types';
|
|
3
|
+
import { ReactNode } from 'react';
|
|
4
|
+
/** Shared Body Text Props */
|
|
5
|
+
export type TypographyBodyTypes = Prettify<TypographyProps & {
|
|
6
|
+
/** Font size — body scale only @default `'md'` */
|
|
7
|
+
size?: BodyFontSizeOptions;
|
|
8
|
+
/** Font weight override @default role default (`'regular'`) */
|
|
9
|
+
weight?: FontWeightOptions;
|
|
10
|
+
/** Line height override @default role default (`'normal'`) */
|
|
11
|
+
lineHeight?: LineHeightOptions;
|
|
12
|
+
/** Letter spacing override @default role default (`'normal'`) */
|
|
13
|
+
letterSpacing?: LetterSpacingOptions;
|
|
14
|
+
/** Bottom margin override @default role default (`'0.5em'`) */
|
|
15
|
+
marginBottom?: SpacingScaleOptions;
|
|
16
|
+
}>;
|
|
17
|
+
/** Text Component Props */
|
|
18
|
+
export type TextProps = Prettify<TypographyBodyTypes & {
|
|
19
|
+
indent?: boolean;
|
|
20
|
+
fontFamily?: Exclude<FontFamilyOptions, 'heading'>;
|
|
21
|
+
underline?: boolean;
|
|
22
|
+
}>;
|
|
23
|
+
/** List Component Props */
|
|
24
|
+
export type ListProps = Prettify<Omit<TypographyBodyTypes, 'children' | 'inline' | 'truncate' | 'marginBottom'> & {
|
|
25
|
+
/** Items to render in the list */
|
|
26
|
+
items: Array<string | ReactNode>;
|
|
27
|
+
/** List marker style @default `'disc'` */
|
|
28
|
+
decoration?: 'disc' | 'circle' | 'square' | 'blank' | 'none';
|
|
29
|
+
}>;
|
|
30
|
+
/** Ordered List Component Props */
|
|
31
|
+
export type OrderedListProps = Prettify<Omit<ListProps, 'decoration'>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"body.types.js","sourceRoot":"","sources":["../../../../src/components/typography/body/body.types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ListProps, OrderedListProps } from './body.types';
|
|
2
|
+
/**
|
|
3
|
+
* Unordered list with configurable marker style, size, and color.
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* <List items={['Apples', 'Oranges', 'Bananas']} decoration="circle" />
|
|
7
|
+
*/
|
|
8
|
+
export declare const List: ({ align, color, size, weight, lineHeight, letterSpacing, items, decoration, }: ListProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
/**
|
|
10
|
+
* Ordered list with decimal numbering.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* <OrderedList items={['First', 'Second', 'Third']} />
|
|
14
|
+
*/
|
|
15
|
+
export declare const OrderedList: ({ align, color, size, weight, lineHeight, letterSpacing, items, }: OrderedListProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { getResolvedTypographyValues, getTextColorStyles } from '../../../utils';
|
|
3
|
+
import { cx } from '../../../styled-system/css';
|
|
4
|
+
import { getTypographyStyles } from '../shared-utils/get-typography-styles';
|
|
5
|
+
import { getPresentationStyles } from '../shared-utils/get-presentation-styles';
|
|
6
|
+
/**
|
|
7
|
+
* Unordered list with configurable marker style, size, and color.
|
|
8
|
+
*
|
|
9
|
+
* @example
|
|
10
|
+
* <List items={['Apples', 'Oranges', 'Bananas']} decoration="circle" />
|
|
11
|
+
*/
|
|
12
|
+
export const List = ({ align = 'left', color = 'standard', size = 'md', weight, lineHeight, letterSpacing, items, decoration = 'disc', }) => {
|
|
13
|
+
const resolved = getResolvedTypographyValues({
|
|
14
|
+
role: 'body',
|
|
15
|
+
fontSize: `body.${size}`,
|
|
16
|
+
fontWeight: weight,
|
|
17
|
+
lineHeight,
|
|
18
|
+
letterSpacing,
|
|
19
|
+
marginBottom: 'none',
|
|
20
|
+
});
|
|
21
|
+
const itemClass = cx(getTypographyStyles(resolved), getPresentationStyles({ align }), getTextColorStyles(color));
|
|
22
|
+
const listStyles = {
|
|
23
|
+
padding: 0,
|
|
24
|
+
listStyleType: decoration === 'blank' ? 'none' : decoration,
|
|
25
|
+
marginLeft: decoration !== 'none' ? '1em' : undefined,
|
|
26
|
+
};
|
|
27
|
+
return (_jsx("ul", { style: listStyles, children: items.map((item, index) => (_jsx("li", { className: itemClass, children: item }, index))) }));
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* Ordered list with decimal numbering.
|
|
31
|
+
*
|
|
32
|
+
* @example
|
|
33
|
+
* <OrderedList items={['First', 'Second', 'Third']} />
|
|
34
|
+
*/
|
|
35
|
+
export const OrderedList = ({ align = 'left', color = 'standard', size = 'md', weight, lineHeight, letterSpacing, items, }) => {
|
|
36
|
+
const resolved = getResolvedTypographyValues({
|
|
37
|
+
role: 'body',
|
|
38
|
+
fontSize: `body.${size}`,
|
|
39
|
+
fontWeight: weight,
|
|
40
|
+
lineHeight,
|
|
41
|
+
letterSpacing,
|
|
42
|
+
marginBottom: 'none',
|
|
43
|
+
});
|
|
44
|
+
const itemClass = cx(getTypographyStyles(resolved), getPresentationStyles({ align }), getTextColorStyles(color));
|
|
45
|
+
return (_jsx("ol", { style: { padding: 0, listStyleType: 'decimal', marginLeft: '1em' }, children: items.map((item, index) => (_jsx("li", { className: itemClass, children: item }, index))) }));
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=list.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list.js","sourceRoot":"","sources":["../../../../src/components/typography/body/list.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;AAGhF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EACpB,KAAK,GAAG,MAAM,EACd,KAAK,GAAG,UAAU,EAClB,IAAI,GAAG,IAAI,EACX,MAAM,EACN,UAAU,EACV,aAAa,EACb,KAAK,EACL,UAAU,GAAG,MAAM,GACR,EAAE,EAAE;IACf,MAAM,QAAQ,GAAG,2BAA2B,CAAC;QAC5C,IAAI,EAAE,MAAM;QACZ,QAAQ,EAAE,QAAQ,IAAI,EAAW;QACjC,UAAU,EAAE,MAAM;QAClB,UAAU;QACV,aAAa;QACb,YAAY,EAAE,MAAM;KACpB,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,EAAE,CACnB,mBAAmB,CAAC,QAAQ,CAAC,EAC7B,qBAAqB,CAAC,EAAE,KAAK,EAAE,CAAC,EAChC,kBAAkB,CAAC,KAAK,CAAC,CACzB,CAAC;IAEF,MAAM,UAAU,GAAwB;QACvC,OAAO,EAAE,CAAC;QACV,aAAa,EAAE,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU;QAC3D,UAAU,EAAE,UAAU,KAAK,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;KACrD,CAAC;IAEF,OAAO,CACN,aAAI,KAAK,EAAE,UAAU,YACnB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC3B,aAAgB,SAAS,EAAE,SAAS,YAClC,IAAI,IADG,KAAK,CAET,CACL,CAAC,GACE,CACL,CAAC;AACH,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC3B,KAAK,GAAG,MAAM,EACd,KAAK,GAAG,UAAU,EAClB,IAAI,GAAG,IAAI,EACX,MAAM,EACN,UAAU,EACV,aAAa,EACb,KAAK,GACa,EAAE,EAAE;IACtB,MAAM,QAAQ,GAAG,2BAA2B,CAAC;QAC5C,IAAI,EAAE,MAAM;QACZ,QAAQ,EAAE,QAAQ,IAAI,EAAW;QACjC,UAAU,EAAE,MAAM;QAClB,UAAU;QACV,aAAa;QACb,YAAY,EAAE,MAAM;KACpB,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,EAAE,CACnB,mBAAmB,CAAC,QAAQ,CAAC,EAC7B,qBAAqB,CAAC,EAAE,KAAK,EAAE,CAAC,EAChC,kBAAkB,CAAC,KAAK,CAAC,CACzB,CAAC;IAEF,OAAO,CACN,aAAI,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,aAAa,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,YACpE,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC3B,aAAgB,SAAS,EAAE,SAAS,YAClC,IAAI,IADG,KAAK,CAET,CACL,CAAC,GACE,CACL,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { TextProps } from './body.types';
|
|
2
|
+
/**
|
|
3
|
+
* Body text. Renders as `p` by default or `span` when `inline` is true.
|
|
4
|
+
*
|
|
5
|
+
* Allows for individual attribute overrides for customization
|
|
6
|
+
*
|
|
7
|
+
* @example
|
|
8
|
+
* <Text>Default Text</Text>
|
|
9
|
+
* @example
|
|
10
|
+
* <Text size="sm" weight="semibold">Important note</Text>
|
|
11
|
+
*/
|
|
12
|
+
export declare const Text: ({ children, align, inline, color, size, weight, lineHeight, letterSpacing, marginBottom, truncate, indent, fontFamily, underline, }: TextProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { getResolvedTypographyValues, getTextColorStyles } from '../../../utils';
|
|
3
|
+
import { cx } from '../../../styled-system/css';
|
|
4
|
+
import { getTypographyStyles } from '../shared-utils/get-typography-styles';
|
|
5
|
+
import { getPresentationStyles } from '../shared-utils/get-presentation-styles';
|
|
6
|
+
/**
|
|
7
|
+
* Body text. Renders as `p` by default or `span` when `inline` is true.
|
|
8
|
+
*
|
|
9
|
+
* Allows for individual attribute overrides for customization
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* <Text>Default Text</Text>
|
|
13
|
+
* @example
|
|
14
|
+
* <Text size="sm" weight="semibold">Important note</Text>
|
|
15
|
+
*/
|
|
16
|
+
export const Text = ({ children, align = 'left', inline = false, color = 'standard', size = 'md', weight, lineHeight, letterSpacing, marginBottom, truncate = false, indent, fontFamily, underline, }) => {
|
|
17
|
+
const Component = inline ? 'span' : 'p';
|
|
18
|
+
const resolved = getResolvedTypographyValues({
|
|
19
|
+
role: 'body',
|
|
20
|
+
fontSize: `body.${size}`,
|
|
21
|
+
fontWeight: weight,
|
|
22
|
+
fontFamily,
|
|
23
|
+
lineHeight,
|
|
24
|
+
letterSpacing,
|
|
25
|
+
marginBottom: inline ? 'none' : marginBottom,
|
|
26
|
+
});
|
|
27
|
+
const className = cx(getTypographyStyles(resolved), getPresentationStyles({ indent, align, truncate: truncate || undefined, underline }), getTextColorStyles(color));
|
|
28
|
+
return _jsx(Component, { className: className, children: children });
|
|
29
|
+
};
|
|
30
|
+
//# sourceMappingURL=text.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"text.js","sourceRoot":"","sources":["../../../../src/components/typography/body/text.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;AAGhF;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EACpB,QAAQ,EACR,KAAK,GAAG,MAAM,EACd,MAAM,GAAG,KAAK,EACd,KAAK,GAAG,UAAU,EAClB,IAAI,GAAG,IAAI,EACX,MAAM,EACN,UAAU,EACV,aAAa,EACb,YAAY,EACZ,QAAQ,GAAG,KAAK,EAChB,MAAM,EACN,UAAU,EACV,SAAS,GACE,EAAE,EAAE;IACf,MAAM,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC;IAExC,MAAM,QAAQ,GAAG,2BAA2B,CAAC;QAC5C,IAAI,EAAE,MAAM;QACZ,QAAQ,EAAE,QAAQ,IAAI,EAAW;QACjC,UAAU,EAAE,MAAM;QAClB,UAAU;QACV,UAAU;QACV,aAAa;QACb,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY;KAC5C,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,EAAE,CACnB,mBAAmB,CAAC,QAAQ,CAAC,EAC7B,qBAAqB,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,IAAI,SAAS,EAAE,SAAS,EAAE,CAAC,EACpF,kBAAkB,CAAC,KAAK,CAAC,CACzB,CAAC;IAEF,OAAO,KAAC,SAAS,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAa,CAAC;AAChE,CAAC,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { getResolvedTypographyValues, getTextColorStyles } from '../../../utils';
|
|
3
|
+
import { css, cx } from '../../../styled-system/css';
|
|
4
|
+
import { getTypographyStyles } from '../shared-utils/get-typography-styles';
|
|
5
|
+
import { getPresentationStyles } from '../shared-utils/get-presentation-styles';
|
|
6
|
+
const styles = css({
|
|
7
|
+
paddingY: '2px',
|
|
8
|
+
paddingX: '3px',
|
|
9
|
+
backgroundColor: 'structure.subtle',
|
|
10
|
+
borderRadius: 'xs',
|
|
11
|
+
borderWidth: 'sm',
|
|
12
|
+
borderColor: 'structure.default',
|
|
13
|
+
letterSpacing: 'wide',
|
|
14
|
+
});
|
|
15
|
+
export const Code = ({ children, size = 'sm', truncate = false, plain }) => {
|
|
16
|
+
const resolved = getResolvedTypographyValues({
|
|
17
|
+
role: 'code',
|
|
18
|
+
fontSize: `body.${size}`,
|
|
19
|
+
});
|
|
20
|
+
const className = cx(!plain && styles, getTypographyStyles(resolved), getPresentationStyles({ truncate: truncate || undefined }), getTextColorStyles('standard'));
|
|
21
|
+
return _jsx("code", { className: className, children: children });
|
|
22
|
+
};
|
|
23
|
+
//# sourceMappingURL=code.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code.js","sourceRoot":"","sources":["../../../../src/components/typography/code/code.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,2BAA2B,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE1E,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;AAEhF,MAAM,MAAM,GAAG,GAAG,CAAC;IAClB,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;IACf,eAAe,EAAE,kBAAkB;IACnC,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,IAAI;IACjB,WAAW,EAAE,mBAAmB;IAChC,aAAa,EAAE,MAAM;CACrB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,GAAG,IAAI,EAAE,QAAQ,GAAG,KAAK,EAAE,KAAK,EAAa,EAAE,EAAE;IACrF,MAAM,QAAQ,GAAG,2BAA2B,CAAC;QAC5C,IAAI,EAAE,MAAM;QACZ,QAAQ,EAAE,QAAQ,IAAI,EAAW;KACjC,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,EAAE,CACnB,CAAC,KAAK,IAAI,MAAM,EAChB,mBAAmB,CAAC,QAAQ,CAAC,EAC7B,qBAAqB,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAAI,SAAS,EAAE,CAAC,EAC1D,kBAAkB,CAAC,UAAU,CAAC,CAC9B,CAAC;IAEF,OAAO,eAAM,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAQ,CAAC;AACtD,CAAC,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { BodyFontSizeOptions, Prettify } from '../../../types';
|
|
2
|
+
import { TypographyProps } from '../typography.types';
|
|
3
|
+
/** Code Component Props */
|
|
4
|
+
export type CodeProps = Prettify<Pick<TypographyProps, 'children' | 'inline' | 'truncate'> & {
|
|
5
|
+
/** Font size — body scale only @default `'sm'` */
|
|
6
|
+
size?: BodyFontSizeOptions;
|
|
7
|
+
/** Remove default background and coloring @default `true`` */
|
|
8
|
+
plain?: boolean;
|
|
9
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code.types.js","sourceRoot":"","sources":["../../../../src/components/typography/code/code.types.ts"],"names":[],"mappings":""}
|