@economic/taco 2.46.9 → 2.47.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Report/Report.d.ts +1 -1
- package/dist/components/Select2/components/Option.d.ts +4 -4
- package/dist/components/Table3/components/Row/Editing/CreateNewRow.d.ts +1 -2
- package/dist/components/Table3/components/Row/Editing/TemporaryRow.d.ts +1 -0
- package/dist/components/Table3/util/editing.d.ts +3 -0
- package/dist/esm/index.css +13 -4
- package/dist/esm/packages/taco/src/charts/utils/color.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Badge/Badge.js +9 -6
- package/dist/esm/packages/taco/src/components/Badge/Badge.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Option.js +7 -5
- package/dist/esm/packages/taco/src/components/Select2/components/Option.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js +56 -19
- package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/Table3.js +15 -7
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js +2 -4
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateNewRow.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js +3 -3
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/TemporaryRow.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/util/editing.js +9 -1
- package/dist/esm/packages/taco/src/components/Table3/util/editing.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Tag/Tag.js +6 -4
- package/dist/esm/packages/taco/src/components/Tag/Tag.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Expansion.js +4 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Expansion.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Footer.js +7 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Footer.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/FilterContext.js +6 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/FilterContext.js.map +1 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.js +5 -3
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/ManageFiltersPopover.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.js +0 -2
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.js +3 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowExpansion.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowExpansion.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/presets.js +7 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/presets.js.map +1 -1
- package/dist/index.css +13 -4
- package/dist/primitives/Table/Core/Table.d.ts +1 -0
- package/dist/primitives/Table/Core/components/Toolbar/components/Filters/FilterContext.d.ts +3 -0
- package/dist/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.d.ts +0 -1
- package/dist/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.d.ts +0 -3
- package/dist/primitives/Table/types.d.ts +2 -1
- package/dist/primitives/Table/useTableManager/features/useTableRowExpansion.d.ts +2 -1
- package/dist/taco.cjs.development.js +137 -61
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -3
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { ReportRef, ReportProps, ReportColumnProps, ReportGroupProps } from './types';
|
|
3
3
|
declare function Column<TType = unknown>(_: ReportColumnProps<TType>): null;
|
|
4
4
|
declare function Group(_: ReportGroupProps): null;
|
|
5
|
-
export declare const Report: (<TType = unknown>(props: Pick<import("../..").TableProps<TType>, "length" | "loadAll" | "loadPage" | "pageSize" | "enableFiltering" | "enableSearch" | "enableSorting" | "enableColumnFreezing" | "enableColumnHiding" | "enableColumnResizing" | "enableRowExpansion" | "enableRowSelection" | "enableColumnOrdering" | "enableFontSize" | "enableFooter" | "enablePrinting" | "enableRowActions" | "enableRowActive" | "enableRowClick" | "enableRowDrag" | "enableRowDrop" | "enableRowGoto" | "enableRowHeight" | "enableSaveSettings" | "children" | "data" | "id" | "customSettings" | "defaultColumnFreezingIndex" | "defaultRowActiveIndex" | "defaultRowGroupColumnId" | "defaultSettings" | "emptyState" | "rowActions" | "rowActionsForGroup" | "rowActionsLength" | "rowExpansionRenderer" | "rowIdentityAccessor" | "shortcuts" | "toolbarLeft" | "toolbarRight" | "toolbarPanel" | "onRowClick" | "onRowDrag" | "onRowDrop" | "onRowGoto" | "onRowSelect" | "onChangeFilter" | "onChangeSearch" | "onChangeSettings" | "onChangeSort"> & React.RefAttributes<import("../..").TableRef>) => JSX.Element) & {
|
|
5
|
+
export declare const Report: (<TType = unknown>(props: Pick<import("../..").TableProps<TType>, "length" | "loadAll" | "loadPage" | "pageSize" | "enableFiltering" | "enableSearch" | "enableSorting" | "enableColumnFreezing" | "enableColumnHiding" | "enableColumnResizing" | "enableRowExpansion" | "enableRowExpansionAll" | "enableRowSelection" | "enableColumnOrdering" | "enableFontSize" | "enableFooter" | "enablePrinting" | "enableRowActions" | "enableRowActive" | "enableRowClick" | "enableRowDrag" | "enableRowDrop" | "enableRowGoto" | "enableRowHeight" | "enableSaveSettings" | "children" | "data" | "id" | "customSettings" | "defaultColumnFreezingIndex" | "defaultRowActiveIndex" | "defaultRowGroupColumnId" | "defaultSettings" | "emptyState" | "rowActions" | "rowActionsForGroup" | "rowActionsLength" | "rowExpansionRenderer" | "rowIdentityAccessor" | "shortcuts" | "toolbarLeft" | "toolbarRight" | "toolbarPanel" | "onRowClick" | "onRowDrag" | "onRowDrop" | "onRowGoto" | "onRowSelect" | "onChangeFilter" | "onChangeSearch" | "onChangeSettings" | "onChangeSort"> & React.RefAttributes<import("../..").TableRef>) => JSX.Element) & {
|
|
6
6
|
Column: typeof Column;
|
|
7
7
|
Group: typeof Group;
|
|
8
8
|
};
|
|
@@ -4,7 +4,7 @@ import * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';
|
|
|
4
4
|
import { Color } from '../../../types';
|
|
5
5
|
import { FontSize } from '../../../types';
|
|
6
6
|
export declare type Select2OptionProps = Omit<ListboxPrimitive.Listbox2OptionProps, 'children' | 'prefix'> & {
|
|
7
|
-
children: string;
|
|
7
|
+
children: string | JSX.Element;
|
|
8
8
|
color?: Color;
|
|
9
9
|
description?: string;
|
|
10
10
|
fontSize?: FontSize;
|
|
@@ -13,11 +13,11 @@ export declare type Select2OptionProps = Omit<ListboxPrimitive.Listbox2OptionPro
|
|
|
13
13
|
textValue?: string;
|
|
14
14
|
};
|
|
15
15
|
export declare const Option: React.ForwardRefExoticComponent<Pick<ListboxPrimitive.Listbox2OptionProps, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "disabled" | "value"> & {
|
|
16
|
-
children: string;
|
|
16
|
+
children: string | JSX.Element;
|
|
17
17
|
color?: "green" | "yellow" | "red" | "blue" | "purple" | "brown" | "pink" | "orange" | "grey" | "transparent" | undefined;
|
|
18
18
|
description?: string | undefined;
|
|
19
19
|
fontSize?: "small" | "medium" | "large" | undefined;
|
|
20
|
-
prefix?: "id" | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "ai-chat-solid" | "ai-stars" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach-warning" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chart-area" | "chart-bar" | "chart-line" | "chart-pie" | "chart-table" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-information" | "circle-minus" | "circle-plus" | "circle-questionmark" | "circle-tick" | "circle-warning" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-signed-solid" | "document-signed" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "edit-simple" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope-solid" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "house-solid" | "house" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "link-external" | "list-bulleted" | "list-search" | "list" | "location" | "lock-open" | "lock" | "log-out" | "log" | "market" | "mastercard-os" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "november-first" | "numbers" | "partner-api" | "payment-paid" | "payment-unpaid" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "phone-solid" | "phone" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark-bold" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" |
|
|
21
|
-
postfix?: "id" | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "ai-chat-solid" | "ai-stars" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach-warning" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chart-area" | "chart-bar" | "chart-line" | "chart-pie" | "chart-table" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-information" | "circle-minus" | "circle-plus" | "circle-questionmark" | "circle-tick" | "circle-warning" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-signed-solid" | "document-signed" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "edit-simple" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope-solid" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "house-solid" | "house" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "link-external" | "list-bulleted" | "list-search" | "list" | "location" | "lock-open" | "lock" | "log-out" | "log" | "market" | "mastercard-os" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "november-first" | "numbers" | "partner-api" | "payment-paid" | "payment-unpaid" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "phone-solid" | "phone" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark-bold" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" |
|
|
20
|
+
prefix?: "id" | JSX.Element | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "ai-chat-solid" | "ai-stars" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach-warning" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chart-area" | "chart-bar" | "chart-line" | "chart-pie" | "chart-table" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-information" | "circle-minus" | "circle-plus" | "circle-questionmark" | "circle-tick" | "circle-warning" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-signed-solid" | "document-signed" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "edit-simple" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope-solid" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "house-solid" | "house" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "link-external" | "list-bulleted" | "list-search" | "list" | "location" | "lock-open" | "lock" | "log-out" | "log" | "market" | "mastercard-os" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "november-first" | "numbers" | "partner-api" | "payment-paid" | "payment-unpaid" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "phone-solid" | "phone" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark-bold" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" | undefined;
|
|
21
|
+
postfix?: "id" | JSX.Element | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "ai-chat-solid" | "ai-stars" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach-warning" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chart-area" | "chart-bar" | "chart-line" | "chart-pie" | "chart-table" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-information" | "circle-minus" | "circle-plus" | "circle-questionmark" | "circle-tick" | "circle-warning" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-signed-solid" | "document-signed" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "edit-simple" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope-solid" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "house-solid" | "house" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "link-external" | "list-bulleted" | "list-search" | "list" | "location" | "lock-open" | "lock" | "log-out" | "log" | "market" | "mastercard-os" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "november-first" | "numbers" | "partner-api" | "payment-paid" | "payment-unpaid" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "phone-solid" | "phone" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark-bold" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" | undefined;
|
|
22
22
|
textValue?: string | undefined;
|
|
23
23
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';
|
|
3
3
|
import { Table3EditingCreateHandler } from '../../../types';
|
|
4
|
-
import { TableRef } from '../../../../../primitives/Table/types';
|
|
5
4
|
declare type CreateNewRowProps<TType = unknown> = {
|
|
6
5
|
buttonRef: React.Ref<HTMLButtonElement>;
|
|
6
|
+
isScrolled: boolean;
|
|
7
7
|
onEditingCreate?: Table3EditingCreateHandler<TType>;
|
|
8
8
|
scrollToIndex: (index: number) => void;
|
|
9
9
|
table: ReactTable<TType>;
|
|
10
10
|
tableMeta: ReactTableMeta<TType>;
|
|
11
|
-
tableRef: React.RefObject<TableRef>;
|
|
12
11
|
};
|
|
13
12
|
export declare function CreateNewRow<TType = unknown>(props: CreateNewRowProps<TType>): JSX.Element;
|
|
14
13
|
export {};
|
|
@@ -3,6 +3,7 @@ import { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/reac
|
|
|
3
3
|
import { TableRef } from '../../../../../primitives/Table/types';
|
|
4
4
|
declare type TemporaryRowProps<TType = unknown> = {
|
|
5
5
|
createRowButtonRef: React.RefObject<HTMLButtonElement>;
|
|
6
|
+
isScrolled: boolean;
|
|
6
7
|
table: ReactTable<TType>;
|
|
7
8
|
tableMeta: ReactTableMeta<TType>;
|
|
8
9
|
tableRef: React.RefObject<TableRef>;
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import { Cell as ReactTableCell } from '@tanstack/react-table';
|
|
3
|
+
import { TableRef } from '../../../primitives/Table/types';
|
|
2
4
|
import { Localization } from '../../Provider/Localization';
|
|
3
5
|
export declare function willRowMove<TType = unknown>(cell: ReactTableCell<TType, unknown>, change: unknown, rowIndex: number, localization: Localization): "search" | "filter" | "sorting" | undefined;
|
|
4
6
|
export declare const TEMPORARY_ROW_ID_PREFIX = "temp-";
|
|
@@ -8,3 +10,4 @@ export declare const shortcut: {
|
|
|
8
10
|
meta: boolean;
|
|
9
11
|
shift: boolean;
|
|
10
12
|
};
|
|
13
|
+
export declare function isTableScrolled(ref: React.RefObject<TableRef>): boolean;
|
package/dist/esm/index.css
CHANGED
|
@@ -650,13 +650,22 @@ table[data-taco^='table'] tr[data-row-group]:first-child {
|
|
|
650
650
|
@apply pt-0;
|
|
651
651
|
}
|
|
652
652
|
|
|
653
|
+
/* Only apply -mt-px when the row group header is sticked to the top of the table.
|
|
654
|
+
margin-top -1px is needed to hide a little gap between the group header and table and the edge of the table.
|
|
655
|
+
If we'll not do this, then it will be slightly visible how rows are moving behind it when scrolled.
|
|
656
|
+
*/
|
|
657
|
+
|
|
658
|
+
table[data-taco^='table'] tr[data-row-group]:first-child td {
|
|
659
|
+
@apply -mt-px;
|
|
660
|
+
}
|
|
661
|
+
|
|
653
662
|
table[data-taco^='table'] tr[data-row-group]:not(:first-child):before {
|
|
654
663
|
content: '';
|
|
655
|
-
@apply bg-grey-100 border-grey-300 absolute left-0 right-0
|
|
664
|
+
@apply bg-grey-100 border-grey-300 absolute -top-1 left-0 right-0 h-10 border-t print:top-0 print:h-[2px] print:border-t-2;
|
|
656
665
|
}
|
|
657
666
|
|
|
658
667
|
table[data-taco^='table'] tr[data-row-group] td {
|
|
659
|
-
@apply
|
|
668
|
+
@apply border-b-2 border-t-0 font-bold;
|
|
660
669
|
}
|
|
661
670
|
|
|
662
671
|
table[data-taco^='table'] tr:first-child td {
|
|
@@ -752,14 +761,14 @@ table[data-taco^='table'] td:not([data-cell-truncate='true']) {
|
|
|
752
761
|
}
|
|
753
762
|
|
|
754
763
|
/* FOOTER */
|
|
755
|
-
table[data-taco^='table'] tfoot td {
|
|
764
|
+
table[data-taco^='table'] tfoot tr:not([data-row-index]) td {
|
|
756
765
|
/*
|
|
757
766
|
* Since footer has sticky position, the top and bottom padding ensures that the inner content doesn't come over
|
|
758
767
|
* the border of the footer row.
|
|
759
768
|
*/
|
|
760
769
|
@apply border-b-0 !py-1 font-bold;
|
|
761
770
|
}
|
|
762
|
-
table[data-taco^='table'] tfoot td:first-child {
|
|
771
|
+
table[data-taco^='table'] tfoot tr:not([data-row-index]) td:first-child {
|
|
763
772
|
@apply z-30 !pb-0 !pt-[2px];
|
|
764
773
|
}
|
|
765
774
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"color.js","sources":["../../../../../../../src/charts/utils/color.ts"],"sourcesContent":["import themeColors from '
|
|
1
|
+
{"version":3,"file":"color.js","sources":["../../../../../../../src/charts/utils/color.ts"],"sourcesContent":["import themeColors from '../../../tailwind.colors.js';\n\nconst mapColor = (palette, prefix = ''): any => {\n return Object.keys(palette).reduce((accum, color) => {\n if (color === 'current') {\n return accum;\n } else if (typeof palette[color] === 'string') {\n return {\n ...accum,\n [prefix ? (color === 'DEFAULT' ? prefix : `${prefix}-${color}`) : color]: palette[color],\n };\n } else {\n return {\n ...accum,\n ...mapColor(palette[color], color),\n };\n }\n }, {});\n};\n\nexport const colors: Record<string, string> = mapColor(themeColors);\n\nexport type Color = keyof typeof colors;\n\nexport const getThemeColor = (color: string) => colors[color];\n"],"names":["mapColor","palette","prefix","Object","keys","reduce","accum","color","colors","themeColors","getThemeColor"],"mappings":";;AAEA,MAAMA,QAAQ,GAAGA,CAACC,OAAO,EAAEC,MAAM,GAAG,EAAE;EAClC,OAAOC,MAAM,CAACC,IAAI,CAACH,OAAO,CAAC,CAACI,MAAM,CAAC,CAACC,KAAK,EAAEC,KAAK;IAC5C,IAAIA,KAAK,KAAK,SAAS,EAAE;MACrB,OAAOD,KAAK;KACf,MAAM,IAAI,OAAOL,OAAO,CAACM,KAAK,CAAC,KAAK,QAAQ,EAAE;MAC3C,OAAO;QACH,GAAGD,KAAK;QACR,CAACJ,MAAM,GAAIK,KAAK,KAAK,SAAS,GAAGL,MAAM,GAAG,GAAGA,MAAM,IAAIK,KAAK,EAAE,GAAIA,KAAK,GAAGN,OAAO,CAACM,KAAK;OAC1F;KACJ,MAAM;MACH,OAAO;QACH,GAAGD,KAAK;QACR,GAAGN,QAAQ,CAACC,OAAO,CAACM,KAAK,CAAC,EAAEA,KAAK;OACpC;;GAER,EAAE,EAAE,CAAC;AACV,CAAC;MAEYC,MAAM,gBAA2BR,QAAQ,CAACS,WAAW;MAIrDC,aAAa,GAAIH,KAAa,IAAKC,MAAM,CAACD,KAAK;;;;"}
|
|
@@ -15,10 +15,10 @@ const Badge = /*#__PURE__*/forwardRef(function Badge(props, ref) {
|
|
|
15
15
|
...otherProps
|
|
16
16
|
} = props;
|
|
17
17
|
const isTransparent = color === 'transparent';
|
|
18
|
-
const className = cn('rounded-full border overflow-hidden whitespace-nowrap inline-flex items-center justify-center', {
|
|
18
|
+
const className = cn('rounded-full border box-border overflow-hidden whitespace-nowrap inline-flex items-center justify-center', {
|
|
19
19
|
[`border ${getOutlineColorShadeClasses(color)}`]: outline,
|
|
20
|
-
[`border-
|
|
21
|
-
[`border-
|
|
20
|
+
[`border-none font-normal ${getSubtleColorShadeClasses(color)}`]: subtle,
|
|
21
|
+
[`border-none ${getColorShadeClasses(color)}`]: !outline && !subtle,
|
|
22
22
|
'h-4 min-w-0 py-0 px-1 text-xs': small,
|
|
23
23
|
'h-2 w-2 min-w-0': compact,
|
|
24
24
|
'font-bold': outline || !subtle,
|
|
@@ -30,12 +30,15 @@ const Badge = /*#__PURE__*/forwardRef(function Badge(props, ref) {
|
|
|
30
30
|
if (compact) {
|
|
31
31
|
return /*#__PURE__*/createElement(VisuallyHidden, null, children);
|
|
32
32
|
}
|
|
33
|
+
const contentToRender = typeof children === 'string' ? /*#__PURE__*/createElement("span", {
|
|
34
|
+
className: "items-center truncate"
|
|
35
|
+
}, children) : children;
|
|
33
36
|
if (status) {
|
|
34
37
|
return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement("div", {
|
|
35
|
-
className: cn('mr-1 h-2 w-2 rounded-full', getColorShadeClasses(color))
|
|
36
|
-
}),
|
|
38
|
+
className: cn('mr-1 h-2 w-2 shrink-0 rounded-full', getColorShadeClasses(color))
|
|
39
|
+
}), contentToRender);
|
|
37
40
|
}
|
|
38
|
-
return
|
|
41
|
+
return contentToRender;
|
|
39
42
|
};
|
|
40
43
|
return /*#__PURE__*/createElement("span", Object.assign({}, otherProps, {
|
|
41
44
|
"aria-atomic": "true",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","sources":["../../../../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport { Color } from '../../types';\nimport { getSubtleColorShadeClasses, getColorShadeClasses, getOutlineColorShadeClasses } from '../../utils/tailwind';\nimport './Badge.css';\n\nexport type BadgeBaseProps = React.HTMLAttributes<HTMLSpanElement> & {\n /** Content should be a numerical value or tag/status like text **/\n children: React.ReactNode;\n /** Show small version of badge **/\n small?: boolean;\n /** Background color **/\n color?: Color;\n};\n\ninterface CompactBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: boolean;\n /** Show outlined version **/\n outline?: never;\n /** Show subtle version **/\n subtle?: never;\n /** Show status dot - can be used only in subtle badge **/\n status?: never;\n}\n\ninterface OutlineBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: never;\n /** Show outlined version **/\n outline?: boolean;\n /** Show subtle version **/\n subtle?: never;\n /** Show status dot - can be used only in subtle badge **/\n status?: never;\n}\n\ninterface SubtleBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: never;\n /** Show outlined version **/\n outline?: never;\n /** Show subtle version **/\n subtle?: boolean;\n /** Show status dot - can be used only in subtle badge **/\n status?: never;\n}\n\ninterface StatusBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: never;\n /** Show outlined version **/\n outline?: never;\n /** Show subtle version **/\n subtle?: boolean;\n /** Show status dot - can be used only in subtle badge **/\n status?: boolean;\n}\n\nexport type BadgeProps = CompactBadgeProps | OutlineBadgeProps | SubtleBadgeProps | StatusBadgeProps;\n\nexport const Badge = React.forwardRef(function Badge(props: BadgeProps, ref: React.Ref<HTMLSpanElement>) {\n const {\n children,\n compact = false,\n outline = false,\n status = false,\n subtle = false,\n small = false,\n color,\n ...otherProps\n } = props;\n const isTransparent = color === 'transparent';\n const className = cn(\n 'rounded-full border overflow-hidden whitespace-nowrap inline-flex items-center justify-center',\n {\n [`border ${getOutlineColorShadeClasses(color)}`]: outline,\n [`border-
|
|
1
|
+
{"version":3,"file":"Badge.js","sources":["../../../../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport { Color } from '../../types';\nimport { getSubtleColorShadeClasses, getColorShadeClasses, getOutlineColorShadeClasses } from '../../utils/tailwind';\nimport './Badge.css';\n\nexport type BadgeBaseProps = React.HTMLAttributes<HTMLSpanElement> & {\n /** Content should be a numerical value or tag/status like text **/\n children: React.ReactNode;\n /** Show small version of badge **/\n small?: boolean;\n /** Background color **/\n color?: Color;\n};\n\ninterface CompactBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: boolean;\n /** Show outlined version **/\n outline?: never;\n /** Show subtle version **/\n subtle?: never;\n /** Show status dot - can be used only in subtle badge **/\n status?: never;\n}\n\ninterface OutlineBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: never;\n /** Show outlined version **/\n outline?: boolean;\n /** Show subtle version **/\n subtle?: never;\n /** Show status dot - can be used only in subtle badge **/\n status?: never;\n}\n\ninterface SubtleBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: never;\n /** Show outlined version **/\n outline?: never;\n /** Show subtle version **/\n subtle?: boolean;\n /** Show status dot - can be used only in subtle badge **/\n status?: never;\n}\n\ninterface StatusBadgeProps extends BadgeBaseProps {\n /** Show compact version **/\n compact?: never;\n /** Show outlined version **/\n outline?: never;\n /** Show subtle version **/\n subtle?: boolean;\n /** Show status dot - can be used only in subtle badge **/\n status?: boolean;\n}\n\nexport type BadgeProps = CompactBadgeProps | OutlineBadgeProps | SubtleBadgeProps | StatusBadgeProps;\n\nexport const Badge = React.forwardRef(function Badge(props: BadgeProps, ref: React.Ref<HTMLSpanElement>) {\n const {\n children,\n compact = false,\n outline = false,\n status = false,\n subtle = false,\n small = false,\n color,\n ...otherProps\n } = props;\n const isTransparent = color === 'transparent';\n const className = cn(\n 'rounded-full border box-border overflow-hidden whitespace-nowrap inline-flex items-center justify-center',\n {\n [`border ${getOutlineColorShadeClasses(color)}`]: outline,\n [`border-none font-normal ${getSubtleColorShadeClasses(color)}`]: subtle,\n [`border-none ${getColorShadeClasses(color)}`]: !outline && !subtle,\n 'h-4 min-w-0 py-0 px-1 text-xs': small,\n 'h-2 w-2 min-w-0': compact,\n 'font-bold': outline || !subtle,\n 'text-sm': !small,\n 'h-5 py-0 px-1.5': !compact && !small, // custom padding keeps single digits in a perfect circle\n '!bg-grey-700': compact && isTransparent,\n },\n props.className\n );\n\n const content = () => {\n if (compact) {\n return <VisuallyHidden>{children}</VisuallyHidden>;\n }\n\n const contentToRender =\n typeof children === 'string' ? <span className=\"items-center truncate\">{children}</span> : children;\n\n if (status) {\n return (\n <>\n <div className={cn('mr-1 h-2 w-2 shrink-0 rounded-full', getColorShadeClasses(color))} />\n {contentToRender}\n </>\n );\n }\n return contentToRender;\n };\n\n return (\n <span\n {...otherProps}\n aria-atomic=\"true\"\n aria-live=\"polite\"\n className={className}\n data-taco=\"badge\"\n ref={ref}\n role=\"status\"\n title={props['aria-label']}>\n {content()}\n </span>\n );\n});\n"],"names":["Badge","React","props","ref","children","compact","outline","status","subtle","small","color","otherProps","isTransparent","className","cn","getOutlineColorShadeClasses","getSubtleColorShadeClasses","getColorShadeClasses","content","VisuallyHidden","contentToRender","role","title"],"mappings":";;;;;MA8DaA,KAAK,gBAAGC,UAAgB,CAAC,SAASD,KAAKA,CAACE,KAAiB,EAAEC,GAA+B;EACnG,MAAM;IACFC,QAAQ;IACRC,OAAO,GAAG,KAAK;IACfC,OAAO,GAAG,KAAK;IACfC,MAAM,GAAG,KAAK;IACdC,MAAM,GAAG,KAAK;IACdC,KAAK,GAAG,KAAK;IACbC,KAAK;IACL,GAAGC;GACN,GAAGT,KAAK;EACT,MAAMU,aAAa,GAAGF,KAAK,KAAK,aAAa;EAC7C,MAAMG,SAAS,GAAGC,EAAE,CAChB,0GAA0G,EAC1G;IACI,CAAC,UAAUC,2BAA2B,CAACL,KAAK,CAAC,EAAE,GAAGJ,OAAO;IACzD,CAAC,2BAA2BU,0BAA0B,CAACN,KAAK,CAAC,EAAE,GAAGF,MAAM;IACxE,CAAC,eAAeS,oBAAoB,CAACP,KAAK,CAAC,EAAE,GAAG,CAACJ,OAAO,IAAI,CAACE,MAAM;IACnE,+BAA+B,EAAEC,KAAK;IACtC,iBAAiB,EAAEJ,OAAO;IAC1B,WAAW,EAAEC,OAAO,IAAI,CAACE,MAAM;IAC/B,SAAS,EAAE,CAACC,KAAK;IACjB,iBAAiB,EAAE,CAACJ,OAAO,IAAI,CAACI,KAAK;IACrC,cAAc,EAAEJ,OAAO,IAAIO;GAC9B,EACDV,KAAK,CAACW,SAAS,CAClB;EAED,MAAMK,OAAO,GAAGA;IACZ,IAAIb,OAAO,EAAE;MACT,oBAAOJ,cAACkB,cAAc,QAAEf,QAAQ,CAAkB;;IAGtD,MAAMgB,eAAe,GACjB,OAAOhB,QAAQ,KAAK,QAAQ,gBAAGH;MAAMY,SAAS,EAAC;OAAyBT,QAAQ,CAAQ,GAAGA,QAAQ;IAEvG,IAAIG,MAAM,EAAE;MACR,oBACIN,2CACIA;QAAKY,SAAS,EAAEC,EAAE,CAAC,oCAAoC,EAAEG,oBAAoB,CAACP,KAAK,CAAC;QAAK,EACxFU,eAAe,CACjB;;IAGX,OAAOA,eAAe;GACzB;EAED,oBACInB,wCACQU,UAAU;mBACF,MAAM;iBACR,QAAQ;IAClBE,SAAS,EAAEA,SAAS;iBACV,OAAO;IACjBV,GAAG,EAAEA,GAAG;IACRkB,IAAI,EAAC,QAAQ;IACbC,KAAK,EAAEpB,KAAK,CAAC,YAAY;MACxBgB,OAAO,EAAE,CACP;AAEf,CAAC;;;;"}
|
|
@@ -72,12 +72,13 @@ const Option = /*#__PURE__*/React__default.forwardRef(function Select2Option(pro
|
|
|
72
72
|
}), hasValue ? (/*#__PURE__*/React__default.createElement(Icon, {
|
|
73
73
|
name: "tick",
|
|
74
74
|
className: "pointer-events-none invisible -mx-0.5 !h-4 !w-4 group-aria-selected:visible"
|
|
75
|
-
})) : null, isTag ? (/*#__PURE__*/React__default.createElement(Tag, {
|
|
75
|
+
})) : null, typeof children !== 'string' ? (/*#__PURE__*/React__default.createElement("span", null, children)) : isTag ? (/*#__PURE__*/React__default.createElement(Tag, {
|
|
76
76
|
className: "pointer-events-none my-1",
|
|
77
77
|
color: color,
|
|
78
78
|
icon: prefix
|
|
79
79
|
}, children)) : (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, prefix ? typeof prefix === 'string' ? /*#__PURE__*/React__default.createElement(Icon, {
|
|
80
|
-
name: prefix
|
|
80
|
+
name: prefix,
|
|
81
|
+
className: "!h-5 !w-5"
|
|
81
82
|
}) : prefix : null, /*#__PURE__*/React__default.createElement("span", {
|
|
82
83
|
className: "flex w-full justify-between"
|
|
83
84
|
}, /*#__PURE__*/React__default.createElement("span", {
|
|
@@ -86,9 +87,10 @@ const Option = /*#__PURE__*/React__default.forwardRef(function Select2Option(pro
|
|
|
86
87
|
className: "text-grey-700 -mt-1.5 mb-1.5 text-xs"
|
|
87
88
|
}, description) : null), /*#__PURE__*/React__default.createElement("span", {
|
|
88
89
|
className: "flex flex-col self-center"
|
|
89
|
-
}, postfix ? typeof postfix === 'string' ? /*#__PURE__*/React__default.createElement(Icon, {
|
|
90
|
-
name: postfix
|
|
91
|
-
|
|
90
|
+
}, postfix ? typeof postfix === 'string' ? (/*#__PURE__*/React__default.createElement(Icon, {
|
|
91
|
+
name: postfix,
|
|
92
|
+
className: "!h-5 !w-5"
|
|
93
|
+
})) : postfix : null)))), popover ? (/*#__PURE__*/React__default.createElement(IconButton, {
|
|
92
94
|
icon: "ellipsis-vertical",
|
|
93
95
|
appearance: "discrete",
|
|
94
96
|
className: cn('group-aria-current:visible invisible -mr-1 ml-auto !h-5 min-h-[theme(spacing.6)] !w-5 min-w-[theme(spacing.6)] hover:!bg-black/[.08] focus:!shadow-none group-hover:visible', {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Option.js","sources":["../../../../../../../../src/components/Select2/components/Option.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Icon, IconName } from '../../Icon/Icon';\nimport { Tag } from '../../Tag/Tag';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\nimport { createOptionClassName, getFontSize } from '../utilities';\nimport { useSelect2Context } from './Context';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { EditPopover } from './Edit';\nimport { isMobileDevice } from '../../../utils/device';\nimport { Color } from '../../../types';\nimport { FontSize } from '../../../types';\n\nexport type Select2OptionProps = Omit<ListboxPrimitive.Listbox2OptionProps, 'children' | 'prefix'> & {\n children: string;\n color?: Color;\n description?: string;\n fontSize?: FontSize;\n prefix?: IconName | JSX.Element;\n postfix?: IconName | JSX.Element;\n textValue?: string;\n};\n\nexport const Option = React.forwardRef<HTMLDivElement, Select2OptionProps>(function Select2Option(props, ref) {\n const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;\n const {\n fontSize,\n listboxRef,\n multiple,\n onDelete,\n onEdit,\n ref: selectRef,\n setOpen,\n shouldPauseHoverState,\n tags,\n value,\n } = useSelect2Context();\n const className = cn(createOptionClassName(shouldPauseHoverState), getFontSize(fontSize), cName);\n\n const hasValue = Array.isArray(value) ? !!value.length : value !== undefined;\n const isTag = tags && !!color;\n\n const handleClick = () => {\n if (!multiple) {\n setOpen(false);\n } else {\n selectRef.current?.focus();\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (isAriaSelectionKey(event)) {\n if (!multiple || event.key === 'Tab') {\n setOpen(false);\n }\n }\n };\n\n const isEmptyOption = children !== '';\n\n const popover =\n isEmptyOption && (onEdit || onDelete)\n ? popoverProps => (\n <EditPopover\n {...popoverProps}\n color={props.color}\n key={props.textValue ?? String(props.children)}\n text={props.textValue ?? String(props.children)}\n value={props.value}\n />\n )\n : undefined;\n\n return (\n <ListboxPrimitive.Option {...otherProps} className={className} onClick={handleClick} onKeyDown={handleKeyDown} ref={ref}>\n {hasValue ? (\n <Icon name=\"tick\" className=\"pointer-events-none invisible -mx-0.5 !h-4 !w-4 group-aria-selected:visible\" />\n ) : null}\n\n {isTag ? (\n <Tag className=\"pointer-events-none my-1\" color={color} icon={prefix}>\n {children}\n </Tag>\n ) : (\n <>\n {prefix ? typeof prefix === 'string' ? <Icon name={prefix} /> : prefix : null}\n <span className=\"flex w-full justify-between\">\n <span className=\"flex flex-col\">\n <span>{children}</span>\n {description ? <span className=\"text-grey-700 -mt-1.5 mb-1.5 text-xs\">{description}</span> : null}\n </span>\n <span className=\"flex flex-col self-center\">\n {postfix ? typeof postfix === 'string' ? <Icon name={postfix}
|
|
1
|
+
{"version":3,"file":"Option.js","sources":["../../../../../../../../src/components/Select2/components/Option.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Icon, IconName } from '../../Icon/Icon';\nimport { Tag } from '../../Tag/Tag';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport * as ListboxPrimitive from '../../../primitives/Listbox2/Listbox2';\nimport { createOptionClassName, getFontSize } from '../utilities';\nimport { useSelect2Context } from './Context';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { EditPopover } from './Edit';\nimport { isMobileDevice } from '../../../utils/device';\nimport { Color } from '../../../types';\nimport { FontSize } from '../../../types';\n\nexport type Select2OptionProps = Omit<ListboxPrimitive.Listbox2OptionProps, 'children' | 'prefix'> & {\n children: string | JSX.Element;\n color?: Color;\n description?: string;\n fontSize?: FontSize;\n prefix?: IconName | JSX.Element;\n postfix?: IconName | JSX.Element;\n textValue?: string;\n};\n\nexport const Option = React.forwardRef<HTMLDivElement, Select2OptionProps>(function Select2Option(props, ref) {\n const { children, color, description, prefix, postfix, className: cName, ...otherProps } = props;\n const {\n fontSize,\n listboxRef,\n multiple,\n onDelete,\n onEdit,\n ref: selectRef,\n setOpen,\n shouldPauseHoverState,\n tags,\n value,\n } = useSelect2Context();\n const className = cn(createOptionClassName(shouldPauseHoverState), getFontSize(fontSize), cName);\n\n const hasValue = Array.isArray(value) ? !!value.length : value !== undefined;\n const isTag = tags && !!color;\n\n const handleClick = () => {\n if (!multiple) {\n setOpen(false);\n } else {\n selectRef.current?.focus();\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (isAriaSelectionKey(event)) {\n if (!multiple || event.key === 'Tab') {\n setOpen(false);\n }\n }\n };\n\n const isEmptyOption = children !== '';\n\n const popover =\n isEmptyOption && (onEdit || onDelete)\n ? popoverProps => (\n <EditPopover\n {...popoverProps}\n color={props.color}\n key={props.textValue ?? String(props.children)}\n text={props.textValue ?? String(props.children)}\n value={props.value}\n />\n )\n : undefined;\n\n return (\n <ListboxPrimitive.Option {...otherProps} className={className} onClick={handleClick} onKeyDown={handleKeyDown} ref={ref}>\n {hasValue ? (\n <Icon name=\"tick\" className=\"pointer-events-none invisible -mx-0.5 !h-4 !w-4 group-aria-selected:visible\" />\n ) : null}\n\n {typeof children !== 'string' ? (\n <span>{children}</span>\n ) : isTag ? (\n <Tag className=\"pointer-events-none my-1\" color={color} icon={prefix}>\n {children}\n </Tag>\n ) : (\n <>\n {prefix ? typeof prefix === 'string' ? <Icon name={prefix} className=\"!h-5 !w-5\" /> : prefix : null}\n <span className=\"flex w-full justify-between\">\n <span className=\"flex flex-col\">\n <span>{children}</span>\n {description ? <span className=\"text-grey-700 -mt-1.5 mb-1.5 text-xs\">{description}</span> : null}\n </span>\n <span className=\"flex flex-col self-center\">\n {postfix ? (\n typeof postfix === 'string' ? (\n <Icon name={postfix} className=\"!h-5 !w-5\" />\n ) : (\n postfix\n )\n ) : null}\n </span>\n </span>\n </>\n )}\n {popover ? (\n <IconButton\n icon=\"ellipsis-vertical\"\n appearance=\"discrete\"\n className={cn(\n 'group-aria-current:visible invisible -mr-1 ml-auto !h-5 min-h-[theme(spacing.6)] !w-5 min-w-[theme(spacing.6)] hover:!bg-black/[.08] focus:!shadow-none group-hover:visible',\n {\n '!visible': isMobileDevice(window?.navigator),\n }\n )}\n onClick={event => {\n event.stopPropagation();\n listboxRef?.current?.setActiveIndexByElement(event.currentTarget.parentElement as HTMLDivElement);\n }}\n popover={popover}\n tabIndex={-1}\n />\n ) : null}\n </ListboxPrimitive.Option>\n );\n});\n"],"names":["Option","React","forwardRef","Select2Option","props","ref","children","color","description","prefix","postfix","className","cName","otherProps","fontSize","listboxRef","multiple","onDelete","onEdit","selectRef","setOpen","shouldPauseHoverState","tags","value","useSelect2Context","cn","createOptionClassName","getFontSize","hasValue","Array","isArray","length","undefined","isTag","handleClick","_selectRef$current","current","focus","handleKeyDown","event","isAriaSelectionKey","key","isEmptyOption","popover","popoverProps","_props$textValue","_props$textValue2","EditPopover","textValue","String","text","ListboxPrimitive","onClick","onKeyDown","Icon","name","Tag","icon","IconButton","appearance","isMobileDevice","_window","window","navigator","stopPropagation","_listboxRef$current","setActiveIndexByElement","currentTarget","parentElement","tabIndex"],"mappings":"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"}
|
|
@@ -135,7 +135,7 @@ const Single = /*#__PURE__*/React__default.forwardRef(function Select2TriggerSin
|
|
|
135
135
|
readOnly,
|
|
136
136
|
tags
|
|
137
137
|
} = useSelect2Context();
|
|
138
|
-
const contentClassName = cn('truncate items-center gap-1');
|
|
138
|
+
const contentClassName = cn('truncate flex items-center gap-1');
|
|
139
139
|
const currentValue = children.find(matchesValue(value));
|
|
140
140
|
let output;
|
|
141
141
|
if (placeholder && currentValue === undefined) {
|
|
@@ -145,13 +145,13 @@ const Single = /*#__PURE__*/React__default.forwardRef(function Select2TriggerSin
|
|
|
145
145
|
}, placeholder);
|
|
146
146
|
} else if (currentValue) {
|
|
147
147
|
if (tags && emptyValue !== value) {
|
|
148
|
-
output = /*#__PURE__*/React__default.createElement(Tag, {
|
|
148
|
+
if (typeof currentValue.props.children === 'string') output = /*#__PURE__*/React__default.createElement(Tag, {
|
|
149
149
|
className: "truncate",
|
|
150
150
|
color: currentValue.props.color,
|
|
151
151
|
disabled: disabled,
|
|
152
152
|
icon: currentValue.props.prefix,
|
|
153
153
|
readOnly: readOnly
|
|
154
|
-
}, currentValue.props.children);
|
|
154
|
+
}, currentValue.props.children);else output = currentValue.props.children;
|
|
155
155
|
} else {
|
|
156
156
|
output = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, currentValue.props.prefix ? typeof currentValue.props.prefix === 'string' ? (/*#__PURE__*/React__default.createElement(Icon, {
|
|
157
157
|
name: currentValue.props.prefix,
|
|
@@ -202,7 +202,7 @@ const Multiple = /*#__PURE__*/React__default.forwardRef(function Select2TriggerM
|
|
|
202
202
|
}, valuesAsChildren.length === 0 ? (/*#__PURE__*/React__default.createElement(Placeholder, {
|
|
203
203
|
disabled: disabled,
|
|
204
204
|
readOnly: readOnly
|
|
205
|
-
}, placeholder)) : valuesAsChildren.map(child => (/*#__PURE__*/React__default.createElement(Tag, {
|
|
205
|
+
}, placeholder)) : valuesAsChildren.map(child => typeof child.props.children === 'string' ? (/*#__PURE__*/React__default.createElement(Tag, {
|
|
206
206
|
key: String(child.props.value),
|
|
207
207
|
className: "truncate",
|
|
208
208
|
color: tags ? child.props.color : undefined,
|
|
@@ -216,7 +216,23 @@ const Multiple = /*#__PURE__*/React__default.forwardRef(function Select2TriggerM
|
|
|
216
216
|
}
|
|
217
217
|
},
|
|
218
218
|
readOnly: readOnly
|
|
219
|
-
}, child.props.children))
|
|
219
|
+
}, child.props.children)) : (/*#__PURE__*/React__default.cloneElement(child.props.children, {
|
|
220
|
+
key: String(child.props.value),
|
|
221
|
+
className: '!pr-0 !pl-1.5',
|
|
222
|
+
children: (/*#__PURE__*/React__default.createElement("span", {
|
|
223
|
+
className: "flex items-center"
|
|
224
|
+
}, child.props.children.props.children, /*#__PURE__*/React__default.createElement(Icon, {
|
|
225
|
+
name: "close",
|
|
226
|
+
onClick: event => {
|
|
227
|
+
event === null || event === void 0 ? void 0 : event.stopPropagation();
|
|
228
|
+
event === null || event === void 0 ? void 0 : event.preventDefault();
|
|
229
|
+
if (!disabled && !readOnly) {
|
|
230
|
+
setValue(child.props.value);
|
|
231
|
+
}
|
|
232
|
+
},
|
|
233
|
+
className: "ml-0.5 !h-5 !w-5 shrink-0 cursor-pointer rounded-r p-0.5 hover:bg-black/5"
|
|
234
|
+
})))
|
|
235
|
+
})))));
|
|
220
236
|
} else {
|
|
221
237
|
content = /*#__PURE__*/React__default.createElement(MultipleValue, {
|
|
222
238
|
onClick: forwardClick,
|
|
@@ -247,6 +263,18 @@ const MultipleValue = ({
|
|
|
247
263
|
} = useSelect2Context();
|
|
248
264
|
const [contentRef, setContentRef] = React__default.useState(null);
|
|
249
265
|
const boundaryIndex = contentRef ? getIndexOfFirstChildOverflowingParent(contentRef, 30) : undefined;
|
|
266
|
+
// Retrieves the relevant text content from any JSX.Element passed as a select option, handling nested elements, arrays, and direct text
|
|
267
|
+
const getTooltipTitle = child => {
|
|
268
|
+
const children = child.props.children;
|
|
269
|
+
if (typeof children === 'string') return children;
|
|
270
|
+
if (typeof children.props.children === 'string') {
|
|
271
|
+
return children.props.children;
|
|
272
|
+
}
|
|
273
|
+
if (Array.isArray(children.props.children)) {
|
|
274
|
+
return children.props.children.filter(item => typeof item === 'string');
|
|
275
|
+
}
|
|
276
|
+
return '';
|
|
277
|
+
};
|
|
250
278
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
251
279
|
className: "relative flex w-full items-center gap-1 overflow-hidden",
|
|
252
280
|
onClick: onClick
|
|
@@ -257,26 +285,35 @@ const MultipleValue = ({
|
|
|
257
285
|
disabled: disabled,
|
|
258
286
|
readOnly: readOnly
|
|
259
287
|
}, placeholder)) : valuesAsChildren.map((child, index) => {
|
|
260
|
-
const
|
|
261
|
-
|
|
288
|
+
const classNames = {
|
|
289
|
+
truncate: index === boundaryIndex,
|
|
290
|
+
hidden: boundaryIndex !== undefined && boundaryIndex !== null ? index > boundaryIndex : false
|
|
291
|
+
};
|
|
292
|
+
let output;
|
|
293
|
+
if (typeof child.props.children === 'string') {
|
|
294
|
+
output = /*#__PURE__*/React__default.createElement(Tag, {
|
|
295
|
+
key: String(child.props.value),
|
|
296
|
+
className: cn('cursor-pointer', classNames),
|
|
297
|
+
color: tags ? child.props.color : undefined,
|
|
298
|
+
disabled: disabled,
|
|
299
|
+
icon: child.props.prefix,
|
|
300
|
+
readOnly: readOnly
|
|
301
|
+
}, child.props.children);
|
|
302
|
+
} else output = /*#__PURE__*/React__default.cloneElement(child.props.children, {
|
|
262
303
|
className: cn('cursor-pointer', {
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
disabled: disabled,
|
|
268
|
-
icon: child.props.prefix,
|
|
269
|
-
readOnly: readOnly
|
|
270
|
-
}, child.props.children);
|
|
304
|
+
'shrink-0': index !== boundaryIndex
|
|
305
|
+
}, classNames),
|
|
306
|
+
key: String(child.props.value)
|
|
307
|
+
});
|
|
271
308
|
if (index === boundaryIndex) {
|
|
272
309
|
return /*#__PURE__*/React__default.createElement(Tooltip, {
|
|
273
310
|
key: String(child.props.value),
|
|
274
|
-
title: String(child
|
|
275
|
-
},
|
|
311
|
+
title: String(getTooltipTitle(child))
|
|
312
|
+
}, output);
|
|
276
313
|
}
|
|
277
|
-
return
|
|
314
|
+
return output;
|
|
278
315
|
})), boundaryIndex !== undefined && boundaryIndex !== null && boundaryIndex < valuesAsChildren.length - 1 ? (/*#__PURE__*/React__default.createElement(Tooltip, {
|
|
279
|
-
title: valuesAsChildren.slice(boundaryIndex + 1).map(child => child ? String(child
|
|
316
|
+
title: valuesAsChildren.slice(boundaryIndex + 1).map(child => child ? String(getTooltipTitle(child)) : '').join(', ')
|
|
280
317
|
}, /*#__PURE__*/React__default.createElement(Badge, {
|
|
281
318
|
className: "flex-shrink-0"
|
|
282
319
|
}, "+", valuesAsChildren.length - (boundaryIndex + 1)))) : null);
|