@bitrise/bitkit-v2 0.3.403-beta.2607 → 0.3.403
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS.md +1 -1
- package/dist/components/BitkitTable/BitkitBulkActionsRow.d.ts +6 -6
- package/dist/components/BitkitTable/BitkitBulkActionsRow.js +7 -7
- package/dist/components/BitkitTable/BitkitBulkActionsRow.js.map +1 -1
- package/dist/components/BitkitTable/BitkitDefinitionColumnHeader.d.ts +2 -2
- package/dist/components/BitkitTable/BitkitDefinitionColumnHeader.js +2 -2
- package/dist/components/BitkitTable/BitkitDefinitionColumnHeader.js.map +1 -1
- package/dist/components/BitkitTable/BitkitExpandableRow.js +1 -1
- package/dist/components/BitkitTable/BitkitExpandableRow.js.map +1 -1
- package/dist/components/BitkitTable/BitkitFilterRow.d.ts +7 -7
- package/dist/components/BitkitTable/BitkitFilterRow.js +8 -8
- package/dist/components/BitkitTable/BitkitFilterRow.js.map +1 -1
- package/dist/components/BitkitTable/BitkitLinkedRow.js +11 -11
- package/dist/components/BitkitTable/BitkitLinkedRow.js.map +1 -1
- package/dist/components/BitkitTable/BitkitRowActionsCell.d.ts +2 -2
- package/dist/components/BitkitTable/BitkitRowActionsCell.js +3 -3
- package/dist/components/BitkitTable/BitkitRowActionsCell.js.map +1 -1
- package/dist/components/BitkitTable/BitkitSortableColumnHeader.js +1 -1
- package/dist/components/BitkitTable/BitkitSortableColumnHeader.js.map +1 -1
- package/dist/components/BitkitToast/BitkitToaster.js +4 -1
- package/dist/components/BitkitToast/BitkitToaster.js.map +1 -1
- package/dist/components/index.d.ts +7 -8
- package/dist/main.js +8 -2
- package/dist/theme/slot-recipes/Toast.recipe.d.ts +8 -0
- package/dist/theme/slot-recipes/Toast.recipe.js +19 -12
- package/dist/theme/slot-recipes/Toast.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/index.d.ts +8 -0
- package/package.json +1 -1
- package/dist/components/BitkitTable/BitkitTable.d.ts +0 -42
- package/dist/components/BitkitTable/BitkitTable.js +0 -47
- package/dist/components/BitkitTable/BitkitTable.js.map +0 -1
package/AGENTS.md
CHANGED
|
@@ -95,7 +95,7 @@ Bitkit components use consistent prop names across the library:
|
|
|
95
95
|
<BitkitSegmentedControl.Item value="b">Option B</BitkitSegmentedControl.Item>
|
|
96
96
|
</BitkitSegmentedControl>
|
|
97
97
|
```
|
|
98
|
-
|
|
98
|
+
Two exceptions need an explicit `.Root` because they re-export a whole Chakra namespace: `BitkitDrawer.Root` and `BitkitTabs.Root`. Everything else is `<BitkitFoo>` + `<BitkitFoo.Part>`.
|
|
99
99
|
- **Slot props for content, not boolean flags** — pass an icon/badge/etc. directly as a prop. Element presence is the toggle:
|
|
100
100
|
```tsx
|
|
101
101
|
<BitkitButton icon={IconCheck}>Save</BitkitButton>
|
|
@@ -48,7 +48,7 @@ export interface BitkitBulkActionsRowProps extends Omit<Table.RowProps, 'childre
|
|
|
48
48
|
/**
|
|
49
49
|
* The bar above the column headers that appears while rows are selected: what is selected, the
|
|
50
50
|
* offer to widen the selection to every page, and the actions to run on it. Belongs in
|
|
51
|
-
* `
|
|
51
|
+
* `Table.Header`, before the `Table.Row` that holds the column headers.
|
|
52
52
|
*
|
|
53
53
|
* The count is mirrored into a visually hidden `aria-live` region, which is deliberately filled a
|
|
54
54
|
* render after mount — a live region that enters the DOM with its text already in it is not
|
|
@@ -56,9 +56,9 @@ export interface BitkitBulkActionsRowProps extends Omit<Table.RowProps, 'childre
|
|
|
56
56
|
*
|
|
57
57
|
* @example
|
|
58
58
|
* ```tsx
|
|
59
|
-
* <
|
|
59
|
+
* <Table.Header>
|
|
60
60
|
* {selected.length > 0 && (
|
|
61
|
-
* <
|
|
61
|
+
* <BitkitBulkActionsRow
|
|
62
62
|
* colSpan={COL_COUNT}
|
|
63
63
|
* items={{ one: 'workflow', other: 'workflows' }}
|
|
64
64
|
* onCancel={clearSelection}
|
|
@@ -70,10 +70,10 @@ export interface BitkitBulkActionsRowProps extends Omit<Table.RowProps, 'childre
|
|
|
70
70
|
* <BitkitButton icon={IconMinusCircle} size="md" variant="danger-secondary">
|
|
71
71
|
* Remove
|
|
72
72
|
* </BitkitButton>
|
|
73
|
-
* </
|
|
73
|
+
* </BitkitBulkActionsRow>
|
|
74
74
|
* )}
|
|
75
|
-
* <
|
|
76
|
-
* </
|
|
75
|
+
* <Table.Row>{columnHeaders}</Table.Row>
|
|
76
|
+
* </Table.Header>
|
|
77
77
|
* ```
|
|
78
78
|
*/
|
|
79
79
|
declare const BitkitBulkActionsRow: import('react').ForwardRefExoticComponent<BitkitBulkActionsRowProps & import('react').RefAttributes<HTMLTableRowElement>>;
|
|
@@ -25,7 +25,7 @@ var resolveItems = (items, count) => {
|
|
|
25
25
|
/**
|
|
26
26
|
* The bar above the column headers that appears while rows are selected: what is selected, the
|
|
27
27
|
* offer to widen the selection to every page, and the actions to run on it. Belongs in
|
|
28
|
-
* `
|
|
28
|
+
* `Table.Header`, before the `Table.Row` that holds the column headers.
|
|
29
29
|
*
|
|
30
30
|
* The count is mirrored into a visually hidden `aria-live` region, which is deliberately filled a
|
|
31
31
|
* render after mount — a live region that enters the DOM with its text already in it is not
|
|
@@ -33,9 +33,9 @@ var resolveItems = (items, count) => {
|
|
|
33
33
|
*
|
|
34
34
|
* @example
|
|
35
35
|
* ```tsx
|
|
36
|
-
* <
|
|
36
|
+
* <Table.Header>
|
|
37
37
|
* {selected.length > 0 && (
|
|
38
|
-
* <
|
|
38
|
+
* <BitkitBulkActionsRow
|
|
39
39
|
* colSpan={COL_COUNT}
|
|
40
40
|
* items={{ one: 'workflow', other: 'workflows' }}
|
|
41
41
|
* onCancel={clearSelection}
|
|
@@ -47,10 +47,10 @@ var resolveItems = (items, count) => {
|
|
|
47
47
|
* <BitkitButton icon={IconMinusCircle} size="md" variant="danger-secondary">
|
|
48
48
|
* Remove
|
|
49
49
|
* </BitkitButton>
|
|
50
|
-
* </
|
|
50
|
+
* </BitkitBulkActionsRow>
|
|
51
51
|
* )}
|
|
52
|
-
* <
|
|
53
|
-
* </
|
|
52
|
+
* <Table.Row>{columnHeaders}</Table.Row>
|
|
53
|
+
* </Table.Header>
|
|
54
54
|
* ```
|
|
55
55
|
*/
|
|
56
56
|
var BitkitBulkActionsRow = forwardRef((props, ref) => {
|
|
@@ -117,7 +117,7 @@ var BitkitBulkActionsRow = forwardRef((props, ref) => {
|
|
|
117
117
|
})
|
|
118
118
|
});
|
|
119
119
|
});
|
|
120
|
-
BitkitBulkActionsRow.displayName = "
|
|
120
|
+
BitkitBulkActionsRow.displayName = "BitkitBulkActionsRow";
|
|
121
121
|
//#endregion
|
|
122
122
|
export { BitkitBulkActionsRow as default };
|
|
123
123
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitBulkActionsRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitBulkActionsRow.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { Text } from '@chakra-ui/react/text';\nimport { VisuallyHidden } from '@chakra-ui/react/visually-hidden';\nimport { forwardRef, type ReactNode, useEffect, useState } from 'react';\n\nimport formatLabel from '../../utilities/formatLabel';\nimport BitkitButton from '../BitkitButton/BitkitButton';\n\n/**\n * The noun the bar counts. A single string is used for every count; pass `{ one, other }` to get\n * `1 workflow selected.` instead of `1 workflows selected.`\n */\nexport type BitkitBulkActionsItems = string | { one: string; other: string };\n\n/**\n * Overrides for the bar's sentences. Each template can use `{items}` (the `items` prop, already\n * resolved to the form matching that sentence's count), `{selectedCount}` and `{totalItems}`.\n * Override a whole sentence for wording a template can't express, such as another language's\n * grammar.\n */\nexport interface BitkitBulkActionsLabels {\n /** `selectionState=\"all\"`. Default: `All {totalItems} {items} selected.` */\n allSelected?: string;\n /** Default: `Cancel` */\n cancel?: string;\n /** The link offering the rows beyond this page. Default: `Select all {totalItems} {items}` */\n selectAll?: string;\n /** `selectionState=\"some\"`. Default: `{selectedCount} {items} selected.` */\n selected?: string;\n /** `selectionState=\"allOnPage\"`. Default: `{selectedCount} {items} selected on this page.` */\n selectedOnPage?: string;\n}\n\nconst DEFAULT_LABELS: Required<BitkitBulkActionsLabels> = {\n allSelected: 'All {totalItems} {items} selected.',\n cancel: 'Cancel',\n selectAll: 'Select all {totalItems} {items}',\n selected: '{selectedCount} {items} selected.',\n selectedOnPage: '{selectedCount} {items} selected on this page.',\n};\n\nconst DEFAULT_ITEMS: BitkitBulkActionsItems = { one: 'item', other: 'items' };\n\nconst resolveItems = (items: BitkitBulkActionsItems, count: number) => {\n if (typeof items === 'string') return items;\n return count === 1 ? items.one : items.other;\n};\n\nexport interface BitkitBulkActionsRowProps extends Omit<Table.RowProps, 'children'> {\n /** The bulk action buttons, rendered after `Cancel`. */\n children?: ReactNode;\n /** Must match the table's column count, so the row spans the full width. */\n colSpan: number;\n /** The counted noun. Default: `{ one: 'item', other: 'items' }` */\n items?: BitkitBulkActionsItems;\n labels?: BitkitBulkActionsLabels;\n onCancel: () => void;\n /** Renders the `Select all {totalItems} {items}` link while `selectionState=\"allOnPage\"`. */\n onSelectAll?: () => void;\n selectedCount: number;\n /**\n * `some` — part of the page is selected. `allOnPage` — the whole page is selected, and the rows\n * beyond it are still on offer. `all` — everything across every page is selected.\n */\n selectionState: 'some' | 'allOnPage' | 'all';\n totalItems: number;\n}\n\n/**\n * The bar above the column headers that appears while rows are selected: what is selected, the\n * offer to widen the selection to every page, and the actions to run on it. Belongs in\n * `
|
|
1
|
+
{"version":3,"file":"BitkitBulkActionsRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitBulkActionsRow.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { Text } from '@chakra-ui/react/text';\nimport { VisuallyHidden } from '@chakra-ui/react/visually-hidden';\nimport { forwardRef, type ReactNode, useEffect, useState } from 'react';\n\nimport formatLabel from '../../utilities/formatLabel';\nimport BitkitButton from '../BitkitButton/BitkitButton';\n\n/**\n * The noun the bar counts. A single string is used for every count; pass `{ one, other }` to get\n * `1 workflow selected.` instead of `1 workflows selected.`\n */\nexport type BitkitBulkActionsItems = string | { one: string; other: string };\n\n/**\n * Overrides for the bar's sentences. Each template can use `{items}` (the `items` prop, already\n * resolved to the form matching that sentence's count), `{selectedCount}` and `{totalItems}`.\n * Override a whole sentence for wording a template can't express, such as another language's\n * grammar.\n */\nexport interface BitkitBulkActionsLabels {\n /** `selectionState=\"all\"`. Default: `All {totalItems} {items} selected.` */\n allSelected?: string;\n /** Default: `Cancel` */\n cancel?: string;\n /** The link offering the rows beyond this page. Default: `Select all {totalItems} {items}` */\n selectAll?: string;\n /** `selectionState=\"some\"`. Default: `{selectedCount} {items} selected.` */\n selected?: string;\n /** `selectionState=\"allOnPage\"`. Default: `{selectedCount} {items} selected on this page.` */\n selectedOnPage?: string;\n}\n\nconst DEFAULT_LABELS: Required<BitkitBulkActionsLabels> = {\n allSelected: 'All {totalItems} {items} selected.',\n cancel: 'Cancel',\n selectAll: 'Select all {totalItems} {items}',\n selected: '{selectedCount} {items} selected.',\n selectedOnPage: '{selectedCount} {items} selected on this page.',\n};\n\nconst DEFAULT_ITEMS: BitkitBulkActionsItems = { one: 'item', other: 'items' };\n\nconst resolveItems = (items: BitkitBulkActionsItems, count: number) => {\n if (typeof items === 'string') return items;\n return count === 1 ? items.one : items.other;\n};\n\nexport interface BitkitBulkActionsRowProps extends Omit<Table.RowProps, 'children'> {\n /** The bulk action buttons, rendered after `Cancel`. */\n children?: ReactNode;\n /** Must match the table's column count, so the row spans the full width. */\n colSpan: number;\n /** The counted noun. Default: `{ one: 'item', other: 'items' }` */\n items?: BitkitBulkActionsItems;\n labels?: BitkitBulkActionsLabels;\n onCancel: () => void;\n /** Renders the `Select all {totalItems} {items}` link while `selectionState=\"allOnPage\"`. */\n onSelectAll?: () => void;\n selectedCount: number;\n /**\n * `some` — part of the page is selected. `allOnPage` — the whole page is selected, and the rows\n * beyond it are still on offer. `all` — everything across every page is selected.\n */\n selectionState: 'some' | 'allOnPage' | 'all';\n totalItems: number;\n}\n\n/**\n * The bar above the column headers that appears while rows are selected: what is selected, the\n * offer to widen the selection to every page, and the actions to run on it. Belongs in\n * `Table.Header`, before the `Table.Row` that holds the column headers.\n *\n * The count is mirrored into a visually hidden `aria-live` region, which is deliberately filled a\n * render after mount — a live region that enters the DOM with its text already in it is not\n * announced, so the first selection would go unspoken otherwise.\n *\n * @example\n * ```tsx\n * <Table.Header>\n * {selected.length > 0 && (\n * <BitkitBulkActionsRow\n * colSpan={COL_COUNT}\n * items={{ one: 'workflow', other: 'workflows' }}\n * onCancel={clearSelection}\n * onSelectAll={() => setAllAcrossPages(true)}\n * selectedCount={selected.length}\n * selectionState={selectionState}\n * totalItems={TOTAL_ITEMS}\n * >\n * <BitkitButton icon={IconMinusCircle} size=\"md\" variant=\"danger-secondary\">\n * Remove\n * </BitkitButton>\n * </BitkitBulkActionsRow>\n * )}\n * <Table.Row>{columnHeaders}</Table.Row>\n * </Table.Header>\n * ```\n */\nconst BitkitBulkActionsRow = forwardRef<HTMLTableRowElement, BitkitBulkActionsRowProps>((props, ref) => {\n const {\n children,\n colSpan,\n items = DEFAULT_ITEMS,\n labels: labelsProp,\n onCancel,\n onSelectAll,\n selectedCount,\n selectionState,\n totalItems,\n ...rest\n } = props;\n\n const styles = useTableStyles();\n const labels = { ...DEFAULT_LABELS, ...labelsProp };\n\n const countLabel = {\n all: labels.allSelected,\n allOnPage: labels.selectedOnPage,\n some: labels.selected,\n }[selectionState];\n const count = selectionState === 'all' ? totalItems : selectedCount;\n\n const countText = formatLabel(countLabel, {\n items: resolveItems(items, count),\n selectedCount,\n totalItems,\n });\n\n const selectAllText = formatLabel(labels.selectAll, {\n items: resolveItems(items, totalItems),\n selectedCount,\n totalItems,\n });\n\n const [announcement, setAnnouncement] = useState('');\n\n useEffect(() => {\n setAnnouncement(countText);\n }, [countText]);\n\n return (\n <Table.Row ref={ref} {...rest}>\n <Table.Cell colSpan={colSpan} css={styles.utilityCell}>\n <Box css={styles.bulkActionsGroup}>\n <Text color=\"text/body\" textStyle=\"body/md/regular\">\n {countText}\n </Text>\n <VisuallyHidden aria-live=\"polite\">{announcement}</VisuallyHidden>\n {selectionState === 'allOnPage' && !!onSelectAll && (\n <BitkitButton onClick={onSelectAll} size=\"sm\" variant=\"tertiary\">\n {selectAllText}\n </BitkitButton>\n )}\n <Box css={styles.bulkActionsButtons}>\n <BitkitButton onClick={onCancel} size=\"md\" variant=\"tertiary\">\n {labels.cancel}\n </BitkitButton>\n {children}\n </Box>\n </Box>\n </Table.Cell>\n </Table.Row>\n );\n});\n\nBitkitBulkActionsRow.displayName = 'BitkitBulkActionsRow';\n\nexport default BitkitBulkActionsRow;\n"],"mappings":";;;;;;;;;AAkCA,IAAM,iBAAoD;CACxD,aAAa;CACb,QAAQ;CACR,WAAW;CACX,UAAU;CACV,gBAAgB;AAClB;AAEA,IAAM,gBAAwC;CAAE,KAAK;CAAQ,OAAO;AAAQ;AAE5E,IAAM,gBAAgB,OAA+B,UAAkB;CACrE,IAAI,OAAO,UAAU,UAAU,OAAO;CACtC,OAAO,UAAU,IAAI,MAAM,MAAM,MAAM;AACzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA,IAAM,uBAAuB,YAA4D,OAAO,QAAQ;CACtG,MAAM,EACJ,UACA,SACA,QAAQ,eACR,QAAQ,YACR,UACA,aACA,eACA,gBACA,YACA,GAAG,SACD;CAEJ,MAAM,SAAS,eAAe;CAC9B,MAAM,SAAS;EAAE,GAAG;EAAgB,GAAG;CAAW;CAElD,MAAM,aAAa;EACjB,KAAK,OAAO;EACZ,WAAW,OAAO;EAClB,MAAM,OAAO;CACf,EAAE;CAGF,MAAM,YAAY,YAAY,YAAY;EACxC,OAAO,aAAa,OAHR,mBAAmB,QAAQ,aAAa,aAGpB;EAChC;EACA;CACF,CAAC;CAED,MAAM,gBAAgB,YAAY,OAAO,WAAW;EAClD,OAAO,aAAa,OAAO,UAAU;EACrC;EACA;CACF,CAAC;CAED,MAAM,CAAC,cAAc,mBAAmB,SAAS,EAAE;CAEnD,gBAAgB;EACd,gBAAgB,SAAS;CAC3B,GAAG,CAAC,SAAS,CAAC;CAEd,OACE,oBAAC,MAAM,KAAP;EAAgB;EAAK,GAAI;EACvB,UAAA,oBAAC,MAAM,MAAP;GAAqB;GAAS,KAAK,OAAO;GACxC,UAAA,qBAAC,KAAD;IAAK,KAAK,OAAO;IAAjB,UAAA;KACE,oBAAC,MAAD;MAAM,OAAM;MAAY,WAAU;MAC/B,UAAA;KACG,CAAA;KACN,oBAAC,gBAAD;MAAgB,aAAU;MAAU,UAAA;KAA6B,CAAA;KAChE,mBAAmB,eAAe,CAAC,CAAC,eACnC,oBAAC,cAAD;MAAc,SAAS;MAAa,MAAK;MAAK,SAAQ;MACnD,UAAA;KACW,CAAA;KAEhB,qBAAC,KAAD;MAAK,KAAK,OAAO;MAAjB,UAAA,CACE,oBAAC,cAAD;OAAc,SAAS;OAAU,MAAK;OAAK,SAAQ;OAChD,UAAA,OAAO;MACI,CAAA,GACb,QACE;;IACF;;EACK,CAAA;CACH,CAAA;AAEf,CAAC;AAED,qBAAqB,cAAc"}
|
|
@@ -2,7 +2,7 @@ import { Table } from '@chakra-ui/react/table';
|
|
|
2
2
|
import { BitkitDefinitionTooltipProps } from '../BitkitDefinitionTooltip/BitkitDefinitionTooltip';
|
|
3
3
|
/**
|
|
4
4
|
* Everything `BitkitDefinitionTooltip` takes — `children` is the column title, `text` the definition
|
|
5
|
-
* — on top of everything a `
|
|
5
|
+
* — on top of everything a `Table.ColumnHeader` takes. The two the header owns are gone: `textSize`,
|
|
6
6
|
* because the point is to keep the header's own type, and the tooltip's `truncate`, because the title
|
|
7
7
|
* always truncates and `truncate` stays the header cell's own style prop.
|
|
8
8
|
*/
|
|
@@ -17,7 +17,7 @@ export interface BitkitDefinitionColumnHeaderProps extends Omit<Table.ColumnHead
|
|
|
17
17
|
* the latter's recipe always applies a `textSize`, and there is no value for it that means "inherit".
|
|
18
18
|
*
|
|
19
19
|
* Only the title is the trigger, so the rest of the header stays inert. Everything else a
|
|
20
|
-
* `
|
|
20
|
+
* `Table.ColumnHeader` takes — `textAlign`, `width`, `colSpan` — still applies.
|
|
21
21
|
*/
|
|
22
22
|
declare const BitkitDefinitionColumnHeader: import('react').ForwardRefExoticComponent<BitkitDefinitionColumnHeaderProps & import('react').RefAttributes<HTMLTableCellElement>>;
|
|
23
23
|
export default BitkitDefinitionColumnHeader;
|
|
@@ -13,7 +13,7 @@ import { Table, useTableStyles } from "@chakra-ui/react/table";
|
|
|
13
13
|
* the latter's recipe always applies a `textSize`, and there is no value for it that means "inherit".
|
|
14
14
|
*
|
|
15
15
|
* Only the title is the trigger, so the rest of the header stays inert. Everything else a
|
|
16
|
-
* `
|
|
16
|
+
* `Table.ColumnHeader` takes — `textAlign`, `width`, `colSpan` — still applies.
|
|
17
17
|
*/
|
|
18
18
|
var BitkitDefinitionColumnHeader = forwardRef(({ button, children, disablePortal, learnMoreTarget, learnMoreUrl, method = "click", placement, text, ...rest }, ref) => {
|
|
19
19
|
const styles = useTableStyles();
|
|
@@ -46,7 +46,7 @@ var BitkitDefinitionColumnHeader = forwardRef(({ button, children, disablePortal
|
|
|
46
46
|
})
|
|
47
47
|
});
|
|
48
48
|
});
|
|
49
|
-
BitkitDefinitionColumnHeader.displayName = "
|
|
49
|
+
BitkitDefinitionColumnHeader.displayName = "BitkitDefinitionColumnHeader";
|
|
50
50
|
//#endregion
|
|
51
51
|
export { BitkitDefinitionColumnHeader as default };
|
|
52
52
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitDefinitionColumnHeader.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitDefinitionColumnHeader.tsx"],"sourcesContent":["import { chakra } from '@chakra-ui/react/styled-system';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, useState } from 'react';\n\nimport { type BitkitDefinitionTooltipProps } from '../BitkitDefinitionTooltip/BitkitDefinitionTooltip';\nimport BitkitTooltip from '../BitkitTooltip/BitkitTooltip';\n\n/**\n * Everything `BitkitDefinitionTooltip` takes — `children` is the column title, `text` the definition\n * — on top of everything a `
|
|
1
|
+
{"version":3,"file":"BitkitDefinitionColumnHeader.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitDefinitionColumnHeader.tsx"],"sourcesContent":["import { chakra } from '@chakra-ui/react/styled-system';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, useState } from 'react';\n\nimport { type BitkitDefinitionTooltipProps } from '../BitkitDefinitionTooltip/BitkitDefinitionTooltip';\nimport BitkitTooltip from '../BitkitTooltip/BitkitTooltip';\n\n/**\n * Everything `BitkitDefinitionTooltip` takes — `children` is the column title, `text` the definition\n * — on top of everything a `Table.ColumnHeader` takes. The two the header owns are gone: `textSize`,\n * because the point is to keep the header's own type, and the tooltip's `truncate`, because the title\n * always truncates and `truncate` stays the header cell's own style prop.\n */\nexport interface BitkitDefinitionColumnHeaderProps\n extends Omit<Table.ColumnHeaderProps, 'children'>, Omit<BitkitDefinitionTooltipProps, 'textSize' | 'truncate'> {}\n\n/**\n * A column header whose title is a glossary term: underlined, and revealing what the column means on\n * demand. It is `BitkitDefinitionTooltip` for a table header — same props, same behaviour, except the\n * title keeps the header's own type (`heading/h5`) instead of the body type that component pins.\n *\n * That type is also why it composes `BitkitTooltip` rather than rendering a `BitkitDefinitionTooltip`:\n * the latter's recipe always applies a `textSize`, and there is no value for it that means \"inherit\".\n *\n * Only the title is the trigger, so the rest of the header stays inert. Everything else a\n * `Table.ColumnHeader` takes — `textAlign`, `width`, `colSpan` — still applies.\n */\nconst BitkitDefinitionColumnHeader = forwardRef<HTMLTableCellElement, BitkitDefinitionColumnHeaderProps>(\n (\n { button, children, disablePortal, learnMoreTarget, learnMoreUrl, method = 'click', placement, text, ...rest },\n ref,\n ) => {\n const styles = useTableStyles();\n const [open, setOpen] = useState(false);\n const isClick = method === 'click';\n\n return (\n <Table.ColumnHeader ref={ref} {...rest}>\n <BitkitTooltip\n button={button}\n closeOnClick={isClick ? false : undefined}\n disablePortal={disablePortal}\n learnMoreTarget={learnMoreTarget}\n learnMoreUrl={learnMoreUrl}\n onOpenChange={\n isClick\n ? ({ open: nextOpen }) => {\n if (!nextOpen) setOpen(false);\n }\n : undefined\n }\n open={isClick ? open : undefined}\n openDelay={isClick ? Infinity : undefined}\n placement={placement}\n text={text}\n >\n {/* chakra.button: no named primitive attaches a recipe slot to a bare trigger button */}\n <chakra.button\n aria-expanded={isClick ? open : undefined}\n css={styles.definitionTrigger}\n onClick={isClick ? () => setOpen(!open) : undefined}\n truncate\n type=\"button\"\n >\n {children}\n </chakra.button>\n </BitkitTooltip>\n </Table.ColumnHeader>\n );\n },\n);\n\nBitkitDefinitionColumnHeader.displayName = 'BitkitDefinitionColumnHeader';\n\nexport default BitkitDefinitionColumnHeader;\n"],"mappings":";;;;;;;;;;;;;;;;;AA2BA,IAAM,+BAA+B,YAEjC,EAAE,QAAQ,UAAU,eAAe,iBAAiB,cAAc,SAAS,SAAS,WAAW,MAAM,GAAG,QACxG,QACG;CACH,MAAM,SAAS,eAAe;CAC9B,MAAM,CAAC,MAAM,WAAW,SAAS,KAAK;CACtC,MAAM,UAAU,WAAW;CAE3B,OACE,oBAAC,MAAM,cAAP;EAAyB;EAAK,GAAI;EAChC,UAAA,oBAAC,eAAD;GACU;GACR,cAAc,UAAU,QAAQ,KAAA;GACjB;GACE;GACH;GACd,cACE,WACK,EAAE,MAAM,eAAe;IACtB,IAAI,CAAC,UAAU,QAAQ,KAAK;GAC9B,IACA,KAAA;GAEN,MAAM,UAAU,OAAO,KAAA;GACvB,WAAW,UAAU,WAAW,KAAA;GACrB;GACL;GAGN,UAAA,oBAAC,OAAO,QAAR;IACE,iBAAe,UAAU,OAAO,KAAA;IAChC,KAAK,OAAO;IACZ,SAAS,gBAAgB,QAAQ,CAAC,IAAI,IAAI,KAAA;IAC1C,UAAA;IACA,MAAK;IAEJ;GACY,CAAA;EACF,CAAA;CACG,CAAA;AAExB,CACF;AAEA,6BAA6B,cAAc"}
|
|
@@ -37,7 +37,7 @@ var BitkitExpandableRow = forwardRef(({ children, colSpan, defaultOpen = false,
|
|
|
37
37
|
})] })
|
|
38
38
|
});
|
|
39
39
|
});
|
|
40
|
-
BitkitExpandableRow.displayName = "
|
|
40
|
+
BitkitExpandableRow.displayName = "BitkitExpandableRow";
|
|
41
41
|
//#endregion
|
|
42
42
|
export { BitkitExpandableRow as default };
|
|
43
43
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitExpandableRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitExpandableRow.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Collapsible } from '@chakra-ui/react/collapsible';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron';\n\nexport interface BitkitExpandableRowProps {\n children: ReactNode;\n colSpan: number;\n defaultOpen?: boolean;\n expandedContent: ReactNode;\n}\n\nconst BitkitExpandableRow = forwardRef<HTMLTableRowElement, BitkitExpandableRowProps>(\n ({ children, colSpan, defaultOpen = false, expandedContent }, ref) => {\n const styles = useTableStyles();\n\n return (\n <Collapsible.Root asChild defaultOpen={defaultOpen}>\n <>\n <Table.Row ref={ref} css={styles.expandableRow}>\n <Table.Cell css={styles.expandCell}>\n <Collapsible.Trigger aria-label=\"Toggle row details\" css={styles.expandTrigger}>\n <Collapsible.Indicator asChild>\n <AssetSelectChevron color=\"button/secondary/text\" />\n </Collapsible.Indicator>\n </Collapsible.Trigger>\n </Table.Cell>\n {children}\n </Table.Row>\n <Table.Row css={styles.expandedRow}>\n <Table.Cell colSpan={colSpan} css={styles.expandedCell}>\n <Collapsible.Content>\n <Box css={styles.expandedContent}>{expandedContent}</Box>\n </Collapsible.Content>\n </Table.Cell>\n </Table.Row>\n </>\n </Collapsible.Root>\n );\n },\n);\n\nBitkitExpandableRow.displayName = '
|
|
1
|
+
{"version":3,"file":"BitkitExpandableRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitExpandableRow.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Collapsible } from '@chakra-ui/react/collapsible';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron';\n\nexport interface BitkitExpandableRowProps {\n children: ReactNode;\n colSpan: number;\n defaultOpen?: boolean;\n expandedContent: ReactNode;\n}\n\nconst BitkitExpandableRow = forwardRef<HTMLTableRowElement, BitkitExpandableRowProps>(\n ({ children, colSpan, defaultOpen = false, expandedContent }, ref) => {\n const styles = useTableStyles();\n\n return (\n <Collapsible.Root asChild defaultOpen={defaultOpen}>\n <>\n <Table.Row ref={ref} css={styles.expandableRow}>\n <Table.Cell css={styles.expandCell}>\n <Collapsible.Trigger aria-label=\"Toggle row details\" css={styles.expandTrigger}>\n <Collapsible.Indicator asChild>\n <AssetSelectChevron color=\"button/secondary/text\" />\n </Collapsible.Indicator>\n </Collapsible.Trigger>\n </Table.Cell>\n {children}\n </Table.Row>\n <Table.Row css={styles.expandedRow}>\n <Table.Cell colSpan={colSpan} css={styles.expandedCell}>\n <Collapsible.Content>\n <Box css={styles.expandedContent}>{expandedContent}</Box>\n </Collapsible.Content>\n </Table.Cell>\n </Table.Row>\n </>\n </Collapsible.Root>\n );\n },\n);\n\nBitkitExpandableRow.displayName = 'BitkitExpandableRow';\n\nexport default BitkitExpandableRow;\n"],"mappings":";;;;;;;AAcA,IAAM,sBAAsB,YACzB,EAAE,UAAU,SAAS,cAAc,OAAO,mBAAmB,QAAQ;CACpE,MAAM,SAAS,eAAe;CAE9B,OACE,oBAAC,YAAY,MAAb;EAAkB,SAAA;EAAqB;EACrC,UAAA,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,MAAM,KAAP;GAAgB;GAAK,KAAK,OAAO;GAAjC,UAAA,CACE,oBAAC,MAAM,MAAP;IAAY,KAAK,OAAO;IACtB,UAAA,oBAAC,YAAY,SAAb;KAAqB,cAAW;KAAqB,KAAK,OAAO;KAC/D,UAAA,oBAAC,YAAY,WAAb;MAAuB,SAAA;MACrB,UAAA,oBAAC,oBAAD,EAAoB,OAAM,wBAAyB,CAAA;KAC9B,CAAA;IACJ,CAAA;GACX,CAAA,GACX,QACQ;EACX,CAAA,GAAA,oBAAC,MAAM,KAAP;GAAW,KAAK,OAAO;GACrB,UAAA,oBAAC,MAAM,MAAP;IAAqB;IAAS,KAAK,OAAO;IACxC,UAAA,oBAAC,YAAY,SAAb,EAAA,UACE,oBAAC,KAAD;KAAK,KAAK,OAAO;KAAkB,UAAA;IAAqB,CAAA,EACrC,CAAA;GACX,CAAA;EACH,CAAA,CACX,EAAA,CAAA;CACc,CAAA;AAEtB,CACF;AAEA,oBAAoB,cAAc"}
|
|
@@ -7,18 +7,18 @@ export interface BitkitFilterRowProps extends Omit<Table.RowProps, 'children'> {
|
|
|
7
7
|
colSpan: number;
|
|
8
8
|
}
|
|
9
9
|
/**
|
|
10
|
-
* A full-width row of filter controls above the column headers. Belongs in `
|
|
11
|
-
* the `
|
|
10
|
+
* A full-width row of filter controls above the column headers. Belongs in `Table.Header`, before
|
|
11
|
+
* the `Table.Row` that holds the column headers.
|
|
12
12
|
*
|
|
13
13
|
* @example
|
|
14
14
|
* ```tsx
|
|
15
|
-
* <
|
|
16
|
-
* <
|
|
15
|
+
* <Table.Header>
|
|
16
|
+
* <BitkitFilterRow colSpan={COL_COUNT}>
|
|
17
17
|
* <BitkitSearchInput onChange={...} value={search} />
|
|
18
18
|
* <BitkitSelect items={teams} onValueChange={...} value={team} />
|
|
19
|
-
* </
|
|
20
|
-
* <
|
|
21
|
-
* </
|
|
19
|
+
* </BitkitFilterRow>
|
|
20
|
+
* <Table.Row>{columnHeaders}</Table.Row>
|
|
21
|
+
* </Table.Header>
|
|
22
22
|
* ```
|
|
23
23
|
*/
|
|
24
24
|
declare const BitkitFilterRow: import('react').ForwardRefExoticComponent<BitkitFilterRowProps & import('react').RefAttributes<HTMLTableRowElement>>;
|
|
@@ -4,18 +4,18 @@ import { jsx } from "react/jsx-runtime";
|
|
|
4
4
|
import { Table, useTableStyles } from "@chakra-ui/react/table";
|
|
5
5
|
//#region lib/components/BitkitTable/BitkitFilterRow.tsx
|
|
6
6
|
/**
|
|
7
|
-
* A full-width row of filter controls above the column headers. Belongs in `
|
|
8
|
-
* the `
|
|
7
|
+
* A full-width row of filter controls above the column headers. Belongs in `Table.Header`, before
|
|
8
|
+
* the `Table.Row` that holds the column headers.
|
|
9
9
|
*
|
|
10
10
|
* @example
|
|
11
11
|
* ```tsx
|
|
12
|
-
* <
|
|
13
|
-
* <
|
|
12
|
+
* <Table.Header>
|
|
13
|
+
* <BitkitFilterRow colSpan={COL_COUNT}>
|
|
14
14
|
* <BitkitSearchInput onChange={...} value={search} />
|
|
15
15
|
* <BitkitSelect items={teams} onValueChange={...} value={team} />
|
|
16
|
-
* </
|
|
17
|
-
* <
|
|
18
|
-
* </
|
|
16
|
+
* </BitkitFilterRow>
|
|
17
|
+
* <Table.Row>{columnHeaders}</Table.Row>
|
|
18
|
+
* </Table.Header>
|
|
19
19
|
* ```
|
|
20
20
|
*/
|
|
21
21
|
var BitkitFilterRow = forwardRef((props, ref) => {
|
|
@@ -34,7 +34,7 @@ var BitkitFilterRow = forwardRef((props, ref) => {
|
|
|
34
34
|
})
|
|
35
35
|
});
|
|
36
36
|
});
|
|
37
|
-
BitkitFilterRow.displayName = "
|
|
37
|
+
BitkitFilterRow.displayName = "BitkitFilterRow";
|
|
38
38
|
//#endregion
|
|
39
39
|
export { BitkitFilterRow as default };
|
|
40
40
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitFilterRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitFilterRow.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type ReactNode } from 'react';\n\nexport interface BitkitFilterRowProps extends Omit<Table.RowProps, 'children'> {\n /** The filter controls. Laid out in a wrapping row, so any number of them fits. */\n children: ReactNode;\n /** Must match the table's column count, so the row spans the full width. */\n colSpan: number;\n}\n\n/**\n * A full-width row of filter controls above the column headers. Belongs in `
|
|
1
|
+
{"version":3,"file":"BitkitFilterRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitFilterRow.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type ReactNode } from 'react';\n\nexport interface BitkitFilterRowProps extends Omit<Table.RowProps, 'children'> {\n /** The filter controls. Laid out in a wrapping row, so any number of them fits. */\n children: ReactNode;\n /** Must match the table's column count, so the row spans the full width. */\n colSpan: number;\n}\n\n/**\n * A full-width row of filter controls above the column headers. Belongs in `Table.Header`, before\n * the `Table.Row` that holds the column headers.\n *\n * @example\n * ```tsx\n * <Table.Header>\n * <BitkitFilterRow colSpan={COL_COUNT}>\n * <BitkitSearchInput onChange={...} value={search} />\n * <BitkitSelect items={teams} onValueChange={...} value={team} />\n * </BitkitFilterRow>\n * <Table.Row>{columnHeaders}</Table.Row>\n * </Table.Header>\n * ```\n */\nconst BitkitFilterRow = forwardRef<HTMLTableRowElement, BitkitFilterRowProps>((props, ref) => {\n const { children, colSpan, ...rest } = props;\n const styles = useTableStyles();\n\n return (\n <Table.Row ref={ref} {...rest}>\n <Table.Cell colSpan={colSpan} css={styles.utilityCell}>\n <Box css={styles.filterControls}>{children}</Box>\n </Table.Cell>\n </Table.Row>\n );\n});\n\nBitkitFilterRow.displayName = 'BitkitFilterRow';\n\nexport default BitkitFilterRow;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA0BA,IAAM,kBAAkB,YAAuD,OAAO,QAAQ;CAC5F,MAAM,EAAE,UAAU,SAAS,GAAG,SAAS;CACvC,MAAM,SAAS,eAAe;CAE9B,OACE,oBAAC,MAAM,KAAP;EAAgB;EAAK,GAAI;EACvB,UAAA,oBAAC,MAAM,MAAP;GAAqB;GAAS,KAAK,OAAO;GACxC,UAAA,oBAAC,KAAD;IAAK,KAAK,OAAO;IAAiB;GAAc,CAAA;EACtC,CAAA;CACH,CAAA;AAEf,CAAC;AAED,gBAAgB,cAAc"}
|
|
@@ -5,26 +5,26 @@ import { Table, useTableStyles } from "@chakra-ui/react/table";
|
|
|
5
5
|
//#region lib/components/BitkitTable/BitkitLinkedRow.tsx
|
|
6
6
|
/**
|
|
7
7
|
* A table row that navigates as a whole. Exactly one of its cells must be a
|
|
8
|
-
* `
|
|
9
|
-
*
|
|
8
|
+
* `BitkitLinkedRow.LinkCell` holding the row's link — that link's text becomes the row's accessible
|
|
9
|
+
* name, and its stretched pseudo-element makes the entire row the click and focus target.
|
|
10
10
|
*
|
|
11
11
|
* Interactive elements in the other cells (buttons, checkboxes, other links) stay clickable: they
|
|
12
|
-
* are lifted above the stretched link, so a `
|
|
12
|
+
* are lifted above the stretched link, so a `BitkitRowActionsCell` works inside a linked row.
|
|
13
13
|
*
|
|
14
14
|
* Neither requirement is enforced: a row without a `LinkCell`, or one whose link has no `href`,
|
|
15
15
|
* still renders with the linked-row styling — hover affordance included — and navigates nowhere.
|
|
16
16
|
*
|
|
17
17
|
* @example
|
|
18
18
|
* ```tsx
|
|
19
|
-
* <
|
|
20
|
-
* <
|
|
19
|
+
* <BitkitLinkedRow>
|
|
20
|
+
* <BitkitLinkedRow.LinkCell>
|
|
21
21
|
* <BitkitLink colorVariant="purple" href={`/workflows/${row.id}`}>
|
|
22
22
|
* {row.name}
|
|
23
23
|
* </BitkitLink>
|
|
24
|
-
* </
|
|
25
|
-
* <
|
|
26
|
-
* <
|
|
27
|
-
* </
|
|
24
|
+
* </BitkitLinkedRow.LinkCell>
|
|
25
|
+
* <Table.Cell>{row.status}</Table.Cell>
|
|
26
|
+
* <BitkitRowActionsCell actions={actions} />
|
|
27
|
+
* </BitkitLinkedRow>
|
|
28
28
|
* ```
|
|
29
29
|
*/
|
|
30
30
|
var BitkitLinkedRow = forwardRef((props, ref) => {
|
|
@@ -37,7 +37,7 @@ var BitkitLinkedRow = forwardRef((props, ref) => {
|
|
|
37
37
|
children
|
|
38
38
|
});
|
|
39
39
|
});
|
|
40
|
-
BitkitLinkedRow.displayName = "
|
|
40
|
+
BitkitLinkedRow.displayName = "BitkitLinkedRow";
|
|
41
41
|
/**
|
|
42
42
|
* The cell that carries the row's link, so give it the cell that names the row. The cell only
|
|
43
43
|
* stretches its link across the row, leaving the styling to the link itself.
|
|
@@ -53,7 +53,7 @@ var LinkCell = forwardRef((props, ref) => {
|
|
|
53
53
|
children
|
|
54
54
|
});
|
|
55
55
|
});
|
|
56
|
-
LinkCell.displayName = "
|
|
56
|
+
LinkCell.displayName = "BitkitLinkedRow.LinkCell";
|
|
57
57
|
var BitkitLinkedRow_default = withSubComponents(BitkitLinkedRow, { LinkCell });
|
|
58
58
|
//#endregion
|
|
59
59
|
export { BitkitLinkedRow_default as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitLinkedRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitLinkedRow.tsx"],"sourcesContent":["import { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type ReactElement } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { type BitkitLinkProps } from '../BitkitLink/BitkitLink';\n\nexport type BitkitLinkedRowProps = Omit<Table.RowProps, 'onClick'>;\n\n/**\n * A table row that navigates as a whole. Exactly one of its cells must be a\n * `
|
|
1
|
+
{"version":3,"file":"BitkitLinkedRow.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitLinkedRow.tsx"],"sourcesContent":["import { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type ReactElement } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { type BitkitLinkProps } from '../BitkitLink/BitkitLink';\n\nexport type BitkitLinkedRowProps = Omit<Table.RowProps, 'onClick'>;\n\n/**\n * A table row that navigates as a whole. Exactly one of its cells must be a\n * `BitkitLinkedRow.LinkCell` holding the row's link — that link's text becomes the row's accessible\n * name, and its stretched pseudo-element makes the entire row the click and focus target.\n *\n * Interactive elements in the other cells (buttons, checkboxes, other links) stay clickable: they\n * are lifted above the stretched link, so a `BitkitRowActionsCell` works inside a linked row.\n *\n * Neither requirement is enforced: a row without a `LinkCell`, or one whose link has no `href`,\n * still renders with the linked-row styling — hover affordance included — and navigates nowhere.\n *\n * @example\n * ```tsx\n * <BitkitLinkedRow>\n * <BitkitLinkedRow.LinkCell>\n * <BitkitLink colorVariant=\"purple\" href={`/workflows/${row.id}`}>\n * {row.name}\n * </BitkitLink>\n * </BitkitLinkedRow.LinkCell>\n * <Table.Cell>{row.status}</Table.Cell>\n * <BitkitRowActionsCell actions={actions} />\n * </BitkitLinkedRow>\n * ```\n */\nconst BitkitLinkedRow = forwardRef<HTMLTableRowElement, BitkitLinkedRowProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useTableStyles();\n\n return (\n <Table.Row ref={ref} css={styles.linkedRow} {...rest}>\n {children}\n </Table.Row>\n );\n});\n\nBitkitLinkedRow.displayName = 'BitkitLinkedRow';\n\nexport interface BitkitLinkedRowLinkCellProps extends Omit<Table.CellProps, 'children'> {\n /**\n * The row's link: a single `BitkitLink` with its own `href`, `isExternal`, `colorVariant` and any\n * other link prop. The type only rules out bare text and multiple children — a non-link element,\n * or a `BitkitLink` without an `href`, type-checks as well and leaves the row looking linked\n * while navigating nowhere. Anything else the cell should show (an icon, a `VisuallyHidden` name)\n * goes inside the link.\n */\n children: ReactElement<BitkitLinkProps>;\n}\n\n/**\n * The cell that carries the row's link, so give it the cell that names the row. The cell only\n * stretches its link across the row, leaving the styling to the link itself.\n */\nconst LinkCell = forwardRef<HTMLTableCellElement, BitkitLinkedRowLinkCellProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useTableStyles();\n\n return (\n <Table.Cell ref={ref} css={styles.linkCell} data-link-cell {...rest}>\n {children}\n </Table.Cell>\n );\n});\n\nLinkCell.displayName = 'BitkitLinkedRow.LinkCell';\n\nexport default withSubComponents(BitkitLinkedRow, { LinkCell });\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,IAAM,kBAAkB,YAAuD,OAAO,QAAQ;CAC5F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,eAAe;CAE9B,OACE,oBAAC,MAAM,KAAP;EAAgB;EAAK,KAAK,OAAO;EAAW,GAAI;EAC7C;CACQ,CAAA;AAEf,CAAC;AAED,gBAAgB,cAAc;;;;;AAiB9B,IAAM,WAAW,YAAgE,OAAO,QAAQ;CAC9F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,eAAe;CAE9B,OACE,oBAAC,MAAM,MAAP;EAAiB;EAAK,KAAK,OAAO;EAAU,kBAAA;EAAe,GAAI;EAC5D;CACS,CAAA;AAEhB,CAAC;AAED,SAAS,cAAc;AAEvB,IAAA,0BAAe,kBAAkB,iBAAiB,EAAE,SAAS,CAAC"}
|
|
@@ -32,11 +32,11 @@ export interface BitkitRowActionsCellProps extends Omit<Table.CellProps, 'childr
|
|
|
32
32
|
*
|
|
33
33
|
* Up to two actions render as inline icon buttons; from the third on they collapse into a single
|
|
34
34
|
* action menu, so the column width stays predictable. Clicks are kept inside the cell, so the
|
|
35
|
-
* actions work in a `
|
|
35
|
+
* actions work in a `BitkitLinkedRow` without triggering the row link.
|
|
36
36
|
*
|
|
37
37
|
* @example
|
|
38
38
|
* ```tsx
|
|
39
|
-
* <
|
|
39
|
+
* <BitkitRowActionsCell
|
|
40
40
|
* actions={[
|
|
41
41
|
* { icon: IconPencil, label: 'Edit', onClick: onEdit },
|
|
42
42
|
* { danger: true, icon: IconMinusCircle, label: 'Remove', onClick: onRemove },
|
|
@@ -50,11 +50,11 @@ var MenuAction = ({ action }) => {
|
|
|
50
50
|
*
|
|
51
51
|
* Up to two actions render as inline icon buttons; from the third on they collapse into a single
|
|
52
52
|
* action menu, so the column width stays predictable. Clicks are kept inside the cell, so the
|
|
53
|
-
* actions work in a `
|
|
53
|
+
* actions work in a `BitkitLinkedRow` without triggering the row link.
|
|
54
54
|
*
|
|
55
55
|
* @example
|
|
56
56
|
* ```tsx
|
|
57
|
-
* <
|
|
57
|
+
* <BitkitRowActionsCell
|
|
58
58
|
* actions={[
|
|
59
59
|
* { icon: IconPencil, label: 'Edit', onClick: onEdit },
|
|
60
60
|
* { danger: true, icon: IconMinusCircle, label: 'Remove', onClick: onRemove },
|
|
@@ -85,7 +85,7 @@ var BitkitRowActionsCell = forwardRef((props, ref) => {
|
|
|
85
85
|
})
|
|
86
86
|
});
|
|
87
87
|
});
|
|
88
|
-
BitkitRowActionsCell.displayName = "
|
|
88
|
+
BitkitRowActionsCell.displayName = "BitkitRowActionsCell";
|
|
89
89
|
//#endregion
|
|
90
90
|
export { BitkitRowActionsCell as default };
|
|
91
91
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitRowActionsCell.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitRowActionsCell.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type MouseEvent } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport IconMoreVertical from '../../icons/IconMoreVertical';\nimport BitkitActionMenu from '../BitkitActionMenu/BitkitActionMenu';\nimport BitkitControlButton from '../BitkitControlButton/BitkitControlButton';\n\n/** One row action, rendered either as an inline control button or as an action menu item. */\nexport interface BitkitRowAction {\n /** Renders the action in the danger color set. */\n danger?: boolean;\n /** Makes the action a link instead of a button. */\n href?: string;\n icon: BitkitIconComponent;\n /** Only with `href`: opens the link in a new tab and adds the external-link affordance. */\n isExternal?: boolean;\n /** Accessible name of the inline button, and the visible text of the menu item. Must be unique\n * within `actions`, since it keys the list. */\n label: string;\n onClick?: (event: MouseEvent<HTMLElement>) => void;\n /**\n * `disabled` makes this one action inert. `skeleton` marks it as in flight: an inline action\n * shimmers in place, and in the collapsed menu the trigger shimmers instead — the state belongs\n * to the row, and the items sit behind a closed menu. Menu items are inert under either state.\n */\n state?: 'disabled' | 'skeleton';\n}\n\nexport interface BitkitRowActionsCellProps extends Omit<Table.CellProps, 'children' | 'onClick'> {\n /** Up to two actions render as inline icon buttons; three or more collapse into an action menu. */\n actions: BitkitRowAction[];\n /** Accessible name of the action menu trigger, used from the third action on. Default: `More actions` */\n menuLabel?: string;\n}\n\nconst MAX_INLINE_ACTIONS = 2;\n\nconst InlineAction = ({ action }: { action: BitkitRowAction }) => {\n if (action.href !== undefined) {\n return (\n <BitkitControlButton\n href={action.href}\n icon={action.icon}\n isDanger={action.danger}\n isExternal={action.isExternal}\n label={action.label}\n onClick={action.onClick}\n state={action.state}\n />\n );\n }\n\n return (\n <BitkitControlButton\n icon={action.icon}\n isDanger={action.danger}\n label={action.label}\n onClick={action.onClick}\n state={action.state}\n />\n );\n};\n\nconst MenuAction = ({ action }: { action: BitkitRowAction }) => {\n if (action.href !== undefined) {\n return (\n <BitkitActionMenu.Item\n disabled={action.state !== undefined}\n href={action.href}\n icon={action.icon}\n isDanger={action.danger}\n isExternal={action.isExternal}\n onClick={action.onClick}\n value={action.label}\n >\n {action.label}\n </BitkitActionMenu.Item>\n );\n }\n\n return (\n <BitkitActionMenu.Item\n disabled={action.state !== undefined}\n icon={action.icon}\n isDanger={action.danger}\n onClick={action.onClick}\n value={action.label}\n >\n {action.label}\n </BitkitActionMenu.Item>\n );\n};\n\n/**\n * The trailing cell of a table row, holding its actions. The column shrinks to fit the buttons.\n *\n * Up to two actions render as inline icon buttons; from the third on they collapse into a single\n * action menu, so the column width stays predictable. Clicks are kept inside the cell, so the\n * actions work in a `
|
|
1
|
+
{"version":3,"file":"BitkitRowActionsCell.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitRowActionsCell.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type MouseEvent } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport IconMoreVertical from '../../icons/IconMoreVertical';\nimport BitkitActionMenu from '../BitkitActionMenu/BitkitActionMenu';\nimport BitkitControlButton from '../BitkitControlButton/BitkitControlButton';\n\n/** One row action, rendered either as an inline control button or as an action menu item. */\nexport interface BitkitRowAction {\n /** Renders the action in the danger color set. */\n danger?: boolean;\n /** Makes the action a link instead of a button. */\n href?: string;\n icon: BitkitIconComponent;\n /** Only with `href`: opens the link in a new tab and adds the external-link affordance. */\n isExternal?: boolean;\n /** Accessible name of the inline button, and the visible text of the menu item. Must be unique\n * within `actions`, since it keys the list. */\n label: string;\n onClick?: (event: MouseEvent<HTMLElement>) => void;\n /**\n * `disabled` makes this one action inert. `skeleton` marks it as in flight: an inline action\n * shimmers in place, and in the collapsed menu the trigger shimmers instead — the state belongs\n * to the row, and the items sit behind a closed menu. Menu items are inert under either state.\n */\n state?: 'disabled' | 'skeleton';\n}\n\nexport interface BitkitRowActionsCellProps extends Omit<Table.CellProps, 'children' | 'onClick'> {\n /** Up to two actions render as inline icon buttons; three or more collapse into an action menu. */\n actions: BitkitRowAction[];\n /** Accessible name of the action menu trigger, used from the third action on. Default: `More actions` */\n menuLabel?: string;\n}\n\nconst MAX_INLINE_ACTIONS = 2;\n\nconst InlineAction = ({ action }: { action: BitkitRowAction }) => {\n if (action.href !== undefined) {\n return (\n <BitkitControlButton\n href={action.href}\n icon={action.icon}\n isDanger={action.danger}\n isExternal={action.isExternal}\n label={action.label}\n onClick={action.onClick}\n state={action.state}\n />\n );\n }\n\n return (\n <BitkitControlButton\n icon={action.icon}\n isDanger={action.danger}\n label={action.label}\n onClick={action.onClick}\n state={action.state}\n />\n );\n};\n\nconst MenuAction = ({ action }: { action: BitkitRowAction }) => {\n if (action.href !== undefined) {\n return (\n <BitkitActionMenu.Item\n disabled={action.state !== undefined}\n href={action.href}\n icon={action.icon}\n isDanger={action.danger}\n isExternal={action.isExternal}\n onClick={action.onClick}\n value={action.label}\n >\n {action.label}\n </BitkitActionMenu.Item>\n );\n }\n\n return (\n <BitkitActionMenu.Item\n disabled={action.state !== undefined}\n icon={action.icon}\n isDanger={action.danger}\n onClick={action.onClick}\n value={action.label}\n >\n {action.label}\n </BitkitActionMenu.Item>\n );\n};\n\n/**\n * The trailing cell of a table row, holding its actions. The column shrinks to fit the buttons.\n *\n * Up to two actions render as inline icon buttons; from the third on they collapse into a single\n * action menu, so the column width stays predictable. Clicks are kept inside the cell, so the\n * actions work in a `BitkitLinkedRow` without triggering the row link.\n *\n * @example\n * ```tsx\n * <BitkitRowActionsCell\n * actions={[\n * { icon: IconPencil, label: 'Edit', onClick: onEdit },\n * { danger: true, icon: IconMinusCircle, label: 'Remove', onClick: onRemove },\n * ]}\n * />\n * ```\n */\nconst BitkitRowActionsCell = forwardRef<HTMLTableCellElement, BitkitRowActionsCellProps>((props, ref) => {\n const { actions, menuLabel = 'More actions', ...rest } = props;\n const styles = useTableStyles();\n const isPending = actions.some((action) => action.state === 'skeleton');\n\n return (\n <Table.Cell ref={ref} css={styles.actionsCell} {...rest}>\n <Box css={styles.actionsGroup} onClick={(event) => event.stopPropagation()}>\n {actions.length <= MAX_INLINE_ACTIONS ? (\n actions.map((action) => <InlineAction key={action.label} action={action} />)\n ) : (\n <BitkitActionMenu\n size=\"md\"\n trigger={\n <BitkitControlButton\n icon={IconMoreVertical}\n label={menuLabel}\n state={isPending ? 'skeleton' : undefined}\n />\n }\n >\n {actions.map((action) => (\n <MenuAction key={action.label} action={action} />\n ))}\n </BitkitActionMenu>\n )}\n </Box>\n </Table.Cell>\n );\n});\n\nBitkitRowActionsCell.displayName = 'BitkitRowActionsCell';\n\nexport default BitkitRowActionsCell;\n"],"mappings":";;;;;;;;AAqCA,IAAM,qBAAqB;AAE3B,IAAM,gBAAgB,EAAE,aAA0C;CAChE,IAAI,OAAO,SAAS,KAAA,GAClB,OACE,oBAAC,qBAAD;EACE,MAAM,OAAO;EACb,MAAM,OAAO;EACb,UAAU,OAAO;EACjB,YAAY,OAAO;EACnB,OAAO,OAAO;EACd,SAAS,OAAO;EAChB,OAAO,OAAO;CACf,CAAA;CAIL,OACE,oBAAC,qBAAD;EACE,MAAM,OAAO;EACb,UAAU,OAAO;EACjB,OAAO,OAAO;EACd,SAAS,OAAO;EAChB,OAAO,OAAO;CACf,CAAA;AAEL;AAEA,IAAM,cAAc,EAAE,aAA0C;CAC9D,IAAI,OAAO,SAAS,KAAA,GAClB,OACE,oBAAC,yBAAiB,MAAlB;EACE,UAAU,OAAO,UAAU,KAAA;EAC3B,MAAM,OAAO;EACb,MAAM,OAAO;EACb,UAAU,OAAO;EACjB,YAAY,OAAO;EACnB,SAAS,OAAO;EAChB,OAAO,OAAO;EAEb,UAAA,OAAO;CACa,CAAA;CAI3B,OACE,oBAAC,yBAAiB,MAAlB;EACE,UAAU,OAAO,UAAU,KAAA;EAC3B,MAAM,OAAO;EACb,UAAU,OAAO;EACjB,SAAS,OAAO;EAChB,OAAO,OAAO;EAEb,UAAA,OAAO;CACa,CAAA;AAE3B;;;;;;;;;;;;;;;;;;AAmBA,IAAM,uBAAuB,YAA6D,OAAO,QAAQ;CACvG,MAAM,EAAE,SAAS,YAAY,gBAAgB,GAAG,SAAS;CACzD,MAAM,SAAS,eAAe;CAC9B,MAAM,YAAY,QAAQ,MAAM,WAAW,OAAO,UAAU,UAAU;CAEtE,OACE,oBAAC,MAAM,MAAP;EAAiB;EAAK,KAAK,OAAO;EAAa,GAAI;EACjD,UAAA,oBAAC,KAAD;GAAK,KAAK,OAAO;GAAc,UAAU,UAAU,MAAM,gBAAgB;GACtE,UAAA,QAAQ,UAAU,qBACjB,QAAQ,KAAK,WAAW,oBAAC,cAAD,EAAyC,OAAS,GAA/B,OAAO,KAAwB,CAAC,IAE3E,oBAAC,0BAAD;IACE,MAAK;IACL,SACE,oBAAC,qBAAD;KACE,MAAM;KACN,OAAO;KACP,OAAO,YAAY,aAAa,KAAA;IACjC,CAAA;IAGF,UAAA,QAAQ,KAAK,WACZ,oBAAC,YAAD,EAAuC,OAAS,GAA/B,OAAO,KAAwB,CACjD;GACe,CAAA;EAEjB,CAAA;CACK,CAAA;AAEhB,CAAC;AAED,qBAAqB,cAAc"}
|
|
@@ -61,7 +61,7 @@ var BitkitSortableColumnHeader = forwardRef(({ children, direction, onSort, text
|
|
|
61
61
|
})
|
|
62
62
|
});
|
|
63
63
|
});
|
|
64
|
-
BitkitSortableColumnHeader.displayName = "
|
|
64
|
+
BitkitSortableColumnHeader.displayName = "BitkitSortableColumnHeader";
|
|
65
65
|
//#endregion
|
|
66
66
|
export { BitkitSortableColumnHeader as default };
|
|
67
67
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitSortableColumnHeader.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitSortableColumnHeader.tsx"],"sourcesContent":["import { Icon, type IconProps } from '@chakra-ui/react/icon';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type Ref } from 'react';\n\ntype SortDirection = 'ascending' | 'descending' | 'none';\n\nexport interface BitkitSortableColumnHeaderProps extends Omit<Table.ColumnHeaderProps, 'aria-sort' | 'onClick'> {\n direction: SortDirection;\n onSort: () => void;\n}\n\nconst SortIcon = forwardRef((props: IconProps & { direction: SortDirection }, ref: Ref<SVGSVGElement>) => {\n const { direction, ...rest } = props;\n const upFill = direction === 'ascending' ? 'currentColor' : 'var(--sort-icon-inactive)';\n const downFill = direction === 'descending' ? 'currentColor' : 'var(--sort-icon-inactive)';\n\n return (\n <Icon\n ref={ref}\n asChild\n css={{\n '--sort-icon-inactive': 'colors.icon/disabled',\n color: 'icon/primary',\n display: 'inline-block',\n verticalAlign: 'middle',\n }}\n {...rest}\n >\n <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.617 4.461 7.684 9.18c-.271.326-.04.82.384.82h7.865c.424 0 .655-.494.384-.82l-3.933-4.719a.5.5 0 0 0-.767 0Z\"\n fill={upFill}\n />\n <path\n d=\"M12.384 19.539l3.933-4.719c.27-.326.04-.82-.384-.82H8.068c-.424 0-.655.494-.384.82l3.933 4.719a.5.5 0 0 0 .767 0Z\"\n fill={downFill}\n />\n </svg>\n </Icon>\n );\n});\n\nSortIcon.displayName = 'SortIcon';\n\nconst BitkitSortableColumnHeader = forwardRef<HTMLTableCellElement, BitkitSortableColumnHeaderProps>(\n ({ children, direction, onSort, textAlign, ...rest }, ref) => {\n const styles = useTableStyles();\n const isEndAligned = textAlign === 'end';\n const sortIcon = <SortIcon direction={direction} />;\n\n return (\n <Table.ColumnHeader\n ref={ref}\n aria-sort={direction === 'none' ? undefined : direction}\n css={styles.sortColumnHeader}\n {...rest}\n >\n {/* chakra.button: no named primitive attaches a recipe slot to a bare trigger button */}\n <chakra.button\n css={styles.sortTrigger}\n justifyContent={isEndAligned ? 'flex-end' : undefined}\n onClick={onSort}\n type=\"button\"\n >\n {isEndAligned ? (\n <>\n {sortIcon} {children}\n </>\n ) : (\n <>\n {children} {sortIcon}\n </>\n )}\n </chakra.button>\n </Table.ColumnHeader>\n );\n },\n);\n\nBitkitSortableColumnHeader.displayName = '
|
|
1
|
+
{"version":3,"file":"BitkitSortableColumnHeader.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitSortableColumnHeader.tsx"],"sourcesContent":["import { Icon, type IconProps } from '@chakra-ui/react/icon';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { Table, useTableStyles } from '@chakra-ui/react/table';\nimport { forwardRef, type Ref } from 'react';\n\ntype SortDirection = 'ascending' | 'descending' | 'none';\n\nexport interface BitkitSortableColumnHeaderProps extends Omit<Table.ColumnHeaderProps, 'aria-sort' | 'onClick'> {\n direction: SortDirection;\n onSort: () => void;\n}\n\nconst SortIcon = forwardRef((props: IconProps & { direction: SortDirection }, ref: Ref<SVGSVGElement>) => {\n const { direction, ...rest } = props;\n const upFill = direction === 'ascending' ? 'currentColor' : 'var(--sort-icon-inactive)';\n const downFill = direction === 'descending' ? 'currentColor' : 'var(--sort-icon-inactive)';\n\n return (\n <Icon\n ref={ref}\n asChild\n css={{\n '--sort-icon-inactive': 'colors.icon/disabled',\n color: 'icon/primary',\n display: 'inline-block',\n verticalAlign: 'middle',\n }}\n {...rest}\n >\n <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.617 4.461 7.684 9.18c-.271.326-.04.82.384.82h7.865c.424 0 .655-.494.384-.82l-3.933-4.719a.5.5 0 0 0-.767 0Z\"\n fill={upFill}\n />\n <path\n d=\"M12.384 19.539l3.933-4.719c.27-.326.04-.82-.384-.82H8.068c-.424 0-.655.494-.384.82l3.933 4.719a.5.5 0 0 0 .767 0Z\"\n fill={downFill}\n />\n </svg>\n </Icon>\n );\n});\n\nSortIcon.displayName = 'SortIcon';\n\nconst BitkitSortableColumnHeader = forwardRef<HTMLTableCellElement, BitkitSortableColumnHeaderProps>(\n ({ children, direction, onSort, textAlign, ...rest }, ref) => {\n const styles = useTableStyles();\n const isEndAligned = textAlign === 'end';\n const sortIcon = <SortIcon direction={direction} />;\n\n return (\n <Table.ColumnHeader\n ref={ref}\n aria-sort={direction === 'none' ? undefined : direction}\n css={styles.sortColumnHeader}\n {...rest}\n >\n {/* chakra.button: no named primitive attaches a recipe slot to a bare trigger button */}\n <chakra.button\n css={styles.sortTrigger}\n justifyContent={isEndAligned ? 'flex-end' : undefined}\n onClick={onSort}\n type=\"button\"\n >\n {isEndAligned ? (\n <>\n {sortIcon} {children}\n </>\n ) : (\n <>\n {children} {sortIcon}\n </>\n )}\n </chakra.button>\n </Table.ColumnHeader>\n );\n },\n);\n\nBitkitSortableColumnHeader.displayName = 'BitkitSortableColumnHeader';\n\nexport default BitkitSortableColumnHeader;\n"],"mappings":";;;;;;AAYA,IAAM,WAAW,YAAY,OAAiD,QAA4B;CACxG,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,cAAc,cAAc,iBAAiB;CAC5D,MAAM,WAAW,cAAc,eAAe,iBAAiB;CAE/D,OACE,oBAAC,MAAD;EACO;EACL,SAAA;EACA,KAAK;GACH,wBAAwB;GACxB,OAAO;GACP,SAAS;GACT,eAAe;EACjB;EACA,GAAI;EAEJ,UAAA,qBAAC,OAAD;GAAK,MAAK;GAAO,QAAO;GAAK,SAAQ;GAAY,OAAM;GAAK,OAAM;GAAlE,UAAA,CACE,oBAAC,QAAD;IACE,GAAE;IACF,MAAM;GACP,CAAA,GACD,oBAAC,QAAD;IACE,GAAE;IACF,MAAM;GACP,CAAA,CACE;;CACD,CAAA;AAEV,CAAC;AAED,SAAS,cAAc;AAEvB,IAAM,6BAA6B,YAChC,EAAE,UAAU,WAAW,QAAQ,WAAW,GAAG,QAAQ,QAAQ;CAC5D,MAAM,SAAS,eAAe;CAC9B,MAAM,eAAe,cAAc;CACnC,MAAM,WAAW,oBAAC,UAAD,EAAqB,UAAY,CAAA;CAElD,OACE,oBAAC,MAAM,cAAP;EACO;EACL,aAAW,cAAc,SAAS,KAAA,IAAY;EAC9C,KAAK,OAAO;EACZ,GAAI;EAGJ,UAAA,oBAAC,OAAO,QAAR;GACE,KAAK,OAAO;GACZ,gBAAgB,eAAe,aAAa,KAAA;GAC5C,SAAS;GACT,MAAK;GAEJ,UAAA,eACC,qBAAA,YAAA,EAAA,UAAA;IACG;IAAS;IAAE;GACZ,EAAA,CAAA,IAEF,qBAAA,YAAA,EAAA,UAAA;IACG;IAAS;IAAE;GACZ,EAAA,CAAA;EAES,CAAA;CACG,CAAA;AAExB,CACF;AAEA,2BAA2B,cAAc"}
|
|
@@ -16,7 +16,10 @@ var BitkitToaster = () => {
|
|
|
16
16
|
style: { zIndex },
|
|
17
17
|
children: (toast) => {
|
|
18
18
|
const variant = toast.type;
|
|
19
|
-
const styles = toastRecipe({
|
|
19
|
+
const styles = toastRecipe({
|
|
20
|
+
closable: toast.closable,
|
|
21
|
+
variant
|
|
22
|
+
});
|
|
20
23
|
const IconComponent = ICON_COMPONENTS_MAP[variant];
|
|
21
24
|
return /* @__PURE__ */ jsxs(Toast.Root, {
|
|
22
25
|
variant,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitToaster.js","names":[],"sources":["../../../lib/components/BitkitToast/BitkitToaster.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { useSlotRecipe, useToken } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { Toast, Toaster } from '@chakra-ui/react/toast';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport BitkitColorButton from '../BitkitColorButton/BitkitColorButton';\nimport { BUTTON_COLORS_MAP, ICON_COMPONENTS_MAP } from '../common/notificationMaps';\nimport { type BitkitToastVariant, toaster } from './BitkitToast';\n\nconst BitkitToaster = () => {\n const toastRecipe = useSlotRecipe({ key: 'toast' });\n const [zIndex] = useToken('zIndex', 'toast');\n\n return (\n <Toaster toaster={toaster} style={{ zIndex }}>\n {(toast) => {\n const variant = toast.type as BitkitToastVariant;\n const styles = toastRecipe({ variant });\n const IconComponent = ICON_COMPONENTS_MAP[variant];\n return (\n <Toast.Root variant={variant} {...toast.meta?.dataAttributes}>\n <IconComponent css={styles.icon} />\n <Box css={styles.content}>\n {!!toast.title && <Toast.Title>{toast.title}</Toast.Title>}\n <Toast.Description>{toast.description}</Toast.Description>\n {!!toast.meta?.action &&\n (toast.meta.action.href !== undefined ? (\n <BitkitColorButton\n colorVariant={BUTTON_COLORS_MAP[variant]}\n css={styles.actionTrigger}\n href={toast.meta.action.href}\n isExternal={toast.meta.action.target === '_blank'}\n onClick={toast.meta.action.onClick}\n state={toast.meta.action.state}\n target={toast.meta.action.target}\n >\n {toast.meta.action.label}\n </BitkitColorButton>\n ) : (\n <BitkitColorButton\n colorVariant={BUTTON_COLORS_MAP[variant]}\n css={styles.actionTrigger}\n onClick={toast.meta.action.onClick}\n state={toast.meta.action.state}\n >\n {toast.meta.action.label}\n </BitkitColorButton>\n ))}\n {!!toast.meta?.timestamp && <Text css={styles.timestamp}>{toast.meta.timestamp}</Text>}\n </Box>\n {toast.closable && (\n <Toast.CloseTrigger asChild>\n <BitkitCloseButton\n aria-label=\"Dismiss notification\"\n colorVariant={BUTTON_COLORS_MAP[variant]}\n size=\"sm\"\n tooltipText=\"Dismiss\"\n />\n </Toast.CloseTrigger>\n )}\n </Toast.Root>\n );\n }}\n </Toaster>\n );\n};\n\nexport default BitkitToaster;\n"],"mappings":";;;;;;;;;;AAUA,IAAM,sBAAsB;CAC1B,MAAM,cAAc,cAAc,EAAE,KAAK,QAAQ,CAAC;CAClD,MAAM,CAAC,UAAU,SAAS,UAAU,OAAO;CAE3C,OACE,oBAAC,SAAD;EAAkB;EAAS,OAAO,EAAE,OAAO;EACvC,WAAA,UAAU;GACV,MAAM,UAAU,MAAM;GACtB,MAAM,SAAS,YAAY,
|
|
1
|
+
{"version":3,"file":"BitkitToaster.js","names":[],"sources":["../../../lib/components/BitkitToast/BitkitToaster.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { useSlotRecipe, useToken } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { Toast, Toaster } from '@chakra-ui/react/toast';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport BitkitColorButton from '../BitkitColorButton/BitkitColorButton';\nimport { BUTTON_COLORS_MAP, ICON_COMPONENTS_MAP } from '../common/notificationMaps';\nimport { type BitkitToastVariant, toaster } from './BitkitToast';\n\nconst BitkitToaster = () => {\n const toastRecipe = useSlotRecipe({ key: 'toast' });\n const [zIndex] = useToken('zIndex', 'toast');\n\n return (\n <Toaster toaster={toaster} style={{ zIndex }}>\n {(toast) => {\n const variant = toast.type as BitkitToastVariant;\n const styles = toastRecipe({ closable: toast.closable, variant });\n const IconComponent = ICON_COMPONENTS_MAP[variant];\n return (\n <Toast.Root variant={variant} {...toast.meta?.dataAttributes}>\n <IconComponent css={styles.icon} />\n <Box css={styles.content}>\n {!!toast.title && <Toast.Title>{toast.title}</Toast.Title>}\n <Toast.Description>{toast.description}</Toast.Description>\n {!!toast.meta?.action &&\n (toast.meta.action.href !== undefined ? (\n <BitkitColorButton\n colorVariant={BUTTON_COLORS_MAP[variant]}\n css={styles.actionTrigger}\n href={toast.meta.action.href}\n isExternal={toast.meta.action.target === '_blank'}\n onClick={toast.meta.action.onClick}\n state={toast.meta.action.state}\n target={toast.meta.action.target}\n >\n {toast.meta.action.label}\n </BitkitColorButton>\n ) : (\n <BitkitColorButton\n colorVariant={BUTTON_COLORS_MAP[variant]}\n css={styles.actionTrigger}\n onClick={toast.meta.action.onClick}\n state={toast.meta.action.state}\n >\n {toast.meta.action.label}\n </BitkitColorButton>\n ))}\n {!!toast.meta?.timestamp && <Text css={styles.timestamp}>{toast.meta.timestamp}</Text>}\n </Box>\n {toast.closable && (\n <Toast.CloseTrigger asChild>\n <BitkitCloseButton\n aria-label=\"Dismiss notification\"\n colorVariant={BUTTON_COLORS_MAP[variant]}\n size=\"sm\"\n tooltipText=\"Dismiss\"\n />\n </Toast.CloseTrigger>\n )}\n </Toast.Root>\n );\n }}\n </Toaster>\n );\n};\n\nexport default BitkitToaster;\n"],"mappings":";;;;;;;;;;AAUA,IAAM,sBAAsB;CAC1B,MAAM,cAAc,cAAc,EAAE,KAAK,QAAQ,CAAC;CAClD,MAAM,CAAC,UAAU,SAAS,UAAU,OAAO;CAE3C,OACE,oBAAC,SAAD;EAAkB;EAAS,OAAO,EAAE,OAAO;EACvC,WAAA,UAAU;GACV,MAAM,UAAU,MAAM;GACtB,MAAM,SAAS,YAAY;IAAE,UAAU,MAAM;IAAU;GAAQ,CAAC;GAChE,MAAM,gBAAgB,oBAAoB;GAC1C,OACE,qBAAC,MAAM,MAAP;IAAqB;IAAS,GAAI,MAAM,MAAM;IAA9C,UAAA;KACE,oBAAC,eAAD,EAAe,KAAK,OAAO,KAAO,CAAA;KAClC,qBAAC,KAAD;MAAK,KAAK,OAAO;MAAjB,UAAA;OACG,CAAC,CAAC,MAAM,SAAS,oBAAC,MAAM,OAAP,EAAA,UAAc,MAAM,MAAmB,CAAA;OACzD,oBAAC,MAAM,aAAP,EAAA,UAAoB,MAAM,YAA+B,CAAA;OACxD,CAAC,CAAC,MAAM,MAAM,WACZ,MAAM,KAAK,OAAO,SAAS,KAAA,IAC1B,oBAAC,mBAAD;QACE,cAAc,kBAAkB;QAChC,KAAK,OAAO;QACZ,MAAM,MAAM,KAAK,OAAO;QACxB,YAAY,MAAM,KAAK,OAAO,WAAW;QACzC,SAAS,MAAM,KAAK,OAAO;QAC3B,OAAO,MAAM,KAAK,OAAO;QACzB,QAAQ,MAAM,KAAK,OAAO;QAEzB,UAAA,MAAM,KAAK,OAAO;OACF,CAAA,IAEnB,oBAAC,mBAAD;QACE,cAAc,kBAAkB;QAChC,KAAK,OAAO;QACZ,SAAS,MAAM,KAAK,OAAO;QAC3B,OAAO,MAAM,KAAK,OAAO;QAExB,UAAA,MAAM,KAAK,OAAO;OACF,CAAA;OAEtB,CAAC,CAAC,MAAM,MAAM,aAAa,oBAAC,MAAD;QAAM,KAAK,OAAO;QAAY,UAAA,MAAM,KAAK;OAAgB,CAAA;MAClF;;KACJ,MAAM,YACL,oBAAC,MAAM,cAAP;MAAoB,SAAA;MAClB,UAAA,oBAAC,mBAAD;OACE,cAAW;OACX,cAAc,kBAAkB;OAChC,MAAK;OACL,aAAY;MACb,CAAA;KACiB,CAAA;IAEZ;;EAEhB;CACO,CAAA;AAEb"}
|
|
@@ -73,14 +73,13 @@ export { default as BitkitStat, type BitkitStatProps, type TrendColor, type Tren
|
|
|
73
73
|
export { default as BitkitSteps, type BitkitStepsItemProps, type BitkitStepsItemState, type BitkitStepsProps, } from './BitkitSteps/BitkitSteps';
|
|
74
74
|
export { default as BitkitStepsCard, type BitkitStepsCardBodyProps, type BitkitStepsCardFooterProps, type BitkitStepsCardHeaderProps, type BitkitStepsCardProps, type BitkitStepsCardStepProps, } from './BitkitStepsCard/BitkitStepsCard';
|
|
75
75
|
export { default as BitkitSwitch, type BitkitSwitchProps } from './BitkitSwitch';
|
|
76
|
-
export { type BitkitBulkActionsItems, type BitkitBulkActionsLabels, type BitkitBulkActionsRowProps, } from './BitkitTable/BitkitBulkActionsRow';
|
|
77
|
-
export { type BitkitDefinitionColumnHeaderProps } from './BitkitTable/BitkitDefinitionColumnHeader';
|
|
78
|
-
export { type BitkitExpandableRowProps } from './BitkitTable/BitkitExpandableRow';
|
|
79
|
-
export { type BitkitFilterRowProps } from './BitkitTable/BitkitFilterRow';
|
|
80
|
-
export { type BitkitLinkedRowLinkCellProps, type BitkitLinkedRowProps } from './BitkitTable/BitkitLinkedRow';
|
|
81
|
-
export { type BitkitRowAction, type BitkitRowActionsCellProps } from './BitkitTable/BitkitRowActionsCell';
|
|
82
|
-
export { type BitkitSortableColumnHeaderProps } from './BitkitTable/BitkitSortableColumnHeader';
|
|
83
|
-
export { default as BitkitTable } from './BitkitTable/BitkitTable';
|
|
76
|
+
export { type BitkitBulkActionsItems, type BitkitBulkActionsLabels, default as BitkitBulkActionsRow, type BitkitBulkActionsRowProps, } from './BitkitTable/BitkitBulkActionsRow';
|
|
77
|
+
export { default as BitkitDefinitionColumnHeader, type BitkitDefinitionColumnHeaderProps, } from './BitkitTable/BitkitDefinitionColumnHeader';
|
|
78
|
+
export { default as BitkitExpandableRow, type BitkitExpandableRowProps } from './BitkitTable/BitkitExpandableRow';
|
|
79
|
+
export { default as BitkitFilterRow, type BitkitFilterRowProps } from './BitkitTable/BitkitFilterRow';
|
|
80
|
+
export { default as BitkitLinkedRow, type BitkitLinkedRowLinkCellProps, type BitkitLinkedRowProps, } from './BitkitTable/BitkitLinkedRow';
|
|
81
|
+
export { type BitkitRowAction, default as BitkitRowActionsCell, type BitkitRowActionsCellProps, } from './BitkitTable/BitkitRowActionsCell';
|
|
82
|
+
export { default as BitkitSortableColumnHeader, type BitkitSortableColumnHeaderProps, } from './BitkitTable/BitkitSortableColumnHeader';
|
|
84
83
|
export { default as BitkitTableCard, type BitkitTableCardProps } from './BitkitTableCard/BitkitTableCard';
|
|
85
84
|
export { default as BitkitTabs } from './BitkitTabs/BitkitTabs';
|
|
86
85
|
export { default as BitkitTag, type BitkitTagProps } from './BitkitTag/BitkitTag';
|
package/dist/main.js
CHANGED
|
@@ -369,7 +369,13 @@ import BitkitSplitButton_default from "./components/BitkitSplitButton/BitkitSpli
|
|
|
369
369
|
import BitkitStat from "./components/BitkitStat/BitkitStat.js";
|
|
370
370
|
import BitkitStepsCard_default from "./components/BitkitStepsCard/BitkitStepsCard.js";
|
|
371
371
|
import BitkitSwitch from "./components/BitkitSwitch/BitkitSwitch.js";
|
|
372
|
-
import
|
|
372
|
+
import BitkitBulkActionsRow from "./components/BitkitTable/BitkitBulkActionsRow.js";
|
|
373
|
+
import BitkitDefinitionColumnHeader from "./components/BitkitTable/BitkitDefinitionColumnHeader.js";
|
|
374
|
+
import BitkitExpandableRow from "./components/BitkitTable/BitkitExpandableRow.js";
|
|
375
|
+
import BitkitFilterRow from "./components/BitkitTable/BitkitFilterRow.js";
|
|
376
|
+
import BitkitLinkedRow_default from "./components/BitkitTable/BitkitLinkedRow.js";
|
|
377
|
+
import BitkitRowActionsCell from "./components/BitkitTable/BitkitRowActionsCell.js";
|
|
378
|
+
import BitkitSortableColumnHeader from "./components/BitkitTable/BitkitSortableColumnHeader.js";
|
|
373
379
|
import BitkitTableCard from "./components/BitkitTableCard/BitkitTableCard.js";
|
|
374
380
|
import BitkitTabs from "./components/BitkitTabs/BitkitTabs.js";
|
|
375
381
|
import BitkitTagsInput from "./components/BitkitTagsInput/BitkitTagsInput.js";
|
|
@@ -381,4 +387,4 @@ import BitkitTreeView, { createTreeCollection } from "./components/BitkitTreeVie
|
|
|
381
387
|
import useResponsive, { ResponsiveProvider } from "./hooks/useResponsive.js";
|
|
382
388
|
import bitkitTheme from "./theme/index.js";
|
|
383
389
|
import Provider from "./providers/BitkitProvider.js";
|
|
384
|
-
export { BitkitAccordion_default as BitkitAccordion, BitkitActionBar, BitkitActionMenu_default as BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDatePicker, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitField, BitkitFileInput, BitkitFormDialog_default as BitkitFormDialog, BitkitGroupHeading, BitkitHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLightbox, BitkitLink, BitkitLinkButton, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, BitkitPopover, BitkitProgressBar, BitkitPromoBanner, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect_default as BitkitSelect, BitkitSelectMenu, BitkitSelectMenuAction, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSkeletonGroup, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitStepsDialog_default as BitkitStepsDialog, BitkitSwitch,
|
|
390
|
+
export { BitkitAccordion_default as BitkitAccordion, BitkitActionBar, BitkitActionMenu_default as BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitBulkActionsRow, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDatePicker, BitkitDefinitionColumnHeader, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitExpandableRow, BitkitField, BitkitFileInput, BitkitFilterRow, BitkitFormDialog_default as BitkitFormDialog, BitkitGroupHeading, BitkitHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLightbox, BitkitLink, BitkitLinkButton, BitkitLinkedRow_default as BitkitLinkedRow, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, BitkitPopover, BitkitProgressBar, BitkitPromoBanner, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitRowActionsCell, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect_default as BitkitSelect, BitkitSelectMenu, BitkitSelectMenuAction, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSkeletonGroup, BitkitSortableColumnHeader, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitStepsDialog_default as BitkitStepsDialog, BitkitSwitch, BitkitTableCard, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitTooltip, BitkitTour, BitkitTreeView, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconBuildHub, IconBuildHubFilled, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopilot, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCursor, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileYml, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKiroColor, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMcp, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkip, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTabPlus, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTerminalFilled, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconVsCode, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWindsurf, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, dismissBitkitToast, rem, useBitkitTour, useResponsive, useStepsDialog };
|
|
@@ -1,4 +1,12 @@
|
|
|
1
1
|
declare const toastSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "icon" | "root" | "closeTrigger" | "indicator" | "description" | "timestamp" | "actionTrigger", {
|
|
2
|
+
closable: {
|
|
3
|
+
true: {
|
|
4
|
+
content: {
|
|
5
|
+
paddingInlineEnd: "48";
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
false: {};
|
|
9
|
+
};
|
|
2
10
|
variant: {
|
|
3
11
|
[k: string]: {
|
|
4
12
|
icon: {
|
|
@@ -15,7 +15,8 @@ var toastSlotRecipe = defineSlotRecipe({
|
|
|
15
15
|
actionTrigger: { marginBlockStart: "16" },
|
|
16
16
|
content: {
|
|
17
17
|
flex: 1,
|
|
18
|
-
minWidth: 0
|
|
18
|
+
minWidth: 0,
|
|
19
|
+
paddingInlineEnd: "16"
|
|
19
20
|
},
|
|
20
21
|
description: {
|
|
21
22
|
paddingBlockStart: "2",
|
|
@@ -25,6 +26,7 @@ var toastSlotRecipe = defineSlotRecipe({
|
|
|
25
26
|
alignSelf: "flex-start",
|
|
26
27
|
flexShrink: 0,
|
|
27
28
|
height: "24",
|
|
29
|
+
marginInlineEnd: "8",
|
|
28
30
|
width: "24"
|
|
29
31
|
},
|
|
30
32
|
root: {
|
|
@@ -33,9 +35,8 @@ var toastSlotRecipe = defineSlotRecipe({
|
|
|
33
35
|
borderRadius: "8",
|
|
34
36
|
boxShadow: "elevation/lg",
|
|
35
37
|
display: "flex",
|
|
36
|
-
gap: "8",
|
|
37
38
|
paddingBlock: rem(15),
|
|
38
|
-
paddingInline:
|
|
39
|
+
paddingInline: rem(11),
|
|
39
40
|
position: "relative",
|
|
40
41
|
translate: "var(--x) var(--y)",
|
|
41
42
|
width: rem(480),
|
|
@@ -56,18 +57,24 @@ var toastSlotRecipe = defineSlotRecipe({
|
|
|
56
57
|
textStyle: "comp/notification/title"
|
|
57
58
|
},
|
|
58
59
|
closeTrigger: {
|
|
59
|
-
insetBlockStart:
|
|
60
|
-
insetInlineEnd:
|
|
60
|
+
insetBlockStart: rem(11),
|
|
61
|
+
insetInlineEnd: rem(11),
|
|
61
62
|
position: "absolute"
|
|
62
63
|
}
|
|
63
64
|
},
|
|
64
|
-
variants: {
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
65
|
+
variants: {
|
|
66
|
+
closable: {
|
|
67
|
+
true: { content: { paddingInlineEnd: "48" } },
|
|
68
|
+
false: {}
|
|
69
|
+
},
|
|
70
|
+
variant: Object.fromEntries(NOTIFICATION_VARIANTS.map((v) => [v, {
|
|
71
|
+
icon: { color: ICONS_MAP[v] },
|
|
72
|
+
root: {
|
|
73
|
+
...ROOT_MAP[v],
|
|
74
|
+
color: TEXT_MAP[v]
|
|
75
|
+
}
|
|
76
|
+
}]))
|
|
77
|
+
},
|
|
71
78
|
defaultVariants: { variant: "info" }
|
|
72
79
|
});
|
|
73
80
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Toast.recipe.ts"],"sourcesContent":["import { toastAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { ICONS_MAP, NOTIFICATION_VARIANTS, ROOT_MAP, TEXT_MAP } from '../common/AlertAndToast.common';\nimport { rem } from '../themeUtils';\n\nconst toastSlotRecipe = defineSlotRecipe({\n className: 'toast',\n slots: [...toastAnatomy.keys(), 'content', 'icon', 'timestamp'],\n base: {\n actionTrigger: {\n marginBlockStart: '16',\n },\n content: {\n flex: 1,\n minWidth: 0,\n },\n description: {\n paddingBlockStart: '2',\n textStyle: 'comp/notification/message',\n },\n icon: {\n alignSelf: 'flex-start',\n flexShrink: 0,\n height: '24',\n width: '24',\n },\n root: {\n alignItems: 'flex-start',\n border: '1px solid',\n borderRadius: '8',\n boxShadow: 'elevation/lg',\n display: 'flex',\n
|
|
1
|
+
{"version":3,"file":"Toast.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Toast.recipe.ts"],"sourcesContent":["import { toastAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { ICONS_MAP, NOTIFICATION_VARIANTS, ROOT_MAP, TEXT_MAP } from '../common/AlertAndToast.common';\nimport { rem } from '../themeUtils';\n\nconst toastSlotRecipe = defineSlotRecipe({\n className: 'toast',\n slots: [...toastAnatomy.keys(), 'content', 'icon', 'timestamp'],\n base: {\n actionTrigger: {\n marginBlockStart: '16',\n },\n content: {\n flex: 1,\n minWidth: 0,\n paddingInlineEnd: '16',\n },\n description: {\n paddingBlockStart: '2',\n textStyle: 'comp/notification/message',\n },\n icon: {\n alignSelf: 'flex-start',\n flexShrink: 0,\n height: '24',\n marginInlineEnd: '8',\n width: '24',\n },\n root: {\n alignItems: 'flex-start',\n border: '1px solid',\n borderRadius: '8',\n boxShadow: 'elevation/lg',\n display: 'flex',\n // `rem(15)`/`rem(11)` padding (not 16/12) lands the toast on the designed geometry once the\n // 1px border is added — Figma measures its padding from the frame edge, stroke included:\n // heights 56px message-only, 102px message + action, 116px title + message + timestamp,\n // 128px title + message + action, and 12px from the inline edges on both sides. Same\n // compensation as BitkitAlert's `rem(11)`.\n paddingBlock: rem(15),\n paddingInline: rem(11),\n position: 'relative',\n translate: 'var(--x) var(--y)',\n width: rem(480),\n willChange: 'translate, opacity, scale',\n transition: 'translate 400ms, scale 400ms, opacity 400ms, height 400ms, box-shadow 200ms',\n transitionTimingFunction: 'cubic-bezier(0.21, 1.02, 0.73, 1)',\n _closed: {\n transition: 'translate 400ms, scale 400ms, opacity 200ms',\n transitionTimingFunction: 'cubic-bezier(0.06, 0.71, 0.55, 1)',\n },\n },\n timestamp: {\n marginBlockStart: '16',\n textStyle: 'comp/notification/message',\n },\n title: {\n marginBlockEnd: '2',\n textStyle: 'comp/notification/title',\n },\n closeTrigger: {\n // Out of flow, as Figma models it: `closeButton-margin` spans the full toast height in\n // every variant with the button pinned at its top, so the toast's height comes from the\n // content alone. `rem(11)` for the same border compensation as the root padding — 12px\n // from the frame edge, which puts the 32px button at x436 y12 of the 480px frame.\n insetBlockStart: rem(11),\n insetInlineEnd: rem(11),\n position: 'absolute',\n },\n },\n variants: {\n // The out-of-flow close button reserves its own space: 48px = its 32px box plus the 16px\n // gutter Figma's `content-block` keeps after the text column. Without one the gutter is\n // the base 16px, which is what widens the text column from 376px to 408px.\n closable: {\n true: {\n content: {\n paddingInlineEnd: '48',\n },\n },\n false: {},\n },\n variant: Object.fromEntries(\n NOTIFICATION_VARIANTS.map((v) => [\n v,\n {\n icon: { color: ICONS_MAP[v] },\n root: { ...ROOT_MAP[v], color: TEXT_MAP[v] },\n },\n ]),\n ),\n },\n defaultVariants: {\n variant: 'info',\n },\n});\n\nexport default toastSlotRecipe;\n"],"mappings":";;;;;AAMA,IAAM,kBAAkB,iBAAiB;CACvC,WAAW;CACX,OAAO;EAAC,GAAG,aAAa,KAAK;EAAG;EAAW;EAAQ;CAAW;CAC9D,MAAM;EACJ,eAAe,EACb,kBAAkB,KACpB;EACA,SAAS;GACP,MAAM;GACN,UAAU;GACV,kBAAkB;EACpB;EACA,aAAa;GACX,mBAAmB;GACnB,WAAW;EACb;EACA,MAAM;GACJ,WAAW;GACX,YAAY;GACZ,QAAQ;GACR,iBAAiB;GACjB,OAAO;EACT;EACA,MAAM;GACJ,YAAY;GACZ,QAAQ;GACR,cAAc;GACd,WAAW;GACX,SAAS;GAMT,cAAc,IAAI,EAAE;GACpB,eAAe,IAAI,EAAE;GACrB,UAAU;GACV,WAAW;GACX,OAAO,IAAI,GAAG;GACd,YAAY;GACZ,YAAY;GACZ,0BAA0B;GAC1B,SAAS;IACP,YAAY;IACZ,0BAA0B;GAC5B;EACF;EACA,WAAW;GACT,kBAAkB;GAClB,WAAW;EACb;EACA,OAAO;GACL,gBAAgB;GAChB,WAAW;EACb;EACA,cAAc;GAKZ,iBAAiB,IAAI,EAAE;GACvB,gBAAgB,IAAI,EAAE;GACtB,UAAU;EACZ;CACF;CACA,UAAU;EAIR,UAAU;GACR,MAAM,EACJ,SAAS,EACP,kBAAkB,KACpB,EACF;GACA,OAAO,CAAC;EACV;EACA,SAAS,OAAO,YACd,sBAAsB,KAAK,MAAM,CAC/B,GACA;GACE,MAAM,EAAE,OAAO,UAAU,GAAG;GAC5B,MAAM;IAAE,GAAG,SAAS;IAAI,OAAO,SAAS;GAAG;EAC7C,CACF,CAAC,CACH;CACF;CACA,iBAAiB,EACf,SAAS,OACX;AACF,CAAC"}
|
|
@@ -2637,6 +2637,14 @@ declare const slotRecipes: {
|
|
|
2637
2637
|
};
|
|
2638
2638
|
}>;
|
|
2639
2639
|
toast: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "icon" | "root" | "closeTrigger" | "indicator" | "description" | "timestamp" | "actionTrigger", {
|
|
2640
|
+
closable: {
|
|
2641
|
+
true: {
|
|
2642
|
+
content: {
|
|
2643
|
+
paddingInlineEnd: "48";
|
|
2644
|
+
};
|
|
2645
|
+
};
|
|
2646
|
+
false: {};
|
|
2647
|
+
};
|
|
2640
2648
|
variant: {
|
|
2641
2649
|
[k: string]: {
|
|
2642
2650
|
icon: {
|
package/package.json
CHANGED
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
import { Table } from '@chakra-ui/react/table';
|
|
2
|
-
import { default as BulkActionsRow } from './BitkitBulkActionsRow';
|
|
3
|
-
import { default as DefinitionColumnHeader } from './BitkitDefinitionColumnHeader';
|
|
4
|
-
import { default as ExpandableRow } from './BitkitExpandableRow';
|
|
5
|
-
import { default as FilterRow } from './BitkitFilterRow';
|
|
6
|
-
import { default as LinkedRow } from './BitkitLinkedRow';
|
|
7
|
-
import { default as RowActionsCell } from './BitkitRowActionsCell';
|
|
8
|
-
import { default as SortableColumnHeader } from './BitkitSortableColumnHeader';
|
|
9
|
-
/**
|
|
10
|
-
* Chakra's `Table` namespace with the Bitkit table parts attached, so a table needs a single
|
|
11
|
-
* import: `BitkitTable.Root`, `BitkitTable.Row`, `BitkitTable.Cell`, … alongside
|
|
12
|
-
* `BitkitTable.RowActionsCell`, `BitkitTable.SortableColumnHeader`, and the rest.
|
|
13
|
-
*
|
|
14
|
-
* @example
|
|
15
|
-
* ```tsx
|
|
16
|
-
* <BitkitTable.Root size="lg">
|
|
17
|
-
* <BitkitTable.Header>
|
|
18
|
-
* <BitkitTable.Row>
|
|
19
|
-
* <BitkitTable.SortableColumnHeader direction={direction} onSort={onSort}>Name</BitkitTable.SortableColumnHeader>
|
|
20
|
-
* </BitkitTable.Row>
|
|
21
|
-
* </BitkitTable.Header>
|
|
22
|
-
* <BitkitTable.Body>
|
|
23
|
-
* <BitkitTable.LinkedRow>
|
|
24
|
-
* <BitkitTable.LinkedRow.LinkCell>
|
|
25
|
-
* <BitkitLink colorVariant="purple" href={`/projects/${row.id}`}>{row.name}</BitkitLink>
|
|
26
|
-
* </BitkitTable.LinkedRow.LinkCell>
|
|
27
|
-
* <BitkitTable.RowActionsCell actions={actions} />
|
|
28
|
-
* </BitkitTable.LinkedRow>
|
|
29
|
-
* </BitkitTable.Body>
|
|
30
|
-
* </BitkitTable.Root>
|
|
31
|
-
* ```
|
|
32
|
-
*/
|
|
33
|
-
declare const BitkitTable: typeof Table & {
|
|
34
|
-
BulkActionsRow: typeof BulkActionsRow;
|
|
35
|
-
DefinitionColumnHeader: typeof DefinitionColumnHeader;
|
|
36
|
-
ExpandableRow: typeof ExpandableRow;
|
|
37
|
-
FilterRow: typeof FilterRow;
|
|
38
|
-
LinkedRow: typeof LinkedRow;
|
|
39
|
-
RowActionsCell: typeof RowActionsCell;
|
|
40
|
-
SortableColumnHeader: typeof SortableColumnHeader;
|
|
41
|
-
};
|
|
42
|
-
export default BitkitTable;
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import BitkitBulkActionsRow from "./BitkitBulkActionsRow.js";
|
|
2
|
-
import BitkitDefinitionColumnHeader from "./BitkitDefinitionColumnHeader.js";
|
|
3
|
-
import BitkitExpandableRow from "./BitkitExpandableRow.js";
|
|
4
|
-
import BitkitFilterRow from "./BitkitFilterRow.js";
|
|
5
|
-
import BitkitLinkedRow_default from "./BitkitLinkedRow.js";
|
|
6
|
-
import BitkitRowActionsCell from "./BitkitRowActionsCell.js";
|
|
7
|
-
import BitkitSortableColumnHeader from "./BitkitSortableColumnHeader.js";
|
|
8
|
-
import { Table } from "@chakra-ui/react/table";
|
|
9
|
-
//#region lib/components/BitkitTable/BitkitTable.tsx
|
|
10
|
-
/**
|
|
11
|
-
* Chakra's `Table` namespace with the Bitkit table parts attached, so a table needs a single
|
|
12
|
-
* import: `BitkitTable.Root`, `BitkitTable.Row`, `BitkitTable.Cell`, … alongside
|
|
13
|
-
* `BitkitTable.RowActionsCell`, `BitkitTable.SortableColumnHeader`, and the rest.
|
|
14
|
-
*
|
|
15
|
-
* @example
|
|
16
|
-
* ```tsx
|
|
17
|
-
* <BitkitTable.Root size="lg">
|
|
18
|
-
* <BitkitTable.Header>
|
|
19
|
-
* <BitkitTable.Row>
|
|
20
|
-
* <BitkitTable.SortableColumnHeader direction={direction} onSort={onSort}>Name</BitkitTable.SortableColumnHeader>
|
|
21
|
-
* </BitkitTable.Row>
|
|
22
|
-
* </BitkitTable.Header>
|
|
23
|
-
* <BitkitTable.Body>
|
|
24
|
-
* <BitkitTable.LinkedRow>
|
|
25
|
-
* <BitkitTable.LinkedRow.LinkCell>
|
|
26
|
-
* <BitkitLink colorVariant="purple" href={`/projects/${row.id}`}>{row.name}</BitkitLink>
|
|
27
|
-
* </BitkitTable.LinkedRow.LinkCell>
|
|
28
|
-
* <BitkitTable.RowActionsCell actions={actions} />
|
|
29
|
-
* </BitkitTable.LinkedRow>
|
|
30
|
-
* </BitkitTable.Body>
|
|
31
|
-
* </BitkitTable.Root>
|
|
32
|
-
* ```
|
|
33
|
-
*/
|
|
34
|
-
var BitkitTable = {
|
|
35
|
-
...Table,
|
|
36
|
-
BulkActionsRow: BitkitBulkActionsRow,
|
|
37
|
-
DefinitionColumnHeader: BitkitDefinitionColumnHeader,
|
|
38
|
-
ExpandableRow: BitkitExpandableRow,
|
|
39
|
-
FilterRow: BitkitFilterRow,
|
|
40
|
-
LinkedRow: BitkitLinkedRow_default,
|
|
41
|
-
RowActionsCell: BitkitRowActionsCell,
|
|
42
|
-
SortableColumnHeader: BitkitSortableColumnHeader
|
|
43
|
-
};
|
|
44
|
-
//#endregion
|
|
45
|
-
export { BitkitTable as default };
|
|
46
|
-
|
|
47
|
-
//# sourceMappingURL=BitkitTable.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitTable.js","names":[],"sources":["../../../lib/components/BitkitTable/BitkitTable.tsx"],"sourcesContent":["import { Table } from '@chakra-ui/react/table';\n\nimport BulkActionsRow from './BitkitBulkActionsRow';\nimport DefinitionColumnHeader from './BitkitDefinitionColumnHeader';\nimport ExpandableRow from './BitkitExpandableRow';\nimport FilterRow from './BitkitFilterRow';\nimport LinkedRow from './BitkitLinkedRow';\nimport RowActionsCell from './BitkitRowActionsCell';\nimport SortableColumnHeader from './BitkitSortableColumnHeader';\n\n/**\n * Chakra's `Table` namespace with the Bitkit table parts attached, so a table needs a single\n * import: `BitkitTable.Root`, `BitkitTable.Row`, `BitkitTable.Cell`, … alongside\n * `BitkitTable.RowActionsCell`, `BitkitTable.SortableColumnHeader`, and the rest.\n *\n * @example\n * ```tsx\n * <BitkitTable.Root size=\"lg\">\n * <BitkitTable.Header>\n * <BitkitTable.Row>\n * <BitkitTable.SortableColumnHeader direction={direction} onSort={onSort}>Name</BitkitTable.SortableColumnHeader>\n * </BitkitTable.Row>\n * </BitkitTable.Header>\n * <BitkitTable.Body>\n * <BitkitTable.LinkedRow>\n * <BitkitTable.LinkedRow.LinkCell>\n * <BitkitLink colorVariant=\"purple\" href={`/projects/${row.id}`}>{row.name}</BitkitLink>\n * </BitkitTable.LinkedRow.LinkCell>\n * <BitkitTable.RowActionsCell actions={actions} />\n * </BitkitTable.LinkedRow>\n * </BitkitTable.Body>\n * </BitkitTable.Root>\n * ```\n */\nconst BitkitTable: typeof Table & {\n BulkActionsRow: typeof BulkActionsRow;\n DefinitionColumnHeader: typeof DefinitionColumnHeader;\n ExpandableRow: typeof ExpandableRow;\n FilterRow: typeof FilterRow;\n LinkedRow: typeof LinkedRow;\n RowActionsCell: typeof RowActionsCell;\n SortableColumnHeader: typeof SortableColumnHeader;\n} = {\n ...Table,\n BulkActionsRow,\n DefinitionColumnHeader,\n ExpandableRow,\n FilterRow,\n LinkedRow,\n RowActionsCell,\n SortableColumnHeader,\n};\n\nexport default BitkitTable;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,IAAM,cAQF;CACF,GAAG;CACH,gBAAA;CACA,wBAAA;CACA,eAAA;CACA,WAAA;CACA,WAAA;CACA,gBAAA;CACA,sBAAA;AACF"}
|