@popsure/dirty-swan 0.61.2 → 0.61.3
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/dist/cjs/index.js +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/{TableSection-89d3ff2a.js → TableSection-cf3bbf3d.js} +1 -1
- package/dist/esm/{TableSection-89d3ff2a.js.map → TableSection-cf3bbf3d.js.map} +1 -1
- package/dist/esm/components/cards/card/index.js +1 -1
- package/dist/esm/components/cards/card/index.js.map +1 -1
- package/dist/esm/components/table/Table.js +1 -1
- package/dist/esm/components/table/Table.stories.js +1 -1
- package/dist/esm/components/table/Table.test.js +1 -1
- package/dist/esm/components/table/components/TableContents/TableContents.js +1 -1
- package/dist/esm/components/table/components/TableContents/TableContents.test.js +1 -1
- package/dist/esm/components/table/components/TableSection/TableSection.js +1 -1
- package/dist/esm/components/table/components/TableSection/TableSection.test.js +1 -1
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
- package/src/lib/components/cards/card/index.tsx +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableSection-
|
|
1
|
+
{"version":3,"file":"TableSection-cf3bbf3d.js","sources":["../../../src/lib/components/table/types.ts","../../../src/lib/components/table/components/TableSection/TableSection.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { BaseCellProps } from './components/TableCell/BaseCell/BaseCell';\nimport { CTACellProps } from './components/TableCell/CTACell/CTACell';\nimport { ButtonCellProps } from './components/TableCell/ButtonCell/ButtonCell';\nimport { CardCellProps } from './components/TableCell/CardCell/CardCell';\n\ntype DefaultCellProps = {\n cellId?: string;\n colSpan?: number;\n modalTitle?: ReactNode;\n};\n\ntype BaseCellData = BaseCellProps & { type?: undefined } & DefaultCellProps;\ntype CTACellData = CTACellProps & { type: 'CTA' } & DefaultCellProps;\ntype ButtonCellData = ButtonCellProps & { type: 'BUTTON' } & DefaultCellProps;\ntype CardCellData = CardCellProps & { type: 'CARD' } & DefaultCellProps;\n\nexport type TableCellData =\n | BaseCellData\n | CTACellData\n | ButtonCellData\n | CardCellData;\n\nexport const isBaseCell = (\n tableCellData: TableCellData\n): tableCellData is BaseCellData => {\n return !tableCellData.type;\n};\n\nexport type TableSectionType = {\n title?: string;\n icon?: ReactNode;\n};\n\nexport type ModalData = {\n title?: ReactNode;\n body?: ReactNode;\n};\n\nexport type TableCellRowData = TableCellData[];\n\nexport type TableSectionData = {\n section?: TableSectionType;\n rows: TableCellRowData[];\n};\n\nexport type TableData = TableSectionData[];\n\nexport type ModalFunction = (modalData: ModalData) => void;\n\nexport type CellReplacements = Record<string, Partial<TableCellData>>;\n","import classNames from 'classnames';\n\nimport styles from './TableSection.module.scss';\nimport { TableCell } from '../TableCell/TableCell';\nimport {\n CellReplacements,\n isBaseCell,\n ModalFunction,\n TableCellData,\n TableCellRowData,\n} from '../../types';\nimport { useCallback } from 'react';\nimport { useMediaQuery } from '../../../../hooks/useMediaQuery';\n\nexport interface TableSectionProps {\n className?: string;\n tableCellRows: TableCellRowData[];\n hideColumns?: number[];\n hideRows?: number[];\n hideHeader?: boolean;\n openModal?: ModalFunction;\n title: string;\n width?: number | string;\n cellReplacements?: CellReplacements;\n imageComponent?: (args: any) => JSX.Element;\n}\n\nconst TableSection = ({\n className,\n tableCellRows,\n hideColumns = [],\n hideRows = [],\n hideHeader,\n openModal,\n title,\n width,\n cellReplacements,\n imageComponent,\n}: TableSectionProps) => {\n const headerRow = tableCellRows?.[0];\n const isBelowDesktop = useMediaQuery('BELOW_DESKTOP');\n\n const getModalTitleFromColumnHeader = (cellIndex: number) => {\n const firstCellInColumn = tableCellRows?.[0]?.[cellIndex];\n let titleFromColumn;\n\n switch (firstCellInColumn.type) {\n case 'BUTTON':\n titleFromColumn = firstCellInColumn.buttonCaption;\n break;\n case 'CTA':\n titleFromColumn = firstCellInColumn.title;\n break;\n case undefined:\n titleFromColumn = firstCellInColumn.text || '';\n break;\n }\n\n return titleFromColumn;\n };\n\n const getModalTitleFromRowHeader = (currentRow: TableCellRowData) => {\n const firstCellInRow = currentRow?.[0];\n const titleFromRow =\n (isBaseCell(firstCellInRow) && firstCellInRow.text) || '';\n\n return titleFromRow;\n };\n\n const isVisibleColumn = useCallback(\n (cellIndex: number) => !hideColumns.includes(cellIndex),\n [hideColumns]\n );\n\n const isVisibleRow = useCallback(\n (rowIndex: number) => !hideRows.includes(rowIndex),\n [hideRows]\n );\n\n return (\n <table\n className={classNames(className, 'w100', styles.table)}\n width={width}\n >\n <caption className=\"sr-only\">{title}</caption>\n\n {headerRow && (\n <thead className={hideHeader ? 'sr-only' : ''}>\n <tr>\n {headerRow.map((tableCellData, cellIndex) => {\n const isFirstCellInRow = cellIndex === 0;\n const cellReplacementData =\n (tableCellData.cellId &&\n cellReplacements?.[tableCellData.cellId]) ||\n {};\n\n const cellProps = {\n ...tableCellData,\n ...cellReplacementData,\n ...{\n openModal,\n modalTitle:\n (isBaseCell(tableCellData) && tableCellData.text) ||\n getModalTitleFromColumnHeader(cellIndex),\n align: isFirstCellInRow ? 'left' : 'center',\n },\n } as TableCellData;\n\n return (\n isVisibleColumn(cellIndex) && (\n <TableCell\n key={cellIndex}\n isBelowDesktop={isBelowDesktop}\n isHeader\n isFirstCellInRow={isFirstCellInRow}\n isTopLeftCell={isFirstCellInRow}\n {...cellProps}\n imageComponent={imageComponent}\n />\n )\n );\n })}\n </tr>\n </thead>\n )}\n\n <tbody>\n {tableCellRows.map(\n (row, rowIndex) =>\n rowIndex > 0 && isVisibleRow(rowIndex) && (\n <tr key={rowIndex} className={styles.tr}>\n {row.map((tableCellData, cellIndex) => {\n const key = `${rowIndex}-${cellIndex}`;\n const isFirstCellInRow = cellIndex === 0;\n const titleFromRow = getModalTitleFromRowHeader(row);\n\n const cellReplacementData =\n (tableCellData.cellId &&\n cellReplacements?.[tableCellData.cellId]) ||\n {};\n\n const cellProps = {\n ...tableCellData,\n ...cellReplacementData,\n ...{\n openModal,\n modalTitle: tableCellData?.modalTitle || titleFromRow,\n align: isFirstCellInRow ? 'left' : 'center',\n },\n } as TableCellData;\n\n return (\n !hideColumns.includes(cellIndex) && (\n <TableCell\n isBelowDesktop={isBelowDesktop}\n isFirstCellInRow={isFirstCellInRow}\n key={key}\n {...cellProps}\n imageComponent={imageComponent}\n />\n )\n );\n })}\n </tr>\n )\n )}\n </tbody>\n </table>\n );\n};\n\nexport { TableSection };\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
|
|
@@ -26,7 +26,7 @@ var Card = function (_a) {
|
|
|
26
26
|
_b)) }, onClick && {
|
|
27
27
|
onClick: onClick,
|
|
28
28
|
type: "button"
|
|
29
|
-
}, rest, { children: jsxs("div", { className: classNames('d-flex fd-column jc-center w100 ta-left br8', { 'bs-sm': dropShadow && variant === 'default' }, {
|
|
29
|
+
}, { disabled: disabled }, rest, { children: jsxs("div", { className: classNames('d-flex fd-column jc-center w100 ta-left br8', { 'bs-sm': dropShadow && variant === 'default' }, {
|
|
30
30
|
xsmall: 'p16',
|
|
31
31
|
small: styles.smallPadding,
|
|
32
32
|
medium: 'p24',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../../src/lib/components/cards/card/index.tsx"],"sourcesContent":["import { ComponentProps, ElementType, ReactNode } from 'react';\nimport classNamesUtil from 'classnames';\nimport { ChevronRightIcon } from '../../icon';\n\nimport styles from './style.module.scss';\n\nconst cardDefaultAs = 'section' as const\ntype CardDefaultAsType = typeof cardDefaultAs;\ntype DensityType = 'xsmall' | 'small' | 'medium' | 'large';\ntype TitleVariantType = 'small' | 'medium' | 'large';\ntype VerticalAlignmentType = 'top' | 'center' | 'bottom';\ntype CardVariant = 'default' | 'transparent' | 'outline' | 'secondary' | 'primary';\n\ntype CardOwnProps<E extends ElementType = CardDefaultAsType> = {\n as?: E;\n children?: ReactNode;\n classNames?: {\n buttonWrapper?: string;\n wrapper?: string\n contentWrapper?: string;\n label?: string;\n title?: string;\n description?: string;\n children?: string;\n icon?: string;\n actionIcon?: string;\n };\n density?: DensityType;\n dropShadow?: boolean;\n icon?: ReactNode;\n title?: ReactNode;\n titleVariant?: TitleVariantType;\n description?: ReactNode;\n descriptionVariant?: 'small' | 'large';\n label?: ReactNode;\n onClick?: () => void;\n actionIcon?: ReactNode;\n showActionIcon?: boolean;\n verticalAlignment?: VerticalAlignmentType;\n variant?: CardVariant\n disabled?: boolean;\n} \n\nexport type CardProps<E extends ElementType = CardDefaultAsType> = CardOwnProps<E> &\n Omit<ComponentProps<E>, keyof CardOwnProps<E>>\n\nconst Card = <E extends ElementType = CardDefaultAsType>({\n as,\n children,\n classNames,\n density = 'medium',\n description,\n descriptionVariant = 'large',\n dropShadow = true,\n icon,\n label,\n onClick,\n actionIcon,\n title,\n titleVariant = 'large',\n showActionIcon,\n verticalAlignment = 'center',\n variant = 'default',\n disabled,\n ...rest\n}: CardProps<E>) => {\n const hideActionIcon = typeof actionIcon !== 'undefined' && !actionIcon;\n const propsWithActionIcon = onClick || rest?.href || rest.to; \n const cardDefaultTag = onClick ? 'button' : cardDefaultAs;\n const Tag = as || cardDefaultTag;\n \n return (\n <Tag\n className={classNamesUtil(\n classNames?.buttonWrapper,\n 'd-flex w100 ai-stretch',\n {\n 'c-pointer': propsWithActionIcon && !disabled,\n [styles.button]: propsWithActionIcon,\n [styles.buttonDisabled]: propsWithActionIcon && disabled,\n },\n )}\n {...onClick && { \n onClick, \n type: \"button\"\n }}\n {...rest}\n >\n <div\n className={classNamesUtil(\n 'd-flex fd-column jc-center w100 ta-left br8',\n { 'bs-sm': dropShadow && variant === 'default' },\n {\n xsmall: 'p16',\n small: styles.smallPadding,\n medium: 'p24',\n large: 'p32',\n }[density as DensityType],\n {\n top: 'jc-start',\n center: 'jc-center',\n bottom: 'jc-end',\n }[verticalAlignment as VerticalAlignmentType],\n styles?.wrapper,\n styles?.[`wrapper--${variant}`],\n {\n [styles?.[`wrapper--defaultNoShadow`]]: !dropShadow && variant === 'default',\n },\n classNames?.wrapper\n )}\n >\n <div className=\"d-flex w100\">\n {icon && (\n <div\n className={classNamesUtil(\n `d-flex`,\n styles.icon,\n styles[`iconDensity--${density}`],\n classNames?.icon, \n {\n top: 'ai-start',\n center: 'ai-center',\n bottom: 'ai-end',\n }[verticalAlignment as VerticalAlignmentType],\n )}\n >\n {icon}\n </div>\n )}\n\n <div className=\"d-flex jc-between w100\">\n <div\n className={classNamesUtil(\n classNames?.contentWrapper || '',\n \"d-flex jc-center gap8 fd-column tc-neutral-900 w100\"\n )}\n >\n {label && (\n <h4 className={classNamesUtil('p-p--small', classNames?.label)}>\n {label}\n </h4>\n )}\n\n {title && (\n <h3\n className={classNamesUtil(\n classNames?.title,\n {\n large: 'p-h3',\n medium: 'p-h4',\n small: 'p-p',\n }[titleVariant as TitleVariantType]\n )}\n >\n {title}\n </h3>\n )}\n\n {description && (\n <div\n className={classNamesUtil(\n styles.description,\n classNames?.description,\n descriptionVariant === 'small' ? 'p-p--small' : 'p-p',\n styles?.[`description--${variant}`]\n )}\n >\n {description}\n </div>\n )}\n </div>\n\n {(showActionIcon || (propsWithActionIcon && !hideActionIcon)) && (\n <div\n className={classNamesUtil(\n styles.actionIcon,\n classNames?.actionIcon,\n styles[`actionIconDensity--${density}`],\n 'd-flex ai-center'\n )}\n >\n {actionIcon || <ChevronRightIcon size={24} />}\n </div>\n )}\n </div>\n </div>\n\n {children && <div className={classNames?.children}>{children}</div>}\n </div>\n </Tag>\n );\n};\n\nexport { Card };\n"],"names":["classNames","_jsx","classNamesUtil","_jsxs"],"mappings":";;;;;;;;;;;;AAMA,IAAM,aAAa,GAAG,SAAkB,CAAA;IAwClC,IAAI,GAAG,UAA4C,EAmB1C;;IAlBb,IAAA,EAAE,QAAA,EACF,QAAQ,cAAA,EACRA,YAAU,gBAAA,EACV,eAAkB,EAAlB,OAAO,mBAAG,QAAQ,KAAA,EAClB,WAAW,iBAAA,EACX,0BAA4B,EAA5B,kBAAkB,mBAAG,OAAO,KAAA,EAC5B,kBAAiB,EAAjB,UAAU,mBAAG,IAAI,KAAA,EACjB,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,OAAO,aAAA,EACP,UAAU,gBAAA,EACV,KAAK,WAAA,EACL,oBAAsB,EAAtB,YAAY,mBAAG,OAAO,KAAA,EACtB,cAAc,oBAAA,EACd,yBAA4B,EAA5B,iBAAiB,mBAAG,QAAQ,KAAA,EAC5B,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EACnB,QAAQ,cAAA,EACL,IAAI,cAlBgD,+NAmBxD,CADQ;IAEP,IAAM,cAAc,GAAG,OAAO,UAAU,KAAK,WAAW,IAAI,CAAC,UAAU,CAAC;IACxE,IAAM,mBAAmB,GAAG,OAAO,KAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,CAAA,IAAI,IAAI,CAAC,EAAE,CAAC;IAC7D,IAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,aAAa,CAAC;IAC1D,IAAM,GAAG,GAAG,EAAE,IAAI,cAAc,CAAC;IAEjC,QACEC,IAAC,GAAG,aACF,SAAS,EAAEC,UAAc,CACvBF,YAAU,aAAVA,YAAU,uBAAVA,YAAU,CAAE,aAAa,EACzB,wBAAwB;gBAEtB,WAAW,EAAE,mBAAmB,IAAI,CAAC,QAAQ;;YAC7C,GAAC,MAAM,CAAC,MAAM,IAAG,mBAAmB;YACpC,GAAC,MAAM,CAAC,cAAc,IAAG,mBAAmB,IAAI,QAAQ;gBAE3D,IACG,OAAO,IAAI;QACb,OAAO,SAAA;QACP,IAAI,EAAE,QAAQ;KACf,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../../src/lib/components/cards/card/index.tsx"],"sourcesContent":["import { ComponentProps, ElementType, ReactNode } from 'react';\nimport classNamesUtil from 'classnames';\nimport { ChevronRightIcon } from '../../icon';\n\nimport styles from './style.module.scss';\n\nconst cardDefaultAs = 'section' as const\ntype CardDefaultAsType = typeof cardDefaultAs;\ntype DensityType = 'xsmall' | 'small' | 'medium' | 'large';\ntype TitleVariantType = 'small' | 'medium' | 'large';\ntype VerticalAlignmentType = 'top' | 'center' | 'bottom';\ntype CardVariant = 'default' | 'transparent' | 'outline' | 'secondary' | 'primary';\n\ntype CardOwnProps<E extends ElementType = CardDefaultAsType> = {\n as?: E;\n children?: ReactNode;\n classNames?: {\n buttonWrapper?: string;\n wrapper?: string\n contentWrapper?: string;\n label?: string;\n title?: string;\n description?: string;\n children?: string;\n icon?: string;\n actionIcon?: string;\n };\n density?: DensityType;\n dropShadow?: boolean;\n icon?: ReactNode;\n title?: ReactNode;\n titleVariant?: TitleVariantType;\n description?: ReactNode;\n descriptionVariant?: 'small' | 'large';\n label?: ReactNode;\n onClick?: () => void;\n actionIcon?: ReactNode;\n showActionIcon?: boolean;\n verticalAlignment?: VerticalAlignmentType;\n variant?: CardVariant\n disabled?: boolean;\n} \n\nexport type CardProps<E extends ElementType = CardDefaultAsType> = CardOwnProps<E> &\n Omit<ComponentProps<E>, keyof CardOwnProps<E>>\n\nconst Card = <E extends ElementType = CardDefaultAsType>({\n as,\n children,\n classNames,\n density = 'medium',\n description,\n descriptionVariant = 'large',\n dropShadow = true,\n icon,\n label,\n onClick,\n actionIcon,\n title,\n titleVariant = 'large',\n showActionIcon,\n verticalAlignment = 'center',\n variant = 'default',\n disabled,\n ...rest\n}: CardProps<E>) => {\n const hideActionIcon = typeof actionIcon !== 'undefined' && !actionIcon;\n const propsWithActionIcon = onClick || rest?.href || rest.to; \n const cardDefaultTag = onClick ? 'button' : cardDefaultAs;\n const Tag = as || cardDefaultTag;\n \n return (\n <Tag\n className={classNamesUtil(\n classNames?.buttonWrapper,\n 'd-flex w100 ai-stretch',\n {\n 'c-pointer': propsWithActionIcon && !disabled,\n [styles.button]: propsWithActionIcon,\n [styles.buttonDisabled]: propsWithActionIcon && disabled,\n },\n )}\n {...onClick && { \n onClick, \n type: \"button\"\n }}\n disabled={disabled}\n {...rest}\n >\n <div\n className={classNamesUtil(\n 'd-flex fd-column jc-center w100 ta-left br8',\n { 'bs-sm': dropShadow && variant === 'default' },\n {\n xsmall: 'p16',\n small: styles.smallPadding,\n medium: 'p24',\n large: 'p32',\n }[density as DensityType],\n {\n top: 'jc-start',\n center: 'jc-center',\n bottom: 'jc-end',\n }[verticalAlignment as VerticalAlignmentType],\n styles?.wrapper,\n styles?.[`wrapper--${variant}`],\n {\n [styles?.[`wrapper--defaultNoShadow`]]: !dropShadow && variant === 'default',\n },\n classNames?.wrapper\n )}\n >\n <div className=\"d-flex w100\">\n {icon && (\n <div\n className={classNamesUtil(\n `d-flex`,\n styles.icon,\n styles[`iconDensity--${density}`],\n classNames?.icon, \n {\n top: 'ai-start',\n center: 'ai-center',\n bottom: 'ai-end',\n }[verticalAlignment as VerticalAlignmentType],\n )}\n >\n {icon}\n </div>\n )}\n\n <div className=\"d-flex jc-between w100\">\n <div\n className={classNamesUtil(\n classNames?.contentWrapper || '',\n \"d-flex jc-center gap8 fd-column tc-neutral-900 w100\"\n )}\n >\n {label && (\n <h4 className={classNamesUtil('p-p--small', classNames?.label)}>\n {label}\n </h4>\n )}\n\n {title && (\n <h3\n className={classNamesUtil(\n classNames?.title,\n {\n large: 'p-h3',\n medium: 'p-h4',\n small: 'p-p',\n }[titleVariant as TitleVariantType]\n )}\n >\n {title}\n </h3>\n )}\n\n {description && (\n <div\n className={classNamesUtil(\n styles.description,\n classNames?.description,\n descriptionVariant === 'small' ? 'p-p--small' : 'p-p',\n styles?.[`description--${variant}`]\n )}\n >\n {description}\n </div>\n )}\n </div>\n\n {(showActionIcon || (propsWithActionIcon && !hideActionIcon)) && (\n <div\n className={classNamesUtil(\n styles.actionIcon,\n classNames?.actionIcon,\n styles[`actionIconDensity--${density}`],\n 'd-flex ai-center'\n )}\n >\n {actionIcon || <ChevronRightIcon size={24} />}\n </div>\n )}\n </div>\n </div>\n\n {children && <div className={classNames?.children}>{children}</div>}\n </div>\n </Tag>\n );\n};\n\nexport { Card };\n"],"names":["classNames","_jsx","classNamesUtil","_jsxs"],"mappings":"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"}
|
|
@@ -12,7 +12,7 @@ import { TableContents } from './components/TableContents/TableContents.js';
|
|
|
12
12
|
import { c as classNames } from '../../index-6ea95111.js';
|
|
13
13
|
import { u as useTableNavigation } from '../../useTableNavigation-17d5cd3c.js';
|
|
14
14
|
import { TableControls } from './components/TableControls/TableControls.js';
|
|
15
|
-
import { i as isBaseCell, T as TableSection } from '../../TableSection-
|
|
15
|
+
import { i as isBaseCell, T as TableSection } from '../../TableSection-cf3bbf3d.js';
|
|
16
16
|
import { u as useScrollSync } from '../../useScrollSync-b2d28bed.js';
|
|
17
17
|
import './components/TableCell/BaseCell/BaseCell.js';
|
|
18
18
|
import '../icon/icons/CheckThick.js';
|
|
@@ -37,7 +37,7 @@ import '../icon/icons/ChevronDown.js';
|
|
|
37
37
|
import '../icon/icons/ChevronUp.js';
|
|
38
38
|
import '../../useMediaQuery-1a3a2432.js';
|
|
39
39
|
import './components/TableContents/TableContents.js';
|
|
40
|
-
import '../../TableSection-
|
|
40
|
+
import '../../TableSection-cf3bbf3d.js';
|
|
41
41
|
import './components/TableContents/Collapsible.js';
|
|
42
42
|
import '../../useTableNavigation-17d5cd3c.js';
|
|
43
43
|
import './components/TableControls/TableControls.js';
|
|
@@ -37,7 +37,7 @@ import '../icon/icons/ChevronDown.js';
|
|
|
37
37
|
import '../icon/icons/ChevronUp.js';
|
|
38
38
|
import '../../useMediaQuery-1a3a2432.js';
|
|
39
39
|
import './components/TableContents/TableContents.js';
|
|
40
|
-
import '../../TableSection-
|
|
40
|
+
import '../../TableSection-cf3bbf3d.js';
|
|
41
41
|
import './components/TableContents/Collapsible.js';
|
|
42
42
|
import '../../useTableNavigation-17d5cd3c.js';
|
|
43
43
|
import './components/TableControls/TableControls.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { a as __assign, _ as __spreadArray } from '../../../../tslib.es6-a39f91fc.js';
|
|
2
2
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
3
|
import { useState } from 'react';
|
|
4
|
-
import { T as TableSection } from '../../../../TableSection-
|
|
4
|
+
import { T as TableSection } from '../../../../TableSection-cf3bbf3d.js';
|
|
5
5
|
import ChevronDownIcon from '../../../icon/icons/ChevronDown.js';
|
|
6
6
|
import ChevronUpIcon from '../../../icon/icons/ChevronUp.js';
|
|
7
7
|
import { Card } from '../../../cards/card/index.js';
|
|
@@ -6,7 +6,7 @@ import 'react';
|
|
|
6
6
|
import 'react-dom';
|
|
7
7
|
import '../../../../_commonjsHelpers-4730bd53.js';
|
|
8
8
|
import 'react-dom/test-utils';
|
|
9
|
-
import '../../../../TableSection-
|
|
9
|
+
import '../../../../TableSection-cf3bbf3d.js';
|
|
10
10
|
import '../../../../index-6ea95111.js';
|
|
11
11
|
import '../../../../style-inject.es-1f59c1d0.js';
|
|
12
12
|
import '../TableCell/TableCell.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import '../../../../tslib.es6-a39f91fc.js';
|
|
2
2
|
import 'react/jsx-runtime';
|
|
3
3
|
import '../../../../index-6ea95111.js';
|
|
4
|
-
export { T as TableSection } from '../../../../TableSection-
|
|
4
|
+
export { T as TableSection } from '../../../../TableSection-cf3bbf3d.js';
|
|
5
5
|
import '../TableCell/TableCell.js';
|
|
6
6
|
import 'react';
|
|
7
7
|
import '../../../../useMediaQuery-1a3a2432.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { a as __assign } from '../../../../tslib.es6-a39f91fc.js';
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
3
|
import { c as customRender, s as screen } from '../../../../customRender-be47569b.js';
|
|
4
|
-
import { T as TableSection } from '../../../../TableSection-
|
|
4
|
+
import { T as TableSection } from '../../../../TableSection-cf3bbf3d.js';
|
|
5
5
|
import 'react';
|
|
6
6
|
import 'react-dom';
|
|
7
7
|
import '../../../../_commonjsHelpers-4730bd53.js';
|
package/dist/esm/index.js
CHANGED
|
@@ -466,7 +466,7 @@ import './components/table/components/IconRenderer/IconRenderer.js';
|
|
|
466
466
|
import './components/table/components/TableCell/CardCell/CardCell.js';
|
|
467
467
|
import './components/table/components/TableCell/ButtonCell/ButtonCell.js';
|
|
468
468
|
import './components/table/components/TableContents/TableContents.js';
|
|
469
|
-
import './TableSection-
|
|
469
|
+
import './TableSection-cf3bbf3d.js';
|
|
470
470
|
import './components/table/components/TableContents/Collapsible.js';
|
|
471
471
|
import './useTableNavigation-17d5cd3c.js';
|
|
472
472
|
import './components/table/components/TableControls/TableControls.js';
|
package/package.json
CHANGED