@lax-wp/design-system 0.13.42 → 0.13.44
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/data-display/infinite-table/context.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/context.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/context.d.ts +1 -0
- package/dist/components/data-display/infinite-table/context.es.js +1 -0
- package/dist/components/data-display/infinite-table/context.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/Options.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/head/cell/Options.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/Options.d.ts +2 -1
- package/dist/components/data-display/infinite-table/head/cell/Options.es.js +79 -70
- package/dist/components/data-display/infinite-table/head/cell/Options.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/Resizer.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/head/cell/Resizer.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/Resizer.d.ts +2 -1
- package/dist/components/data-display/infinite-table/head/cell/Resizer.es.js +23 -19
- package/dist/components/data-display/infinite-table/head/cell/Resizer.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/index.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/head/cell/index.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/index.es.js +46 -44
- package/dist/components/data-display/infinite-table/head/cell/index.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/index.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/index.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/index.es.js +474 -470
- package/dist/components/data-display/infinite-table/index.es.js.map +1 -1
- package/dist/components/dropdown/Dropdown.cjs.js +1 -1
- package/dist/components/dropdown/Dropdown.cjs.js.map +1 -1
- package/dist/components/dropdown/Dropdown.es.js +11 -11
- package/dist/components/dropdown/Dropdown.es.js.map +1 -1
- package/dist/utils/table.cjs.js +1 -1
- package/dist/utils/table.cjs.js.map +1 -1
- package/dist/utils/table.d.ts +2 -1
- package/dist/utils/table.es.js +19 -18
- package/dist/utils/table.es.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),e=l.createContext({tableWrapper:null,tableBodyWrapper:null,lastNonStickyColumnIndex:()=>null,search:null,columnFilters:[],onRowClick:null,onSort:null,onFilter:null,onRemoveFilter:null,onClearFilter:null,rowOptions:null,checkboxConfig:null,onResetFilter:null,isColumnConfigurable:!1,onAddColumnClick:null,onEditColumnClick:null,onDeleteColumnClick:null,toggleShowFilters:null,toggleShowSorts:null,onRowTooltipClick:null,tooltiptext:null,cascadingTableConfig:null,originalsOnly:!1,disableOptionsForRowIndex:null,getFullRowDataOnClick:!1,getSumOfNextVisibleColumnWidth:()=>null,onRowEdit:null,inlineEditColumns:[],tableActions:null,dndSortableUtils:null,withSortable:!1,withDraggable:!1,onCascadingRowExpand:null,getInnerRowData:null,tableHeaders:null,maxLevel:0,expandedRows:{},setExpandedRows:null,showNewItem:!1,rawData:null,dragConfig:null,rowWrapper:null,asyncRowOptionsFilter:null,rowLinkConfig:{isEnabled:!1,linkTo:null},isCellClickDisabled:!1,activeInlineEdit:null,setActiveInlineEdit:void 0,handleUpdateColumnWidth:()=>{},multiSelectConfig:null,headerContextOptions:null,showHeaderContextOptions:null,setShowHeaderContextOptions:void 0,showDataTypeIcon:!1,rowAdditionalActions:null,rowAdditionalActionsWidth:0,hoverConfig:null,openMasterDataModal:void 0,closeMasterDataModal:void 0,selectedMasterData:null,clearSelectedMasterData:void 0,openCurrencyDropdown:void 0,closeCurrencyDropdown:void 0,currencyDropdownConfig:null,selectedCurrenciesMap:{},setCurrencyForCell:void 0,getCurrencyForCell:void 0});exports.TableContext=e;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),e=l.createContext({tableWrapper:null,tableBodyWrapper:null,lastNonStickyColumnIndex:()=>null,search:null,columnFilters:[],onRowClick:null,onSort:null,onFilter:null,onRemoveFilter:null,onClearFilter:null,rowOptions:null,checkboxConfig:null,onResetFilter:null,isColumnConfigurable:!1,onAddColumnClick:null,onEditColumnClick:null,onDeleteColumnClick:null,toggleShowFilters:null,toggleShowSorts:null,onRowTooltipClick:null,tooltiptext:null,cascadingTableConfig:null,originalsOnly:!1,disableOptionsForRowIndex:null,getFullRowDataOnClick:!1,getSumOfNextVisibleColumnWidth:()=>null,onRowEdit:null,inlineEditColumns:[],tableActions:null,dndSortableUtils:null,withSortable:!1,withDraggable:!1,onCascadingRowExpand:null,getInnerRowData:null,tableHeaders:null,maxLevel:0,expandedRows:{},setExpandedRows:null,showNewItem:!1,rawData:null,dragConfig:null,rowWrapper:null,asyncRowOptionsFilter:null,rowLinkConfig:{isEnabled:!1,linkTo:null},isCellClickDisabled:!1,activeInlineEdit:null,setActiveInlineEdit:void 0,handleUpdateColumnWidth:()=>{},isTableViewReadOnly:!1,multiSelectConfig:null,headerContextOptions:null,showHeaderContextOptions:null,setShowHeaderContextOptions:void 0,showDataTypeIcon:!1,rowAdditionalActions:null,rowAdditionalActionsWidth:0,hoverConfig:null,openMasterDataModal:void 0,closeMasterDataModal:void 0,selectedMasterData:null,clearSelectedMasterData:void 0,openCurrencyDropdown:void 0,closeCurrencyDropdown:void 0,currencyDropdownConfig:null,selectedCurrenciesMap:{},setCurrencyForCell:void 0,getCurrencyForCell:void 0});exports.TableContext=e;
|
|
2
2
|
//# sourceMappingURL=context.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.cjs.js","sources":["../../../../src/components/data-display/infinite-table/context.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { createContext } from 'react';\nimport type { ICurrencyDropdownConfig, IMasterDataModalConfig, IMultiSelectConfig, IPendingEdit, PendingEditsMap } from './types';\n\nexport interface ITableContext {\n tableWrapper?: any;\n tableBodyWrapper?: any;\n lastNonStickyColumnIndex?: () => number | null;\n search?: string | null;\n columnFilters?: any[];\n onRowClick?: any;\n onSort?: any;\n onFilter?: any;\n toggleShowFilters?: any;\n toggleShowSorts?: any;\n onRemoveFilter?: any;\n onClearFilter?: any;\n rowOptions?: any;\n checkboxConfig?: any;\n onResetFilter?: any;\n isColumnConfigurable?: boolean;\n onAddColumnClick?: any;\n onEditColumnClick?: any;\n onDeleteColumnClick?: any;\n onRowTooltipClick?: any;\n tooltiptext?: any;\n cascadingTableConfig?: any;\n originalsOnly?: boolean;\n disableOptionsForRowIndex?: any;\n getFullRowDataOnClick?: boolean;\n selectedRowId?: string | number | null;\n getSumOfNextVisibleColumnWidth?: (currentIndex: number) => number | null;\n onRowEdit?: any;\n inlineEditColumns?: string[];\n tableActions?: any;\n dndSortableUtils?: any;\n withSortable?: boolean;\n withDraggable?: boolean;\n onCascadingRowExpand?: any;\n getInnerRowData?: any;\n tableHeaders?: any[];\n maxLevel?: number;\n expandedRows?: any;\n setExpandedRows?: any;\n showNewItem?: boolean;\n rawData?: any;\n dragConfig?: any;\n rowWrapper?: any;\n asyncRowOptionsFilter?: any;\n rowLinkConfig?: {\n isEnabled: boolean;\n linkTo: any;\n };\n isCellClickDisabled?: boolean;\n activeInlineEdit?: { rowId: string; columnKey: string } | null;\n setActiveInlineEdit?: (value: { rowId: string; columnKey: string } | null) => void;\n handleUpdateColumnWidth?: (columnName: string, width: number) => void;\n multiSelectConfig?: IMultiSelectConfig | null;\n headerContextOptions?: React.ReactNode;\n showHeaderContextOptions?: string | null;\n setShowHeaderContextOptions?: (value: string | null) => void;\n headerDivWidth?: number;\n showDataTypeIcon?: boolean;\n rowAdditionalActions?: any;\n rowAdditionalActionsWidth?: number;\n hoverConfig?: any;\n cellEditing?: string | string[] | null;\n cellEditingValue?: string | Record<string, string> | null;\n openMasterDataModal?: (config: IMasterDataModalConfig) => void;\n closeMasterDataModal?: () => void;\n selectedMasterData?: { value: any; reference: any } | null;\n clearSelectedMasterData?: () => void;\n allowInlineEdit?: boolean;\n openCurrencyDropdown?: (config: ICurrencyDropdownConfig) => void;\n closeCurrencyDropdown?: () => void;\n currencyDropdownConfig?: ICurrencyDropdownConfig | null;\n selectedCurrenciesMap?: Record<string, string>;\n setCurrencyForCell?: (cellKey: string, currency: string) => void;\n getCurrencyForCell?: (cellKey: string) => string | undefined;\n pendingEdits?: PendingEditsMap;\n addPendingEdit?: (rowId: string, columnKey: string, edit: IPendingEdit) => void;\n removePendingEdit?: (rowId: string, columnKey: string) => void;\n getPendingEdit?: (rowId: string, columnKey: string) => IPendingEdit | undefined;\n hasPendingEdit?: (rowId: string, columnKey: string) => boolean;\n clearAllPendingEdits?: () => void;\n saveAllPendingEdits?: () => void;\n clearRowPendingEdits?: (rowId: string) => void;\n saveRowPendingEdits?: (rowId: string) => void;\n pendingEditsCount?: number;\n scrollToCell?: (rowId: string, columnKey: string, rowIndex: number) => void;\n onFieldOperationFlow?: (params: {\n value: unknown;\n fieldId: string;\n rowId: string;\n rowData: any;\n columnKey: string;\n flowName?: string;\n isLiveField?: boolean;\n meta?: { reference?: unknown; currency_code?: string };\n }) => Promise<void>;\n fieldOperationLoading?: string | null;\n validateAllPendingEdits?: any;\n}\n\nexport const TableContext = createContext<ITableContext>({\n tableWrapper: null,\n tableBodyWrapper: null,\n lastNonStickyColumnIndex: () => null,\n search: null,\n columnFilters: [],\n onRowClick: null,\n onSort: null,\n onFilter: null,\n onRemoveFilter: null,\n onClearFilter: null,\n rowOptions: null,\n checkboxConfig: null,\n onResetFilter: null,\n isColumnConfigurable: false,\n onAddColumnClick: null,\n onEditColumnClick: null,\n onDeleteColumnClick: null,\n toggleShowFilters: null,\n toggleShowSorts: null,\n onRowTooltipClick: null,\n tooltiptext: null,\n cascadingTableConfig: null,\n originalsOnly: false,\n disableOptionsForRowIndex: null,\n getFullRowDataOnClick: false,\n getSumOfNextVisibleColumnWidth: () => null,\n onRowEdit: null,\n inlineEditColumns: [],\n tableActions: null,\n dndSortableUtils: null,\n withSortable: false,\n withDraggable: false,\n onCascadingRowExpand: null,\n getInnerRowData: null,\n tableHeaders: null as any,\n maxLevel: 0,\n expandedRows: {},\n setExpandedRows: null,\n showNewItem: false,\n rawData: null,\n dragConfig: null,\n rowWrapper: null,\n asyncRowOptionsFilter: null,\n rowLinkConfig: {\n isEnabled: false,\n linkTo: null,\n },\n isCellClickDisabled: false,\n activeInlineEdit: null,\n setActiveInlineEdit: undefined,\n handleUpdateColumnWidth: () => undefined,\n multiSelectConfig: null,\n headerContextOptions: null,\n showHeaderContextOptions: null,\n setShowHeaderContextOptions: undefined,\n showDataTypeIcon: false,\n rowAdditionalActions: null,\n rowAdditionalActionsWidth: 0,\n hoverConfig: null,\n openMasterDataModal: undefined,\n closeMasterDataModal: undefined,\n selectedMasterData: null,\n clearSelectedMasterData: undefined,\n openCurrencyDropdown: undefined,\n closeCurrencyDropdown: undefined,\n currencyDropdownConfig: null,\n selectedCurrenciesMap: {},\n setCurrencyForCell: undefined,\n getCurrencyForCell: undefined,\n});\n"],"names":["TableContext","createContext"],"mappings":"
|
|
1
|
+
{"version":3,"file":"context.cjs.js","sources":["../../../../src/components/data-display/infinite-table/context.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { createContext } from 'react';\nimport type { ICurrencyDropdownConfig, IMasterDataModalConfig, IMultiSelectConfig, IPendingEdit, PendingEditsMap } from './types';\n\nexport interface ITableContext {\n tableWrapper?: any;\n tableBodyWrapper?: any;\n lastNonStickyColumnIndex?: () => number | null;\n search?: string | null;\n columnFilters?: any[];\n onRowClick?: any;\n onSort?: any;\n onFilter?: any;\n toggleShowFilters?: any;\n toggleShowSorts?: any;\n onRemoveFilter?: any;\n onClearFilter?: any;\n rowOptions?: any;\n checkboxConfig?: any;\n onResetFilter?: any;\n isColumnConfigurable?: boolean;\n onAddColumnClick?: any;\n onEditColumnClick?: any;\n onDeleteColumnClick?: any;\n onRowTooltipClick?: any;\n tooltiptext?: any;\n cascadingTableConfig?: any;\n originalsOnly?: boolean;\n disableOptionsForRowIndex?: any;\n getFullRowDataOnClick?: boolean;\n selectedRowId?: string | number | null;\n getSumOfNextVisibleColumnWidth?: (currentIndex: number) => number | null;\n onRowEdit?: any;\n inlineEditColumns?: string[];\n tableActions?: any;\n dndSortableUtils?: any;\n withSortable?: boolean;\n withDraggable?: boolean;\n onCascadingRowExpand?: any;\n getInnerRowData?: any;\n tableHeaders?: any[];\n maxLevel?: number;\n expandedRows?: any;\n setExpandedRows?: any;\n showNewItem?: boolean;\n rawData?: any;\n dragConfig?: any;\n rowWrapper?: any;\n asyncRowOptionsFilter?: any;\n rowLinkConfig?: {\n isEnabled: boolean;\n linkTo: any;\n };\n isCellClickDisabled?: boolean;\n activeInlineEdit?: { rowId: string; columnKey: string } | null;\n setActiveInlineEdit?: (value: { rowId: string; columnKey: string } | null) => void;\n handleUpdateColumnWidth?: (columnName: string, width: number) => void;\n isTableViewReadOnly?: boolean;\n multiSelectConfig?: IMultiSelectConfig | null;\n headerContextOptions?: React.ReactNode;\n showHeaderContextOptions?: string | null;\n setShowHeaderContextOptions?: (value: string | null) => void;\n headerDivWidth?: number;\n showDataTypeIcon?: boolean;\n rowAdditionalActions?: any;\n rowAdditionalActionsWidth?: number;\n hoverConfig?: any;\n cellEditing?: string | string[] | null;\n cellEditingValue?: string | Record<string, string> | null;\n openMasterDataModal?: (config: IMasterDataModalConfig) => void;\n closeMasterDataModal?: () => void;\n selectedMasterData?: { value: any; reference: any } | null;\n clearSelectedMasterData?: () => void;\n allowInlineEdit?: boolean;\n openCurrencyDropdown?: (config: ICurrencyDropdownConfig) => void;\n closeCurrencyDropdown?: () => void;\n currencyDropdownConfig?: ICurrencyDropdownConfig | null;\n selectedCurrenciesMap?: Record<string, string>;\n setCurrencyForCell?: (cellKey: string, currency: string) => void;\n getCurrencyForCell?: (cellKey: string) => string | undefined;\n pendingEdits?: PendingEditsMap;\n addPendingEdit?: (rowId: string, columnKey: string, edit: IPendingEdit) => void;\n removePendingEdit?: (rowId: string, columnKey: string) => void;\n getPendingEdit?: (rowId: string, columnKey: string) => IPendingEdit | undefined;\n hasPendingEdit?: (rowId: string, columnKey: string) => boolean;\n clearAllPendingEdits?: () => void;\n saveAllPendingEdits?: () => void;\n clearRowPendingEdits?: (rowId: string) => void;\n saveRowPendingEdits?: (rowId: string) => void;\n pendingEditsCount?: number;\n scrollToCell?: (rowId: string, columnKey: string, rowIndex: number) => void;\n onFieldOperationFlow?: (params: {\n value: unknown;\n fieldId: string;\n rowId: string;\n rowData: any;\n columnKey: string;\n flowName?: string;\n isLiveField?: boolean;\n meta?: { reference?: unknown; currency_code?: string };\n }) => Promise<void>;\n fieldOperationLoading?: string | null;\n validateAllPendingEdits?: any;\n}\n\nexport const TableContext = createContext<ITableContext>({\n tableWrapper: null,\n tableBodyWrapper: null,\n lastNonStickyColumnIndex: () => null,\n search: null,\n columnFilters: [],\n onRowClick: null,\n onSort: null,\n onFilter: null,\n onRemoveFilter: null,\n onClearFilter: null,\n rowOptions: null,\n checkboxConfig: null,\n onResetFilter: null,\n isColumnConfigurable: false,\n onAddColumnClick: null,\n onEditColumnClick: null,\n onDeleteColumnClick: null,\n toggleShowFilters: null,\n toggleShowSorts: null,\n onRowTooltipClick: null,\n tooltiptext: null,\n cascadingTableConfig: null,\n originalsOnly: false,\n disableOptionsForRowIndex: null,\n getFullRowDataOnClick: false,\n getSumOfNextVisibleColumnWidth: () => null,\n onRowEdit: null,\n inlineEditColumns: [],\n tableActions: null,\n dndSortableUtils: null,\n withSortable: false,\n withDraggable: false,\n onCascadingRowExpand: null,\n getInnerRowData: null,\n tableHeaders: null as any,\n maxLevel: 0,\n expandedRows: {},\n setExpandedRows: null,\n showNewItem: false,\n rawData: null,\n dragConfig: null,\n rowWrapper: null,\n asyncRowOptionsFilter: null,\n rowLinkConfig: {\n isEnabled: false,\n linkTo: null,\n },\n isCellClickDisabled: false,\n activeInlineEdit: null,\n setActiveInlineEdit: undefined,\n handleUpdateColumnWidth: () => undefined,\n isTableViewReadOnly: false,\n multiSelectConfig: null,\n headerContextOptions: null,\n showHeaderContextOptions: null,\n setShowHeaderContextOptions: undefined,\n showDataTypeIcon: false,\n rowAdditionalActions: null,\n rowAdditionalActionsWidth: 0,\n hoverConfig: null,\n openMasterDataModal: undefined,\n closeMasterDataModal: undefined,\n selectedMasterData: null,\n clearSelectedMasterData: undefined,\n openCurrencyDropdown: undefined,\n closeCurrencyDropdown: undefined,\n currencyDropdownConfig: null,\n selectedCurrenciesMap: {},\n setCurrencyForCell: undefined,\n getCurrencyForCell: undefined,\n});\n"],"names":["TableContext","createContext"],"mappings":"yGAyGaA,EAAeC,EAAAA,cAA6B,CACvD,aAAc,KACd,iBAAkB,KAClB,yBAA0B,IAAM,KAChC,OAAQ,KACR,cAAe,CAAA,EACf,WAAY,KACZ,OAAQ,KACR,SAAU,KACV,eAAgB,KAChB,cAAe,KACf,WAAY,KACZ,eAAgB,KAChB,cAAe,KACf,qBAAsB,GACtB,iBAAkB,KAClB,kBAAmB,KACnB,oBAAqB,KACrB,kBAAmB,KACnB,gBAAiB,KACjB,kBAAmB,KACnB,YAAa,KACb,qBAAsB,KACtB,cAAe,GACf,0BAA2B,KAC3B,sBAAuB,GACvB,+BAAgC,IAAM,KACtC,UAAW,KACX,kBAAmB,CAAA,EACnB,aAAc,KACd,iBAAkB,KAClB,aAAc,GACd,cAAe,GACf,qBAAsB,KACtB,gBAAiB,KACjB,aAAc,KACd,SAAU,EACV,aAAc,CAAA,EACd,gBAAiB,KACjB,YAAa,GACb,QAAS,KACT,WAAY,KACZ,WAAY,KACZ,sBAAuB,KACvB,cAAe,CACb,UAAW,GACX,OAAQ,IAAA,EAEV,oBAAqB,GACrB,iBAAkB,KAClB,oBAAqB,OACrB,wBAAyB,IAAA,GACzB,oBAAqB,GACrB,kBAAmB,KACnB,qBAAsB,KACtB,yBAA0B,KAC1B,4BAA6B,OAC7B,iBAAkB,GAClB,qBAAsB,KACtB,0BAA2B,EAC3B,YAAa,KACb,oBAAqB,OACrB,qBAAsB,OACtB,mBAAoB,KACpB,wBAAyB,OACzB,qBAAsB,OACtB,sBAAuB,OACvB,uBAAwB,KACxB,sBAAuB,CAAA,EACvB,mBAAoB,OACpB,mBAAoB,MACtB,CAAC"}
|
|
@@ -58,6 +58,7 @@ export interface ITableContext {
|
|
|
58
58
|
columnKey: string;
|
|
59
59
|
} | null) => void;
|
|
60
60
|
handleUpdateColumnWidth?: (columnName: string, width: number) => void;
|
|
61
|
+
isTableViewReadOnly?: boolean;
|
|
61
62
|
multiSelectConfig?: IMultiSelectConfig | null;
|
|
62
63
|
headerContextOptions?: React.ReactNode;
|
|
63
64
|
showHeaderContextOptions?: string | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.es.js","sources":["../../../../src/components/data-display/infinite-table/context.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { createContext } from 'react';\nimport type { ICurrencyDropdownConfig, IMasterDataModalConfig, IMultiSelectConfig, IPendingEdit, PendingEditsMap } from './types';\n\nexport interface ITableContext {\n tableWrapper?: any;\n tableBodyWrapper?: any;\n lastNonStickyColumnIndex?: () => number | null;\n search?: string | null;\n columnFilters?: any[];\n onRowClick?: any;\n onSort?: any;\n onFilter?: any;\n toggleShowFilters?: any;\n toggleShowSorts?: any;\n onRemoveFilter?: any;\n onClearFilter?: any;\n rowOptions?: any;\n checkboxConfig?: any;\n onResetFilter?: any;\n isColumnConfigurable?: boolean;\n onAddColumnClick?: any;\n onEditColumnClick?: any;\n onDeleteColumnClick?: any;\n onRowTooltipClick?: any;\n tooltiptext?: any;\n cascadingTableConfig?: any;\n originalsOnly?: boolean;\n disableOptionsForRowIndex?: any;\n getFullRowDataOnClick?: boolean;\n selectedRowId?: string | number | null;\n getSumOfNextVisibleColumnWidth?: (currentIndex: number) => number | null;\n onRowEdit?: any;\n inlineEditColumns?: string[];\n tableActions?: any;\n dndSortableUtils?: any;\n withSortable?: boolean;\n withDraggable?: boolean;\n onCascadingRowExpand?: any;\n getInnerRowData?: any;\n tableHeaders?: any[];\n maxLevel?: number;\n expandedRows?: any;\n setExpandedRows?: any;\n showNewItem?: boolean;\n rawData?: any;\n dragConfig?: any;\n rowWrapper?: any;\n asyncRowOptionsFilter?: any;\n rowLinkConfig?: {\n isEnabled: boolean;\n linkTo: any;\n };\n isCellClickDisabled?: boolean;\n activeInlineEdit?: { rowId: string; columnKey: string } | null;\n setActiveInlineEdit?: (value: { rowId: string; columnKey: string } | null) => void;\n handleUpdateColumnWidth?: (columnName: string, width: number) => void;\n multiSelectConfig?: IMultiSelectConfig | null;\n headerContextOptions?: React.ReactNode;\n showHeaderContextOptions?: string | null;\n setShowHeaderContextOptions?: (value: string | null) => void;\n headerDivWidth?: number;\n showDataTypeIcon?: boolean;\n rowAdditionalActions?: any;\n rowAdditionalActionsWidth?: number;\n hoverConfig?: any;\n cellEditing?: string | string[] | null;\n cellEditingValue?: string | Record<string, string> | null;\n openMasterDataModal?: (config: IMasterDataModalConfig) => void;\n closeMasterDataModal?: () => void;\n selectedMasterData?: { value: any; reference: any } | null;\n clearSelectedMasterData?: () => void;\n allowInlineEdit?: boolean;\n openCurrencyDropdown?: (config: ICurrencyDropdownConfig) => void;\n closeCurrencyDropdown?: () => void;\n currencyDropdownConfig?: ICurrencyDropdownConfig | null;\n selectedCurrenciesMap?: Record<string, string>;\n setCurrencyForCell?: (cellKey: string, currency: string) => void;\n getCurrencyForCell?: (cellKey: string) => string | undefined;\n pendingEdits?: PendingEditsMap;\n addPendingEdit?: (rowId: string, columnKey: string, edit: IPendingEdit) => void;\n removePendingEdit?: (rowId: string, columnKey: string) => void;\n getPendingEdit?: (rowId: string, columnKey: string) => IPendingEdit | undefined;\n hasPendingEdit?: (rowId: string, columnKey: string) => boolean;\n clearAllPendingEdits?: () => void;\n saveAllPendingEdits?: () => void;\n clearRowPendingEdits?: (rowId: string) => void;\n saveRowPendingEdits?: (rowId: string) => void;\n pendingEditsCount?: number;\n scrollToCell?: (rowId: string, columnKey: string, rowIndex: number) => void;\n onFieldOperationFlow?: (params: {\n value: unknown;\n fieldId: string;\n rowId: string;\n rowData: any;\n columnKey: string;\n flowName?: string;\n isLiveField?: boolean;\n meta?: { reference?: unknown; currency_code?: string };\n }) => Promise<void>;\n fieldOperationLoading?: string | null;\n validateAllPendingEdits?: any;\n}\n\nexport const TableContext = createContext<ITableContext>({\n tableWrapper: null,\n tableBodyWrapper: null,\n lastNonStickyColumnIndex: () => null,\n search: null,\n columnFilters: [],\n onRowClick: null,\n onSort: null,\n onFilter: null,\n onRemoveFilter: null,\n onClearFilter: null,\n rowOptions: null,\n checkboxConfig: null,\n onResetFilter: null,\n isColumnConfigurable: false,\n onAddColumnClick: null,\n onEditColumnClick: null,\n onDeleteColumnClick: null,\n toggleShowFilters: null,\n toggleShowSorts: null,\n onRowTooltipClick: null,\n tooltiptext: null,\n cascadingTableConfig: null,\n originalsOnly: false,\n disableOptionsForRowIndex: null,\n getFullRowDataOnClick: false,\n getSumOfNextVisibleColumnWidth: () => null,\n onRowEdit: null,\n inlineEditColumns: [],\n tableActions: null,\n dndSortableUtils: null,\n withSortable: false,\n withDraggable: false,\n onCascadingRowExpand: null,\n getInnerRowData: null,\n tableHeaders: null as any,\n maxLevel: 0,\n expandedRows: {},\n setExpandedRows: null,\n showNewItem: false,\n rawData: null,\n dragConfig: null,\n rowWrapper: null,\n asyncRowOptionsFilter: null,\n rowLinkConfig: {\n isEnabled: false,\n linkTo: null,\n },\n isCellClickDisabled: false,\n activeInlineEdit: null,\n setActiveInlineEdit: undefined,\n handleUpdateColumnWidth: () => undefined,\n multiSelectConfig: null,\n headerContextOptions: null,\n showHeaderContextOptions: null,\n setShowHeaderContextOptions: undefined,\n showDataTypeIcon: false,\n rowAdditionalActions: null,\n rowAdditionalActionsWidth: 0,\n hoverConfig: null,\n openMasterDataModal: undefined,\n closeMasterDataModal: undefined,\n selectedMasterData: null,\n clearSelectedMasterData: undefined,\n openCurrencyDropdown: undefined,\n closeCurrencyDropdown: undefined,\n currencyDropdownConfig: null,\n selectedCurrenciesMap: {},\n setCurrencyForCell: undefined,\n getCurrencyForCell: undefined,\n});\n"],"names":["TableContext","createContext"],"mappings":";
|
|
1
|
+
{"version":3,"file":"context.es.js","sources":["../../../../src/components/data-display/infinite-table/context.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { createContext } from 'react';\nimport type { ICurrencyDropdownConfig, IMasterDataModalConfig, IMultiSelectConfig, IPendingEdit, PendingEditsMap } from './types';\n\nexport interface ITableContext {\n tableWrapper?: any;\n tableBodyWrapper?: any;\n lastNonStickyColumnIndex?: () => number | null;\n search?: string | null;\n columnFilters?: any[];\n onRowClick?: any;\n onSort?: any;\n onFilter?: any;\n toggleShowFilters?: any;\n toggleShowSorts?: any;\n onRemoveFilter?: any;\n onClearFilter?: any;\n rowOptions?: any;\n checkboxConfig?: any;\n onResetFilter?: any;\n isColumnConfigurable?: boolean;\n onAddColumnClick?: any;\n onEditColumnClick?: any;\n onDeleteColumnClick?: any;\n onRowTooltipClick?: any;\n tooltiptext?: any;\n cascadingTableConfig?: any;\n originalsOnly?: boolean;\n disableOptionsForRowIndex?: any;\n getFullRowDataOnClick?: boolean;\n selectedRowId?: string | number | null;\n getSumOfNextVisibleColumnWidth?: (currentIndex: number) => number | null;\n onRowEdit?: any;\n inlineEditColumns?: string[];\n tableActions?: any;\n dndSortableUtils?: any;\n withSortable?: boolean;\n withDraggable?: boolean;\n onCascadingRowExpand?: any;\n getInnerRowData?: any;\n tableHeaders?: any[];\n maxLevel?: number;\n expandedRows?: any;\n setExpandedRows?: any;\n showNewItem?: boolean;\n rawData?: any;\n dragConfig?: any;\n rowWrapper?: any;\n asyncRowOptionsFilter?: any;\n rowLinkConfig?: {\n isEnabled: boolean;\n linkTo: any;\n };\n isCellClickDisabled?: boolean;\n activeInlineEdit?: { rowId: string; columnKey: string } | null;\n setActiveInlineEdit?: (value: { rowId: string; columnKey: string } | null) => void;\n handleUpdateColumnWidth?: (columnName: string, width: number) => void;\n isTableViewReadOnly?: boolean;\n multiSelectConfig?: IMultiSelectConfig | null;\n headerContextOptions?: React.ReactNode;\n showHeaderContextOptions?: string | null;\n setShowHeaderContextOptions?: (value: string | null) => void;\n headerDivWidth?: number;\n showDataTypeIcon?: boolean;\n rowAdditionalActions?: any;\n rowAdditionalActionsWidth?: number;\n hoverConfig?: any;\n cellEditing?: string | string[] | null;\n cellEditingValue?: string | Record<string, string> | null;\n openMasterDataModal?: (config: IMasterDataModalConfig) => void;\n closeMasterDataModal?: () => void;\n selectedMasterData?: { value: any; reference: any } | null;\n clearSelectedMasterData?: () => void;\n allowInlineEdit?: boolean;\n openCurrencyDropdown?: (config: ICurrencyDropdownConfig) => void;\n closeCurrencyDropdown?: () => void;\n currencyDropdownConfig?: ICurrencyDropdownConfig | null;\n selectedCurrenciesMap?: Record<string, string>;\n setCurrencyForCell?: (cellKey: string, currency: string) => void;\n getCurrencyForCell?: (cellKey: string) => string | undefined;\n pendingEdits?: PendingEditsMap;\n addPendingEdit?: (rowId: string, columnKey: string, edit: IPendingEdit) => void;\n removePendingEdit?: (rowId: string, columnKey: string) => void;\n getPendingEdit?: (rowId: string, columnKey: string) => IPendingEdit | undefined;\n hasPendingEdit?: (rowId: string, columnKey: string) => boolean;\n clearAllPendingEdits?: () => void;\n saveAllPendingEdits?: () => void;\n clearRowPendingEdits?: (rowId: string) => void;\n saveRowPendingEdits?: (rowId: string) => void;\n pendingEditsCount?: number;\n scrollToCell?: (rowId: string, columnKey: string, rowIndex: number) => void;\n onFieldOperationFlow?: (params: {\n value: unknown;\n fieldId: string;\n rowId: string;\n rowData: any;\n columnKey: string;\n flowName?: string;\n isLiveField?: boolean;\n meta?: { reference?: unknown; currency_code?: string };\n }) => Promise<void>;\n fieldOperationLoading?: string | null;\n validateAllPendingEdits?: any;\n}\n\nexport const TableContext = createContext<ITableContext>({\n tableWrapper: null,\n tableBodyWrapper: null,\n lastNonStickyColumnIndex: () => null,\n search: null,\n columnFilters: [],\n onRowClick: null,\n onSort: null,\n onFilter: null,\n onRemoveFilter: null,\n onClearFilter: null,\n rowOptions: null,\n checkboxConfig: null,\n onResetFilter: null,\n isColumnConfigurable: false,\n onAddColumnClick: null,\n onEditColumnClick: null,\n onDeleteColumnClick: null,\n toggleShowFilters: null,\n toggleShowSorts: null,\n onRowTooltipClick: null,\n tooltiptext: null,\n cascadingTableConfig: null,\n originalsOnly: false,\n disableOptionsForRowIndex: null,\n getFullRowDataOnClick: false,\n getSumOfNextVisibleColumnWidth: () => null,\n onRowEdit: null,\n inlineEditColumns: [],\n tableActions: null,\n dndSortableUtils: null,\n withSortable: false,\n withDraggable: false,\n onCascadingRowExpand: null,\n getInnerRowData: null,\n tableHeaders: null as any,\n maxLevel: 0,\n expandedRows: {},\n setExpandedRows: null,\n showNewItem: false,\n rawData: null,\n dragConfig: null,\n rowWrapper: null,\n asyncRowOptionsFilter: null,\n rowLinkConfig: {\n isEnabled: false,\n linkTo: null,\n },\n isCellClickDisabled: false,\n activeInlineEdit: null,\n setActiveInlineEdit: undefined,\n handleUpdateColumnWidth: () => undefined,\n isTableViewReadOnly: false,\n multiSelectConfig: null,\n headerContextOptions: null,\n showHeaderContextOptions: null,\n setShowHeaderContextOptions: undefined,\n showDataTypeIcon: false,\n rowAdditionalActions: null,\n rowAdditionalActionsWidth: 0,\n hoverConfig: null,\n openMasterDataModal: undefined,\n closeMasterDataModal: undefined,\n selectedMasterData: null,\n clearSelectedMasterData: undefined,\n openCurrencyDropdown: undefined,\n closeCurrencyDropdown: undefined,\n currencyDropdownConfig: null,\n selectedCurrenciesMap: {},\n setCurrencyForCell: undefined,\n getCurrencyForCell: undefined,\n});\n"],"names":["TableContext","createContext"],"mappings":";AAyGO,MAAMA,IAAeC,EAA6B;AAAA,EACvD,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,0BAA0B,MAAM;AAAA,EAChC,QAAQ;AAAA,EACR,eAAe,CAAA;AAAA,EACf,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,mBAAmB;AAAA,EACnB,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAAA,EACf,2BAA2B;AAAA,EAC3B,uBAAuB;AAAA,EACvB,gCAAgC,MAAM;AAAA,EACtC,WAAW;AAAA,EACX,mBAAmB,CAAA;AAAA,EACnB,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,UAAU;AAAA,EACV,cAAc,CAAA;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,uBAAuB;AAAA,EACvB,eAAe;AAAA,IACb,WAAW;AAAA,IACX,QAAQ;AAAA,EAAA;AAAA,EAEV,qBAAqB;AAAA,EACrB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,yBAAyB,MAAA;AAAA;AAAA,EACzB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,0BAA0B;AAAA,EAC1B,6BAA6B;AAAA,EAC7B,kBAAkB;AAAA,EAClB,sBAAsB;AAAA,EACtB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,qBAAqB;AAAA,EACrB,sBAAsB;AAAA,EACtB,oBAAoB;AAAA,EACpB,yBAAyB;AAAA,EACzB,sBAAsB;AAAA,EACtB,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,uBAAuB,CAAA;AAAA,EACvB,oBAAoB;AAAA,EACpB,oBAAoB;AACtB,CAAC;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),B=require("../../../../../hooks/useOutsideClick.cjs.js"),L=require("../../../../../providers/design-system-provider/hooks.cjs.js"),a=require("@mui/icons-material"),O=require("../../../../../_virtual/index.cjs.js"),T=require("framer-motion"),z=require("react"),i=({id:r,label:u,onClick:e,icon:l,isDisabled:o=!1})=>t.jsxs("button",{id:r,type:"button",disabled:o,className:O("flex w-full px-4 py-2 text-neutral-900 dark:text-white font-inter text-sm font-medium rounded-[4px] items-center gap-3",o?"opacity-60 cursor-not-allowed":"hover:bg-neutral-100 dark:hover:bg-neutral-900"),onClick:e,children:[l,u]}),D=({headerIndex:r,headerGroup:u,column:e,onSort:l,onFilter:o,toggleHeaderOption:d,setIsShowSortArrowAsc:b,setIsShowSortArrowDesc:p,setShowHeaderOptions:y,toggleDataFilterModal:m,isColumnConfigurable:c,onAddColumnClick:j,onEditColumnClick:R,onDeleteColumnClick:N,disabled:x=!1})=>{const k=L.useTableConfig(),s=()=>y(null),f=z.useRef(null);B.useOutsideClick({ref:f,handler:s});const n=k?.t??(h=>h),q=e?.dataType==="date",C=e?.dataType==="boolean",v=n(q?"Least Recent":"Sort By A-Z"),w=n(q?"Most Recent":"Sort By Z-A");return z.useEffect(()=>{f.current?.querySelector("button:not([disabled])")?.focus()},[]),k?.renderColumnOptions?k.renderColumnOptions({headerIndex:r,headerGroup:u,column:e,onSort:l,onFilter:o,toggleHeaderOption:d,setIsShowSortArrowAsc:b,setIsShowSortArrowDesc:p,setShowHeaderOptions:y,toggleDataFilterModal:m,isColumnConfigurable:c,onAddColumnClick:j,onEditColumnClick:R,onDeleteColumnClick:N,onClose:s,disabled:x}):t.jsxs("div",{ref:f,children:[t.jsx("div",{className:"absolute inset-0",onClick:s}),t.jsxs(T.motion.div,{className:O("absolute top-full bg-white dark:bg-black-700 rounded-lg shadow-lg cursor-pointer w-[220px] py-1 px-1 z-50 border border-neutral-200 dark:border-black-600",r+1===(u.headers?.length??0)?"-right-6":"left-0"),initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{ease:"linear",duration:.2},role:"menu",children:[l&&!C?t.jsx(i,{id:"btn-column-options-arrow-down",label:v,icon:t.jsx(a.ArrowDownwardRounded,{fontSize:"small",className:"text-neutral-900 dark:text-neutral-100"}),isDisabled:x,onClick:()=>{l(e.key,"asc"),d(e.key),b(e.key),p(null)}}):null,l&&!C?t.jsx(i,{id:"btn-column-options-arrow-up",label:w,icon:t.jsx(a.ArrowUpwardRounded,{fontSize:"small",className:"text-neutral-900 dark:text-neutral-100"}),isDisabled:x,onClick:()=>{l(e.key,"desc"),d(e.key),b(null),p(e.key)}}):null,o?t.jsx(i,{id:"btn-column-options-filter-by",label:n("Filter By"),icon:t.jsx(a.FilterListRounded,{fontSize:"small",className:"text-neutral-900 dark:text-neutral-100"}),isDisabled:x,onClick:()=>{m(e),d(e.key)}}):null,c?t.jsx(i,{id:"btn-column-options-add-column",label:n("Add Column"),icon:t.jsx(a.AddRounded,{fontSize:"small",className:"text-neutral-900 dark:text-neutral-100"}),onClick:()=>{j?.(e),s()}}):null,c?t.jsx(i,{id:"btn-column-options-edit-column",label:n("Edit Column"),icon:t.jsx(a.EditRounded,{fontSize:"small",className:"text-neutral-900 dark:text-neutral-100"}),onClick:()=>{R?.(e),s()}}):null,c?t.jsx(i,{id:"btn-column-options-delete-column",label:n("Delete Column"),icon:t.jsx(a.DeleteOutlineRounded,{fontSize:"small",className:"text-neutral-900 dark:text-neutral-100"}),onClick:()=>{N?.(e),s()}}):null]})]})};exports.Options=D;
|
|
2
2
|
//# sourceMappingURL=Options.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Options.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Options.tsx"],"sourcesContent":["import { useOutsideClick } from '../../../../../hooks/useOutsideClick';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { AddRounded, ArrowDownwardRounded, ArrowUpwardRounded, DeleteOutlineRounded, EditRounded, FilterListRounded } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { useEffect, useRef } from 'react';\n\ninterface HeaderColumn {\n id: string;\n key: string;\n dataType?: string;\n [k: string]: unknown;\n}\n\ninterface OptionsProps {\n headerIndex: number;\n headerGroup: { headers?: unknown[]; [k: string]: unknown };\n column: HeaderColumn;\n onSort?: (field: string, order?: string) => void;\n onFilter?: (column: string, value: unknown) => void;\n toggleHeaderOption: (key: string) => void;\n setIsShowSortArrowAsc: (value: string | null) => void;\n setIsShowSortArrowDesc: (value: string | null) => void;\n setShowHeaderOptions: (value: string | null) => void;\n toggleDataFilterModal: (column: unknown) => void;\n isColumnConfigurable: boolean;\n onAddColumnClick?: (column: HeaderColumn) => void;\n onEditColumnClick?: (column: HeaderColumn) => void;\n onDeleteColumnClick?: (column: HeaderColumn) => void;\n}\n\ntype OptionButtonProps = {\n id: string;\n label: string;\n onClick: () => void;\n icon: JSX.Element;\n};\n\nconst OptionButton = ({ id, label, onClick, icon }: OptionButtonProps) => {\n return (\n <button\n id={id}\n type='button'\n className='flex w-full px-4 py-2 text-neutral-900 dark:text-white font-inter text-sm font-medium rounded-[4px] hover:bg-neutral-100 dark:hover:bg-neutral-900 items-center gap-3'\n onClick={onClick}\n >\n {icon}\n {label}\n </button>\n );\n};\n\nexport const Options = ({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n}: OptionsProps) => {\n const tableConfig = useTableConfig();\n const handleCloseFilters = () => setShowHeaderOptions(null);\n const ref = useRef<HTMLDivElement>(null);\n useOutsideClick({\n ref,\n handler: handleCloseFilters,\n });\n const t = tableConfig?.t ?? ((key: string) => key);\n const isDateColumn = column?.dataType === 'date';\n const isBooleanColumn = column?.dataType === 'boolean';\n const sortAscLabel = isDateColumn ? t('Least Recent') : t('Sort By A-Z');\n const sortDescLabel = isDateColumn ? t('Most Recent') : t('Sort By Z-A');\n\n useEffect(() => {\n const firstOption = ref.current?.querySelector<HTMLButtonElement>('button:not([disabled])');\n firstOption?.focus();\n }, []);\n\n if (tableConfig?.renderColumnOptions) {\n return tableConfig.renderColumnOptions({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n onClose: handleCloseFilters,\n }) as JSX.Element;\n }\n\n return (\n <div ref={ref}>\n <div className='absolute inset-0' onClick={handleCloseFilters} />\n <motion.div\n className={cn(\n 'absolute top-full bg-white dark:bg-black-700 rounded-lg shadow-lg cursor-pointer w-[220px] py-1 px-1 z-50 border border-neutral-200 dark:border-black-600',\n headerIndex + 1 === (headerGroup.headers?.length ?? 0) ? '-right-6' : 'left-0',\n )}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ ease: 'linear', duration: 0.2 }}\n role='menu'\n >\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-down'\n label={sortAscLabel}\n icon={<ArrowDownwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onSort(column.key, 'asc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(column.key);\n setIsShowSortArrowDesc(null);\n }}\n />\n ) : null}\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-up'\n label={sortDescLabel}\n icon={<ArrowUpwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onSort(column.key, 'desc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(null);\n setIsShowSortArrowDesc(column.key);\n }}\n />\n ) : null}\n {onFilter ? (\n <OptionButton\n id='btn-column-options-filter-by'\n label={t('Filter By')}\n icon={<FilterListRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n toggleDataFilterModal(column);\n toggleHeaderOption(column.key);\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-add-column'\n label={t('Add Column')}\n icon={<AddRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onAddColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-edit-column'\n label={t('Edit Column')}\n icon={<EditRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onEditColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-delete-column'\n label={t('Delete Column')}\n icon={<DeleteOutlineRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onDeleteColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n </motion.div>\n </div>\n );\n};\n"],"names":["OptionButton","id","label","onClick","icon","jsxs","Options","headerIndex","headerGroup","column","onSort","onFilter","toggleHeaderOption","setIsShowSortArrowAsc","setIsShowSortArrowDesc","setShowHeaderOptions","toggleDataFilterModal","isColumnConfigurable","onAddColumnClick","onEditColumnClick","onDeleteColumnClick","tableConfig","useTableConfig","handleCloseFilters","ref","useRef","useOutsideClick","t","key","isDateColumn","isBooleanColumn","sortAscLabel","sortDescLabel","useEffect","jsx","motion","cn","ArrowDownwardRounded","ArrowUpwardRounded","FilterListRounded","AddRounded","EditRounded","DeleteOutlineRounded"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Options.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Options.tsx"],"sourcesContent":["import { useOutsideClick } from '../../../../../hooks/useOutsideClick';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { AddRounded, ArrowDownwardRounded, ArrowUpwardRounded, DeleteOutlineRounded, EditRounded, FilterListRounded } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { useEffect, useRef } from 'react';\n\ninterface HeaderColumn {\n id: string;\n key: string;\n dataType?: string;\n [k: string]: unknown;\n}\n\ninterface OptionsProps {\n headerIndex: number;\n headerGroup: { headers?: unknown[]; [k: string]: unknown };\n column: HeaderColumn;\n onSort?: (field: string, order?: string) => void;\n onFilter?: (column: string, value: unknown) => void;\n toggleHeaderOption: (key: string) => void;\n setIsShowSortArrowAsc: (value: string | null) => void;\n setIsShowSortArrowDesc: (value: string | null) => void;\n setShowHeaderOptions: (value: string | null) => void;\n toggleDataFilterModal: (column: unknown) => void;\n isColumnConfigurable: boolean;\n onAddColumnClick?: (column: HeaderColumn) => void;\n onEditColumnClick?: (column: HeaderColumn) => void;\n onDeleteColumnClick?: (column: HeaderColumn) => void;\n disabled?: boolean;\n}\n\ntype OptionButtonProps = {\n id: string;\n label: string;\n onClick: () => void;\n icon: JSX.Element;\n isDisabled?: boolean;\n};\n\nconst OptionButton = ({ id, label, onClick, icon, isDisabled = false }: OptionButtonProps) => {\n return (\n <button\n id={id}\n type='button'\n disabled={isDisabled}\n className={cn(\n 'flex w-full px-4 py-2 text-neutral-900 dark:text-white font-inter text-sm font-medium rounded-[4px] items-center gap-3',\n isDisabled ? 'opacity-60 cursor-not-allowed' : 'hover:bg-neutral-100 dark:hover:bg-neutral-900',\n )}\n onClick={onClick}\n >\n {icon}\n {label}\n </button>\n );\n};\n\nexport const Options = ({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n disabled = false,\n}: OptionsProps) => {\n const tableConfig = useTableConfig();\n const handleCloseFilters = () => setShowHeaderOptions(null);\n const ref = useRef<HTMLDivElement>(null);\n useOutsideClick({\n ref,\n handler: handleCloseFilters,\n });\n const t = tableConfig?.t ?? ((key: string) => key);\n const isDateColumn = column?.dataType === 'date';\n const isBooleanColumn = column?.dataType === 'boolean';\n const sortAscLabel = isDateColumn ? t('Least Recent') : t('Sort By A-Z');\n const sortDescLabel = isDateColumn ? t('Most Recent') : t('Sort By Z-A');\n\n useEffect(() => {\n const firstOption = ref.current?.querySelector<HTMLButtonElement>('button:not([disabled])');\n firstOption?.focus();\n }, []);\n\n if (tableConfig?.renderColumnOptions) {\n return tableConfig.renderColumnOptions({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n onClose: handleCloseFilters,\n disabled,\n }) as JSX.Element;\n }\n\n return (\n <div ref={ref}>\n <div className='absolute inset-0' onClick={handleCloseFilters} />\n <motion.div\n className={cn(\n 'absolute top-full bg-white dark:bg-black-700 rounded-lg shadow-lg cursor-pointer w-[220px] py-1 px-1 z-50 border border-neutral-200 dark:border-black-600',\n headerIndex + 1 === (headerGroup.headers?.length ?? 0) ? '-right-6' : 'left-0',\n )}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ ease: 'linear', duration: 0.2 }}\n role='menu'\n >\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-down'\n label={sortAscLabel}\n icon={<ArrowDownwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n isDisabled={disabled}\n onClick={() => {\n onSort(column.key, 'asc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(column.key);\n setIsShowSortArrowDesc(null);\n }}\n />\n ) : null}\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-up'\n label={sortDescLabel}\n icon={<ArrowUpwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n isDisabled={disabled}\n onClick={() => {\n onSort(column.key, 'desc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(null);\n setIsShowSortArrowDesc(column.key);\n }}\n />\n ) : null}\n {onFilter ? (\n <OptionButton\n id='btn-column-options-filter-by'\n label={t('Filter By')}\n icon={<FilterListRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n isDisabled={disabled}\n onClick={() => {\n toggleDataFilterModal(column);\n toggleHeaderOption(column.key);\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-add-column'\n label={t('Add Column')}\n icon={<AddRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onAddColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-edit-column'\n label={t('Edit Column')}\n icon={<EditRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onEditColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-delete-column'\n label={t('Delete Column')}\n icon={<DeleteOutlineRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onDeleteColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n </motion.div>\n </div>\n );\n};\n"],"names":["OptionButton","id","label","onClick","icon","isDisabled","jsxs","cn","Options","headerIndex","headerGroup","column","onSort","onFilter","toggleHeaderOption","setIsShowSortArrowAsc","setIsShowSortArrowDesc","setShowHeaderOptions","toggleDataFilterModal","isColumnConfigurable","onAddColumnClick","onEditColumnClick","onDeleteColumnClick","disabled","tableConfig","useTableConfig","handleCloseFilters","ref","useRef","useOutsideClick","t","key","isDateColumn","isBooleanColumn","sortAscLabel","sortDescLabel","useEffect","jsx","motion","ArrowDownwardRounded","ArrowUpwardRounded","FilterListRounded","AddRounded","EditRounded","DeleteOutlineRounded"],"mappings":"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"}
|
|
@@ -22,6 +22,7 @@ interface OptionsProps {
|
|
|
22
22
|
onAddColumnClick?: (column: HeaderColumn) => void;
|
|
23
23
|
onEditColumnClick?: (column: HeaderColumn) => void;
|
|
24
24
|
onDeleteColumnClick?: (column: HeaderColumn) => void;
|
|
25
|
+
disabled?: boolean;
|
|
25
26
|
}
|
|
26
|
-
export declare const Options: ({ headerIndex, headerGroup, column, onSort, onFilter, toggleHeaderOption, setIsShowSortArrowAsc, setIsShowSortArrowDesc, setShowHeaderOptions, toggleDataFilterModal, isColumnConfigurable, onAddColumnClick, onEditColumnClick, onDeleteColumnClick, }: OptionsProps) => import("react/jsx-runtime").JSX.Element;
|
|
27
|
+
export declare const Options: ({ headerIndex, headerGroup, column, onSort, onFilter, toggleHeaderOption, setIsShowSortArrowAsc, setIsShowSortArrowDesc, setShowHeaderOptions, toggleDataFilterModal, isColumnConfigurable, onAddColumnClick, onEditColumnClick, onDeleteColumnClick, disabled, }: OptionsProps) => import("react/jsx-runtime").JSX.Element;
|
|
27
28
|
export {};
|
|
@@ -1,70 +1,76 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { useOutsideClick as
|
|
3
|
-
import { useTableConfig as
|
|
4
|
-
import { ArrowDownwardRounded as
|
|
5
|
-
import
|
|
6
|
-
import { motion as
|
|
7
|
-
import { useRef as
|
|
8
|
-
const o = ({ id:
|
|
1
|
+
import { jsxs as k, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { useOutsideClick as O } from "../../../../../hooks/useOutsideClick.es.js";
|
|
3
|
+
import { useTableConfig as D } from "../../../../../providers/design-system-provider/hooks.es.js";
|
|
4
|
+
import { ArrowDownwardRounded as T, ArrowUpwardRounded as j, FilterListRounded as E, AddRounded as Z, EditRounded as q, DeleteOutlineRounded as F } from "@mui/icons-material";
|
|
5
|
+
import w from "../../../../../_virtual/index.es.js";
|
|
6
|
+
import { motion as U } from "framer-motion";
|
|
7
|
+
import { useRef as g, useEffect as A } from "react";
|
|
8
|
+
const o = ({ id: r, label: s, onClick: t, icon: l, isDisabled: i = !1 }) => /* @__PURE__ */ k(
|
|
9
9
|
"button",
|
|
10
10
|
{
|
|
11
|
-
id:
|
|
11
|
+
id: r,
|
|
12
12
|
type: "button",
|
|
13
|
-
|
|
13
|
+
disabled: i,
|
|
14
|
+
className: w(
|
|
15
|
+
"flex w-full px-4 py-2 text-neutral-900 dark:text-white font-inter text-sm font-medium rounded-[4px] items-center gap-3",
|
|
16
|
+
i ? "opacity-60 cursor-not-allowed" : "hover:bg-neutral-100 dark:hover:bg-neutral-900"
|
|
17
|
+
),
|
|
14
18
|
onClick: t,
|
|
15
19
|
children: [
|
|
16
20
|
l,
|
|
17
|
-
|
|
21
|
+
s
|
|
18
22
|
]
|
|
19
23
|
}
|
|
20
|
-
),
|
|
21
|
-
headerIndex:
|
|
22
|
-
headerGroup:
|
|
24
|
+
), X = ({
|
|
25
|
+
headerIndex: r,
|
|
26
|
+
headerGroup: s,
|
|
23
27
|
column: t,
|
|
24
28
|
onSort: l,
|
|
25
|
-
onFilter:
|
|
26
|
-
toggleHeaderOption:
|
|
27
|
-
setIsShowSortArrowAsc:
|
|
28
|
-
setIsShowSortArrowDesc:
|
|
29
|
-
setShowHeaderOptions:
|
|
30
|
-
toggleDataFilterModal:
|
|
31
|
-
isColumnConfigurable:
|
|
32
|
-
onAddColumnClick:
|
|
33
|
-
onEditColumnClick:
|
|
34
|
-
onDeleteColumnClick:
|
|
29
|
+
onFilter: i,
|
|
30
|
+
toggleHeaderOption: d,
|
|
31
|
+
setIsShowSortArrowAsc: m,
|
|
32
|
+
setIsShowSortArrowDesc: p,
|
|
33
|
+
setShowHeaderOptions: x,
|
|
34
|
+
toggleDataFilterModal: y,
|
|
35
|
+
isColumnConfigurable: u,
|
|
36
|
+
onAddColumnClick: N,
|
|
37
|
+
onEditColumnClick: R,
|
|
38
|
+
onDeleteColumnClick: z,
|
|
39
|
+
disabled: c = !1
|
|
35
40
|
}) => {
|
|
36
|
-
const
|
|
37
|
-
|
|
38
|
-
ref:
|
|
41
|
+
const b = D(), a = () => x(null), f = g(null);
|
|
42
|
+
O({
|
|
43
|
+
ref: f,
|
|
39
44
|
handler: a
|
|
40
45
|
});
|
|
41
|
-
const n =
|
|
42
|
-
return
|
|
43
|
-
|
|
44
|
-
}, []),
|
|
45
|
-
headerIndex:
|
|
46
|
-
headerGroup:
|
|
46
|
+
const n = b?.t ?? ((v) => v), C = t?.dataType === "date", h = t?.dataType === "boolean", B = n(C ? "Least Recent" : "Sort By A-Z"), L = n(C ? "Most Recent" : "Sort By Z-A");
|
|
47
|
+
return A(() => {
|
|
48
|
+
f.current?.querySelector("button:not([disabled])")?.focus();
|
|
49
|
+
}, []), b?.renderColumnOptions ? b.renderColumnOptions({
|
|
50
|
+
headerIndex: r,
|
|
51
|
+
headerGroup: s,
|
|
47
52
|
column: t,
|
|
48
53
|
onSort: l,
|
|
49
|
-
onFilter:
|
|
50
|
-
toggleHeaderOption:
|
|
51
|
-
setIsShowSortArrowAsc:
|
|
52
|
-
setIsShowSortArrowDesc:
|
|
53
|
-
setShowHeaderOptions:
|
|
54
|
-
toggleDataFilterModal:
|
|
55
|
-
isColumnConfigurable:
|
|
56
|
-
onAddColumnClick:
|
|
57
|
-
onEditColumnClick:
|
|
58
|
-
onDeleteColumnClick:
|
|
59
|
-
onClose: a
|
|
60
|
-
|
|
54
|
+
onFilter: i,
|
|
55
|
+
toggleHeaderOption: d,
|
|
56
|
+
setIsShowSortArrowAsc: m,
|
|
57
|
+
setIsShowSortArrowDesc: p,
|
|
58
|
+
setShowHeaderOptions: x,
|
|
59
|
+
toggleDataFilterModal: y,
|
|
60
|
+
isColumnConfigurable: u,
|
|
61
|
+
onAddColumnClick: N,
|
|
62
|
+
onEditColumnClick: R,
|
|
63
|
+
onDeleteColumnClick: z,
|
|
64
|
+
onClose: a,
|
|
65
|
+
disabled: c
|
|
66
|
+
}) : /* @__PURE__ */ k("div", { ref: f, children: [
|
|
61
67
|
/* @__PURE__ */ e("div", { className: "absolute inset-0", onClick: a }),
|
|
62
|
-
/* @__PURE__ */
|
|
63
|
-
|
|
68
|
+
/* @__PURE__ */ k(
|
|
69
|
+
U.div,
|
|
64
70
|
{
|
|
65
|
-
className:
|
|
71
|
+
className: w(
|
|
66
72
|
"absolute top-full bg-white dark:bg-black-700 rounded-lg shadow-lg cursor-pointer w-[220px] py-1 px-1 z-50 border border-neutral-200 dark:border-black-600",
|
|
67
|
-
|
|
73
|
+
r + 1 === (s.headers?.length ?? 0) ? "-right-6" : "left-0"
|
|
68
74
|
),
|
|
69
75
|
initial: { opacity: 0 },
|
|
70
76
|
animate: { opacity: 1 },
|
|
@@ -72,69 +78,72 @@ const o = ({ id: i, label: r, onClick: t, icon: l }) => /* @__PURE__ */ b(
|
|
|
72
78
|
transition: { ease: "linear", duration: 0.2 },
|
|
73
79
|
role: "menu",
|
|
74
80
|
children: [
|
|
75
|
-
l && !
|
|
81
|
+
l && !h ? /* @__PURE__ */ e(
|
|
76
82
|
o,
|
|
77
83
|
{
|
|
78
84
|
id: "btn-column-options-arrow-down",
|
|
79
|
-
label:
|
|
80
|
-
icon: /* @__PURE__ */ e(
|
|
85
|
+
label: B,
|
|
86
|
+
icon: /* @__PURE__ */ e(T, { fontSize: "small", className: "text-neutral-900 dark:text-neutral-100" }),
|
|
87
|
+
isDisabled: c,
|
|
81
88
|
onClick: () => {
|
|
82
|
-
l(t.key, "asc"),
|
|
89
|
+
l(t.key, "asc"), d(t.key), m(t.key), p(null);
|
|
83
90
|
}
|
|
84
91
|
}
|
|
85
92
|
) : null,
|
|
86
|
-
l && !
|
|
93
|
+
l && !h ? /* @__PURE__ */ e(
|
|
87
94
|
o,
|
|
88
95
|
{
|
|
89
96
|
id: "btn-column-options-arrow-up",
|
|
90
|
-
label:
|
|
91
|
-
icon: /* @__PURE__ */ e(
|
|
97
|
+
label: L,
|
|
98
|
+
icon: /* @__PURE__ */ e(j, { fontSize: "small", className: "text-neutral-900 dark:text-neutral-100" }),
|
|
99
|
+
isDisabled: c,
|
|
92
100
|
onClick: () => {
|
|
93
|
-
l(t.key, "desc"),
|
|
101
|
+
l(t.key, "desc"), d(t.key), m(null), p(t.key);
|
|
94
102
|
}
|
|
95
103
|
}
|
|
96
104
|
) : null,
|
|
97
|
-
|
|
105
|
+
i ? /* @__PURE__ */ e(
|
|
98
106
|
o,
|
|
99
107
|
{
|
|
100
108
|
id: "btn-column-options-filter-by",
|
|
101
109
|
label: n("Filter By"),
|
|
102
|
-
icon: /* @__PURE__ */ e(
|
|
110
|
+
icon: /* @__PURE__ */ e(E, { fontSize: "small", className: "text-neutral-900 dark:text-neutral-100" }),
|
|
111
|
+
isDisabled: c,
|
|
103
112
|
onClick: () => {
|
|
104
|
-
|
|
113
|
+
y(t), d(t.key);
|
|
105
114
|
}
|
|
106
115
|
}
|
|
107
116
|
) : null,
|
|
108
|
-
|
|
117
|
+
u ? /* @__PURE__ */ e(
|
|
109
118
|
o,
|
|
110
119
|
{
|
|
111
120
|
id: "btn-column-options-add-column",
|
|
112
121
|
label: n("Add Column"),
|
|
113
|
-
icon: /* @__PURE__ */ e(
|
|
122
|
+
icon: /* @__PURE__ */ e(Z, { fontSize: "small", className: "text-neutral-900 dark:text-neutral-100" }),
|
|
114
123
|
onClick: () => {
|
|
115
|
-
|
|
124
|
+
N?.(t), a();
|
|
116
125
|
}
|
|
117
126
|
}
|
|
118
127
|
) : null,
|
|
119
|
-
|
|
128
|
+
u ? /* @__PURE__ */ e(
|
|
120
129
|
o,
|
|
121
130
|
{
|
|
122
131
|
id: "btn-column-options-edit-column",
|
|
123
132
|
label: n("Edit Column"),
|
|
124
|
-
icon: /* @__PURE__ */ e(
|
|
133
|
+
icon: /* @__PURE__ */ e(q, { fontSize: "small", className: "text-neutral-900 dark:text-neutral-100" }),
|
|
125
134
|
onClick: () => {
|
|
126
|
-
|
|
135
|
+
R?.(t), a();
|
|
127
136
|
}
|
|
128
137
|
}
|
|
129
138
|
) : null,
|
|
130
|
-
|
|
139
|
+
u ? /* @__PURE__ */ e(
|
|
131
140
|
o,
|
|
132
141
|
{
|
|
133
142
|
id: "btn-column-options-delete-column",
|
|
134
143
|
label: n("Delete Column"),
|
|
135
|
-
icon: /* @__PURE__ */ e(
|
|
144
|
+
icon: /* @__PURE__ */ e(F, { fontSize: "small", className: "text-neutral-900 dark:text-neutral-100" }),
|
|
136
145
|
onClick: () => {
|
|
137
|
-
|
|
146
|
+
z?.(t), a();
|
|
138
147
|
}
|
|
139
148
|
}
|
|
140
149
|
) : null
|
|
@@ -144,6 +153,6 @@ const o = ({ id: i, label: r, onClick: t, icon: l }) => /* @__PURE__ */ b(
|
|
|
144
153
|
] });
|
|
145
154
|
};
|
|
146
155
|
export {
|
|
147
|
-
|
|
156
|
+
X as Options
|
|
148
157
|
};
|
|
149
158
|
//# sourceMappingURL=Options.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Options.es.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Options.tsx"],"sourcesContent":["import { useOutsideClick } from '../../../../../hooks/useOutsideClick';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { AddRounded, ArrowDownwardRounded, ArrowUpwardRounded, DeleteOutlineRounded, EditRounded, FilterListRounded } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { useEffect, useRef } from 'react';\n\ninterface HeaderColumn {\n id: string;\n key: string;\n dataType?: string;\n [k: string]: unknown;\n}\n\ninterface OptionsProps {\n headerIndex: number;\n headerGroup: { headers?: unknown[]; [k: string]: unknown };\n column: HeaderColumn;\n onSort?: (field: string, order?: string) => void;\n onFilter?: (column: string, value: unknown) => void;\n toggleHeaderOption: (key: string) => void;\n setIsShowSortArrowAsc: (value: string | null) => void;\n setIsShowSortArrowDesc: (value: string | null) => void;\n setShowHeaderOptions: (value: string | null) => void;\n toggleDataFilterModal: (column: unknown) => void;\n isColumnConfigurable: boolean;\n onAddColumnClick?: (column: HeaderColumn) => void;\n onEditColumnClick?: (column: HeaderColumn) => void;\n onDeleteColumnClick?: (column: HeaderColumn) => void;\n}\n\ntype OptionButtonProps = {\n id: string;\n label: string;\n onClick: () => void;\n icon: JSX.Element;\n};\n\nconst OptionButton = ({ id, label, onClick, icon }: OptionButtonProps) => {\n return (\n <button\n id={id}\n type='button'\n className='flex w-full px-4 py-2 text-neutral-900 dark:text-white font-inter text-sm font-medium rounded-[4px] hover:bg-neutral-100 dark:hover:bg-neutral-900 items-center gap-3'\n onClick={onClick}\n >\n {icon}\n {label}\n </button>\n );\n};\n\nexport const Options = ({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n}: OptionsProps) => {\n const tableConfig = useTableConfig();\n const handleCloseFilters = () => setShowHeaderOptions(null);\n const ref = useRef<HTMLDivElement>(null);\n useOutsideClick({\n ref,\n handler: handleCloseFilters,\n });\n const t = tableConfig?.t ?? ((key: string) => key);\n const isDateColumn = column?.dataType === 'date';\n const isBooleanColumn = column?.dataType === 'boolean';\n const sortAscLabel = isDateColumn ? t('Least Recent') : t('Sort By A-Z');\n const sortDescLabel = isDateColumn ? t('Most Recent') : t('Sort By Z-A');\n\n useEffect(() => {\n const firstOption = ref.current?.querySelector<HTMLButtonElement>('button:not([disabled])');\n firstOption?.focus();\n }, []);\n\n if (tableConfig?.renderColumnOptions) {\n return tableConfig.renderColumnOptions({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n onClose: handleCloseFilters,\n }) as JSX.Element;\n }\n\n return (\n <div ref={ref}>\n <div className='absolute inset-0' onClick={handleCloseFilters} />\n <motion.div\n className={cn(\n 'absolute top-full bg-white dark:bg-black-700 rounded-lg shadow-lg cursor-pointer w-[220px] py-1 px-1 z-50 border border-neutral-200 dark:border-black-600',\n headerIndex + 1 === (headerGroup.headers?.length ?? 0) ? '-right-6' : 'left-0',\n )}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ ease: 'linear', duration: 0.2 }}\n role='menu'\n >\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-down'\n label={sortAscLabel}\n icon={<ArrowDownwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onSort(column.key, 'asc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(column.key);\n setIsShowSortArrowDesc(null);\n }}\n />\n ) : null}\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-up'\n label={sortDescLabel}\n icon={<ArrowUpwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onSort(column.key, 'desc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(null);\n setIsShowSortArrowDesc(column.key);\n }}\n />\n ) : null}\n {onFilter ? (\n <OptionButton\n id='btn-column-options-filter-by'\n label={t('Filter By')}\n icon={<FilterListRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n toggleDataFilterModal(column);\n toggleHeaderOption(column.key);\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-add-column'\n label={t('Add Column')}\n icon={<AddRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onAddColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-edit-column'\n label={t('Edit Column')}\n icon={<EditRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onEditColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-delete-column'\n label={t('Delete Column')}\n icon={<DeleteOutlineRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onDeleteColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n </motion.div>\n </div>\n );\n};\n"],"names":["OptionButton","id","label","onClick","icon","jsxs","Options","headerIndex","headerGroup","column","onSort","onFilter","toggleHeaderOption","setIsShowSortArrowAsc","setIsShowSortArrowDesc","setShowHeaderOptions","toggleDataFilterModal","isColumnConfigurable","onAddColumnClick","onEditColumnClick","onDeleteColumnClick","tableConfig","useTableConfig","handleCloseFilters","ref","useRef","useOutsideClick","t","key","isDateColumn","isBooleanColumn","sortAscLabel","sortDescLabel","useEffect","jsx","motion","cn","ArrowDownwardRounded","ArrowUpwardRounded","FilterListRounded","AddRounded","EditRounded","DeleteOutlineRounded"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Options.es.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Options.tsx"],"sourcesContent":["import { useOutsideClick } from '../../../../../hooks/useOutsideClick';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { AddRounded, ArrowDownwardRounded, ArrowUpwardRounded, DeleteOutlineRounded, EditRounded, FilterListRounded } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { useEffect, useRef } from 'react';\n\ninterface HeaderColumn {\n id: string;\n key: string;\n dataType?: string;\n [k: string]: unknown;\n}\n\ninterface OptionsProps {\n headerIndex: number;\n headerGroup: { headers?: unknown[]; [k: string]: unknown };\n column: HeaderColumn;\n onSort?: (field: string, order?: string) => void;\n onFilter?: (column: string, value: unknown) => void;\n toggleHeaderOption: (key: string) => void;\n setIsShowSortArrowAsc: (value: string | null) => void;\n setIsShowSortArrowDesc: (value: string | null) => void;\n setShowHeaderOptions: (value: string | null) => void;\n toggleDataFilterModal: (column: unknown) => void;\n isColumnConfigurable: boolean;\n onAddColumnClick?: (column: HeaderColumn) => void;\n onEditColumnClick?: (column: HeaderColumn) => void;\n onDeleteColumnClick?: (column: HeaderColumn) => void;\n disabled?: boolean;\n}\n\ntype OptionButtonProps = {\n id: string;\n label: string;\n onClick: () => void;\n icon: JSX.Element;\n isDisabled?: boolean;\n};\n\nconst OptionButton = ({ id, label, onClick, icon, isDisabled = false }: OptionButtonProps) => {\n return (\n <button\n id={id}\n type='button'\n disabled={isDisabled}\n className={cn(\n 'flex w-full px-4 py-2 text-neutral-900 dark:text-white font-inter text-sm font-medium rounded-[4px] items-center gap-3',\n isDisabled ? 'opacity-60 cursor-not-allowed' : 'hover:bg-neutral-100 dark:hover:bg-neutral-900',\n )}\n onClick={onClick}\n >\n {icon}\n {label}\n </button>\n );\n};\n\nexport const Options = ({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n disabled = false,\n}: OptionsProps) => {\n const tableConfig = useTableConfig();\n const handleCloseFilters = () => setShowHeaderOptions(null);\n const ref = useRef<HTMLDivElement>(null);\n useOutsideClick({\n ref,\n handler: handleCloseFilters,\n });\n const t = tableConfig?.t ?? ((key: string) => key);\n const isDateColumn = column?.dataType === 'date';\n const isBooleanColumn = column?.dataType === 'boolean';\n const sortAscLabel = isDateColumn ? t('Least Recent') : t('Sort By A-Z');\n const sortDescLabel = isDateColumn ? t('Most Recent') : t('Sort By Z-A');\n\n useEffect(() => {\n const firstOption = ref.current?.querySelector<HTMLButtonElement>('button:not([disabled])');\n firstOption?.focus();\n }, []);\n\n if (tableConfig?.renderColumnOptions) {\n return tableConfig.renderColumnOptions({\n headerIndex,\n headerGroup,\n column,\n onSort,\n onFilter,\n toggleHeaderOption,\n setIsShowSortArrowAsc,\n setIsShowSortArrowDesc,\n setShowHeaderOptions,\n toggleDataFilterModal,\n isColumnConfigurable,\n onAddColumnClick,\n onEditColumnClick,\n onDeleteColumnClick,\n onClose: handleCloseFilters,\n disabled,\n }) as JSX.Element;\n }\n\n return (\n <div ref={ref}>\n <div className='absolute inset-0' onClick={handleCloseFilters} />\n <motion.div\n className={cn(\n 'absolute top-full bg-white dark:bg-black-700 rounded-lg shadow-lg cursor-pointer w-[220px] py-1 px-1 z-50 border border-neutral-200 dark:border-black-600',\n headerIndex + 1 === (headerGroup.headers?.length ?? 0) ? '-right-6' : 'left-0',\n )}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ ease: 'linear', duration: 0.2 }}\n role='menu'\n >\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-down'\n label={sortAscLabel}\n icon={<ArrowDownwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n isDisabled={disabled}\n onClick={() => {\n onSort(column.key, 'asc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(column.key);\n setIsShowSortArrowDesc(null);\n }}\n />\n ) : null}\n {onSort && !isBooleanColumn ? (\n <OptionButton\n id='btn-column-options-arrow-up'\n label={sortDescLabel}\n icon={<ArrowUpwardRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n isDisabled={disabled}\n onClick={() => {\n onSort(column.key, 'desc');\n toggleHeaderOption(column.key);\n setIsShowSortArrowAsc(null);\n setIsShowSortArrowDesc(column.key);\n }}\n />\n ) : null}\n {onFilter ? (\n <OptionButton\n id='btn-column-options-filter-by'\n label={t('Filter By')}\n icon={<FilterListRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n isDisabled={disabled}\n onClick={() => {\n toggleDataFilterModal(column);\n toggleHeaderOption(column.key);\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-add-column'\n label={t('Add Column')}\n icon={<AddRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onAddColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-edit-column'\n label={t('Edit Column')}\n icon={<EditRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onEditColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n {isColumnConfigurable ? (\n <OptionButton\n id='btn-column-options-delete-column'\n label={t('Delete Column')}\n icon={<DeleteOutlineRounded fontSize='small' className='text-neutral-900 dark:text-neutral-100' />}\n onClick={() => {\n onDeleteColumnClick?.(column);\n handleCloseFilters();\n }}\n />\n ) : null}\n </motion.div>\n </div>\n );\n};\n"],"names":["OptionButton","id","label","onClick","icon","isDisabled","jsxs","cn","Options","headerIndex","headerGroup","column","onSort","onFilter","toggleHeaderOption","setIsShowSortArrowAsc","setIsShowSortArrowDesc","setShowHeaderOptions","toggleDataFilterModal","isColumnConfigurable","onAddColumnClick","onEditColumnClick","onDeleteColumnClick","disabled","tableConfig","useTableConfig","handleCloseFilters","ref","useRef","useOutsideClick","t","key","isDateColumn","isBooleanColumn","sortAscLabel","sortDescLabel","useEffect","jsx","motion","ArrowDownwardRounded","ArrowUpwardRounded","FilterListRounded","AddRounded","EditRounded","DeleteOutlineRounded"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("../../../../../_virtual/index.cjs.js"),l=require("react"),g=({column:r,onResizeComplete:c,disabled:e=!1})=>{const s=r.isResizing,t=e?{}:r.getResizerProps?.()||{},[n,i]=l.useState(!1);return u.jsx("div",{...t,onDoubleClick:()=>{e||r.resetResizing?.()},onMouseDown:o=>{t.onMouseDown?.(o)},onMouseEnter:()=>i(!0),onMouseLeave:()=>i(!1),onMouseUp:()=>{e||c(r.Header,r.width)},onTouchStart:o=>{t.onTouchStart?.(o)},className:a("absolute top-0 right-0 w-1 h-full touch-none translate-x-1/2 transition-all z-10",{"cursor-col-resize":!e,"cursor-not-allowed":e,"bg-blue-400 dark:bg-blue-400":s,"bg-[#8ecae6] dark:bg-neutral-600":!s&&n&&!e,"bg-transparent":!s&&(!n||e)}),style:{userSelect:"none"},children:u.jsx("div",{className:a("absolute inset-y-0 -left-2 -right-2",e?"cursor-not-allowed":"cursor-col-resize")})})};exports.Resizer=g;
|
|
2
2
|
//# sourceMappingURL=Resizer.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Resizer.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Resizer.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React, { useState } from 'react';\n\ninterface ResizerColumn {\n isResizing?: boolean;\n getResizerProps?: () => { onMouseDown?: (e: React.MouseEvent) => void; onTouchStart?: (e: React.TouchEvent) => void; [k: string]: unknown };\n resetResizing?: () => void;\n Header: string;\n width: number;\n [k: string]: unknown;\n}\n\ninterface ResizerProps {\n column: ResizerColumn;\n onResizeComplete: (columnHeader: string, width: number) => void;\n}\n\nexport const Resizer = ({ column, onResizeComplete }: ResizerProps) => {\n const isResizing = column.isResizing;\n const resizerProps = column.getResizerProps?.() || {};\n const [isHoveringResizer, setIsHoveringResizer] = useState(false);\n\n return (\n <div\n {...resizerProps}\n onDoubleClick={() => column.resetResizing?.()}\n onMouseDown={(e) => {\n resizerProps.onMouseDown?.(e);\n }}\n onMouseEnter={() => setIsHoveringResizer(true)}\n onMouseLeave={() => setIsHoveringResizer(false)}\n onMouseUp={() => {\n onResizeComplete(column.Header, column.width);\n }}\n onTouchStart={(e) => {\n resizerProps.onTouchStart?.(e);\n }}\n className={cn('absolute top-0 right-0 w-1 h-full
|
|
1
|
+
{"version":3,"file":"Resizer.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Resizer.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React, { useState } from 'react';\n\ninterface ResizerColumn {\n isResizing?: boolean;\n getResizerProps?: () => { onMouseDown?: (e: React.MouseEvent) => void; onTouchStart?: (e: React.TouchEvent) => void; [k: string]: unknown };\n resetResizing?: () => void;\n Header: string;\n width: number;\n [k: string]: unknown;\n}\n\ninterface ResizerProps {\n column: ResizerColumn;\n onResizeComplete: (columnHeader: string, width: number) => void;\n disabled?: boolean;\n}\n\nexport const Resizer = ({ column, onResizeComplete, disabled = false }: ResizerProps) => {\n const isResizing = column.isResizing;\n const resizerProps = disabled ? {} : column.getResizerProps?.() || {};\n const [isHoveringResizer, setIsHoveringResizer] = useState(false);\n\n return (\n <div\n {...resizerProps}\n onDoubleClick={() => {\n if (!disabled) column.resetResizing?.();\n }}\n onMouseDown={(e) => {\n resizerProps.onMouseDown?.(e);\n }}\n onMouseEnter={() => setIsHoveringResizer(true)}\n onMouseLeave={() => setIsHoveringResizer(false)}\n onMouseUp={() => {\n if (disabled) return;\n onResizeComplete(column.Header, column.width);\n }}\n onTouchStart={(e) => {\n resizerProps.onTouchStart?.(e);\n }}\n className={cn('absolute top-0 right-0 w-1 h-full touch-none translate-x-1/2 transition-all z-10', {\n 'cursor-col-resize': !disabled,\n 'cursor-not-allowed': disabled,\n 'bg-blue-400 dark:bg-blue-400': isResizing,\n 'bg-[#8ecae6] dark:bg-neutral-600': !isResizing && isHoveringResizer && !disabled,\n 'bg-transparent': !isResizing && (!isHoveringResizer || disabled),\n })}\n style={{ userSelect: 'none' }}\n >\n <div className={cn('absolute inset-y-0 -left-2 -right-2', disabled ? 'cursor-not-allowed' : 'cursor-col-resize')} />\n </div>\n );\n};\n"],"names":["Resizer","column","onResizeComplete","disabled","isResizing","resizerProps","isHoveringResizer","setIsHoveringResizer","useState","jsx","e","cn"],"mappings":"0LAkBaA,EAAU,CAAC,CAAE,OAAAC,EAAQ,iBAAAC,EAAkB,SAAAC,EAAW,MAA0B,CACvF,MAAMC,EAAaH,EAAO,WACpBI,EAAeF,EAAW,CAAA,EAAKF,EAAO,kBAAA,GAAuB,CAAA,EAC7D,CAACK,EAAmBC,CAAoB,EAAIC,EAAAA,SAAS,EAAK,EAEhE,OACEC,EAAAA,IAAC,MAAA,CACE,GAAGJ,EACJ,cAAe,IAAM,CACdF,GAAUF,EAAO,gBAAA,CACxB,EACA,YAAcS,GAAM,CAClBL,EAAa,cAAcK,CAAC,CAC9B,EACA,aAAc,IAAMH,EAAqB,EAAI,EAC7C,aAAc,IAAMA,EAAqB,EAAK,EAC9C,UAAW,IAAM,CACXJ,GACJD,EAAiBD,EAAO,OAAQA,EAAO,KAAK,CAC9C,EACA,aAAeS,GAAM,CACnBL,EAAa,eAAeK,CAAC,CAC/B,EACA,UAAWC,EAAG,mFAAoF,CAChG,oBAAqB,CAACR,EACtB,qBAAsBA,EACtB,+BAAgCC,EAChC,mCAAoC,CAACA,GAAcE,GAAqB,CAACH,EACzE,iBAAkB,CAACC,IAAe,CAACE,GAAqBH,EAAA,CACzD,EACD,MAAO,CAAE,WAAY,MAAA,EAErB,SAAAM,EAAAA,IAAC,OAAI,UAAWE,EAAG,sCAAuCR,EAAW,qBAAuB,mBAAmB,CAAA,CAAG,CAAA,CAAA,CAGxH"}
|
|
@@ -14,6 +14,7 @@ interface ResizerColumn {
|
|
|
14
14
|
interface ResizerProps {
|
|
15
15
|
column: ResizerColumn;
|
|
16
16
|
onResizeComplete: (columnHeader: string, width: number) => void;
|
|
17
|
+
disabled?: boolean;
|
|
17
18
|
}
|
|
18
|
-
export declare const Resizer: ({ column, onResizeComplete }: ResizerProps) => import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
export declare const Resizer: ({ column, onResizeComplete, disabled }: ResizerProps) => import("react/jsx-runtime").JSX.Element;
|
|
19
20
|
export {};
|
|
@@ -1,35 +1,39 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import
|
|
3
|
-
import { useState as
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
return /* @__PURE__ */
|
|
1
|
+
import { jsx as u } from "react/jsx-runtime";
|
|
2
|
+
import a from "../../../../../_virtual/index.es.js";
|
|
3
|
+
import { useState as l } from "react";
|
|
4
|
+
const p = ({ column: r, onResizeComplete: c, disabled: e = !1 }) => {
|
|
5
|
+
const o = r.isResizing, s = e ? {} : r.getResizerProps?.() || {}, [n, i] = l(!1);
|
|
6
|
+
return /* @__PURE__ */ u(
|
|
7
7
|
"div",
|
|
8
8
|
{
|
|
9
|
-
...
|
|
10
|
-
onDoubleClick: () =>
|
|
11
|
-
|
|
12
|
-
|
|
9
|
+
...s,
|
|
10
|
+
onDoubleClick: () => {
|
|
11
|
+
e || r.resetResizing?.();
|
|
12
|
+
},
|
|
13
|
+
onMouseDown: (t) => {
|
|
14
|
+
s.onMouseDown?.(t);
|
|
13
15
|
},
|
|
14
16
|
onMouseEnter: () => i(!0),
|
|
15
17
|
onMouseLeave: () => i(!1),
|
|
16
18
|
onMouseUp: () => {
|
|
17
|
-
|
|
19
|
+
e || c(r.Header, r.width);
|
|
18
20
|
},
|
|
19
|
-
onTouchStart: (
|
|
20
|
-
|
|
21
|
+
onTouchStart: (t) => {
|
|
22
|
+
s.onTouchStart?.(t);
|
|
21
23
|
},
|
|
22
|
-
className:
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
"bg-
|
|
24
|
+
className: a("absolute top-0 right-0 w-1 h-full touch-none translate-x-1/2 transition-all z-10", {
|
|
25
|
+
"cursor-col-resize": !e,
|
|
26
|
+
"cursor-not-allowed": e,
|
|
27
|
+
"bg-blue-400 dark:bg-blue-400": o,
|
|
28
|
+
"bg-[#8ecae6] dark:bg-neutral-600": !o && n && !e,
|
|
29
|
+
"bg-transparent": !o && (!n || e)
|
|
26
30
|
}),
|
|
27
31
|
style: { userSelect: "none" },
|
|
28
|
-
children: /* @__PURE__ */
|
|
32
|
+
children: /* @__PURE__ */ u("div", { className: a("absolute inset-y-0 -left-2 -right-2", e ? "cursor-not-allowed" : "cursor-col-resize") })
|
|
29
33
|
}
|
|
30
34
|
);
|
|
31
35
|
};
|
|
32
36
|
export {
|
|
33
|
-
|
|
37
|
+
p as Resizer
|
|
34
38
|
};
|
|
35
39
|
//# sourceMappingURL=Resizer.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Resizer.es.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Resizer.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React, { useState } from 'react';\n\ninterface ResizerColumn {\n isResizing?: boolean;\n getResizerProps?: () => { onMouseDown?: (e: React.MouseEvent) => void; onTouchStart?: (e: React.TouchEvent) => void; [k: string]: unknown };\n resetResizing?: () => void;\n Header: string;\n width: number;\n [k: string]: unknown;\n}\n\ninterface ResizerProps {\n column: ResizerColumn;\n onResizeComplete: (columnHeader: string, width: number) => void;\n}\n\nexport const Resizer = ({ column, onResizeComplete }: ResizerProps) => {\n const isResizing = column.isResizing;\n const resizerProps = column.getResizerProps?.() || {};\n const [isHoveringResizer, setIsHoveringResizer] = useState(false);\n\n return (\n <div\n {...resizerProps}\n onDoubleClick={() => column.resetResizing?.()}\n onMouseDown={(e) => {\n resizerProps.onMouseDown?.(e);\n }}\n onMouseEnter={() => setIsHoveringResizer(true)}\n onMouseLeave={() => setIsHoveringResizer(false)}\n onMouseUp={() => {\n onResizeComplete(column.Header, column.width);\n }}\n onTouchStart={(e) => {\n resizerProps.onTouchStart?.(e);\n }}\n className={cn('absolute top-0 right-0 w-1 h-full
|
|
1
|
+
{"version":3,"file":"Resizer.es.js","sources":["../../../../../../src/components/data-display/infinite-table/head/cell/Resizer.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React, { useState } from 'react';\n\ninterface ResizerColumn {\n isResizing?: boolean;\n getResizerProps?: () => { onMouseDown?: (e: React.MouseEvent) => void; onTouchStart?: (e: React.TouchEvent) => void; [k: string]: unknown };\n resetResizing?: () => void;\n Header: string;\n width: number;\n [k: string]: unknown;\n}\n\ninterface ResizerProps {\n column: ResizerColumn;\n onResizeComplete: (columnHeader: string, width: number) => void;\n disabled?: boolean;\n}\n\nexport const Resizer = ({ column, onResizeComplete, disabled = false }: ResizerProps) => {\n const isResizing = column.isResizing;\n const resizerProps = disabled ? {} : column.getResizerProps?.() || {};\n const [isHoveringResizer, setIsHoveringResizer] = useState(false);\n\n return (\n <div\n {...resizerProps}\n onDoubleClick={() => {\n if (!disabled) column.resetResizing?.();\n }}\n onMouseDown={(e) => {\n resizerProps.onMouseDown?.(e);\n }}\n onMouseEnter={() => setIsHoveringResizer(true)}\n onMouseLeave={() => setIsHoveringResizer(false)}\n onMouseUp={() => {\n if (disabled) return;\n onResizeComplete(column.Header, column.width);\n }}\n onTouchStart={(e) => {\n resizerProps.onTouchStart?.(e);\n }}\n className={cn('absolute top-0 right-0 w-1 h-full touch-none translate-x-1/2 transition-all z-10', {\n 'cursor-col-resize': !disabled,\n 'cursor-not-allowed': disabled,\n 'bg-blue-400 dark:bg-blue-400': isResizing,\n 'bg-[#8ecae6] dark:bg-neutral-600': !isResizing && isHoveringResizer && !disabled,\n 'bg-transparent': !isResizing && (!isHoveringResizer || disabled),\n })}\n style={{ userSelect: 'none' }}\n >\n <div className={cn('absolute inset-y-0 -left-2 -right-2', disabled ? 'cursor-not-allowed' : 'cursor-col-resize')} />\n </div>\n );\n};\n"],"names":["Resizer","column","onResizeComplete","disabled","isResizing","resizerProps","isHoveringResizer","setIsHoveringResizer","useState","jsx","e","cn"],"mappings":";;;AAkBO,MAAMA,IAAU,CAAC,EAAE,QAAAC,GAAQ,kBAAAC,GAAkB,UAAAC,IAAW,SAA0B;AACvF,QAAMC,IAAaH,EAAO,YACpBI,IAAeF,IAAW,CAAA,IAAKF,EAAO,kBAAA,KAAuB,CAAA,GAC7D,CAACK,GAAmBC,CAAoB,IAAIC,EAAS,EAAK;AAEhE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGJ;AAAA,MACJ,eAAe,MAAM;AACnB,QAAKF,KAAUF,EAAO,gBAAA;AAAA,MACxB;AAAA,MACA,aAAa,CAACS,MAAM;AAClB,QAAAL,EAAa,cAAcK,CAAC;AAAA,MAC9B;AAAA,MACA,cAAc,MAAMH,EAAqB,EAAI;AAAA,MAC7C,cAAc,MAAMA,EAAqB,EAAK;AAAA,MAC9C,WAAW,MAAM;AACf,QAAIJ,KACJD,EAAiBD,EAAO,QAAQA,EAAO,KAAK;AAAA,MAC9C;AAAA,MACA,cAAc,CAACS,MAAM;AACnB,QAAAL,EAAa,eAAeK,CAAC;AAAA,MAC/B;AAAA,MACA,WAAWC,EAAG,oFAAoF;AAAA,QAChG,qBAAqB,CAACR;AAAA,QACtB,sBAAsBA;AAAA,QACtB,gCAAgCC;AAAA,QAChC,oCAAoC,CAACA,KAAcE,KAAqB,CAACH;AAAA,QACzE,kBAAkB,CAACC,MAAe,CAACE,KAAqBH;AAAA,MAAA,CACzD;AAAA,MACD,OAAO,EAAE,YAAY,OAAA;AAAA,MAErB,UAAA,gBAAAM,EAAC,SAAI,WAAWE,EAAG,uCAAuCR,IAAW,uBAAuB,mBAAmB,EAAA,CAAG;AAAA,IAAA;AAAA,EAAA;AAGxH;"}
|