dinocollab-core 2.2.0 → 2.2.2

package/dist/src/filter-bar/components/hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.js","sources":["../../../../src/filter-bar/components/hooks.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// types\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldSort, TFieldStore, TFieldType, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\ntype TOptions = {\r\n  logic?: TLogic\r\n}\r\n\r\n/**\r\n * Check if a given filter value already exists in the store for a specific field.\r\n * @param storeFilter - The current filter store.\r\n * @param field - The field to check for duplicate values.\r\n * @param value - The filter value to check for duplicates.\r\n * @returns True if a duplicate value exists, false otherwise.\r\n */\r\nconst checkDuplicateValue = <T>(storeFilter: TFieldStore<T> | undefined, field: keyof TFieldStore<T>, value: TFieldValue): boolean => {\r\n  // If there is no filter store or no filter values for the field, there can be no duplicates\r\n  if (!storeFilter) return false\r\n  const fieldValue = storeFilter[field]\r\n  // If there are no filter values for the field, there can be no duplicates\r\n  if (!fieldValue) return false\r\n  // Create a set of existing values for the field to efficiently check for duplicates\r\n  const fieldSet = new Set(fieldValue.values.map((v) => JSON.stringify(v)).filter(Boolean))\r\n  return value.values.some((v) => fieldSet.has(JSON.stringify(v)))\r\n}\r\n/**\r\n * Merge a filter value into the store for a specific field.\r\n * @param storeFilter - The current filter store.\r\n * @param field - The field to merge the value into.\r\n * @param value - The filter value to merge.\r\n * @returns The updated filter store.\r\n */\r\nconst mergeValueToStoreFilter = <T>(storeFilter: TFieldStore<T> | undefined, field: keyof TFieldStore<T>, value: TFieldValue): TFieldStore<T> => {\r\n  const fieldValue: TFieldValue | undefined = storeFilter?.[field]\r\n  const values = Array.from(new Set([...(fieldValue?.values || []), ...value.values].filter(Boolean)))\r\n  const newData: TFieldValue = { values, logic: value.logic || fieldValue?.logic }\r\n  return Object.assign({}, storeFilter, { [field]: newData }) as TFieldStore<T>\r\n}\r\n\r\nexport const useFilterActions = <T>(context: IFilterBarContext<T>) => {\r\n  /**\r\n   * Add a filter value to the store for a specific field.\r\n   * @param field - The field to add the filter value to.\r\n   * @param value - The filter value to add.\r\n   * @returns void\r\n   */\r\n  const addFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    // Check for duplicate value before adding\r\n    const { storeFilter } = context.filterState\r\n    const valueObj: TFieldValue = { ...value, logic: options?.logic || value.logic }\r\n    // If the value already exists in the store for the field, do not add it again\r\n    if (checkDuplicateValue(storeFilter, field, valueObj)) return\r\n    // Merge the new value into the store filter for the field\r\n    const newData = mergeValueToStoreFilter(storeFilter, field, valueObj)\r\n    const newStoreFilter = Object.assign({}, storeFilter, newData)\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n  /**\r\n   * Replace all filter values for a specific field in the store with a new value.\r\n   * Value will be replaced instead of merged, which is useful for single-value filters or when you want to reset the filter values for a field.\r\n   * @param field - The field to update the filter value for.\r\n   * @param value - The new filter value to set.\r\n   */\r\n  const replaceFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    const valueObj: TFieldValue = { ...value, logic: options?.logic || value.logic }\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter, { [field]: valueObj })\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter as TFieldStore<T> })\r\n  }\r\n  /**\r\n   * Add multiple filter values to the store for a specific field, ensuring no duplicates are added.\r\n   * @param field - The field to add the filter values to.\r\n   * @param values - The filter values to add.\r\n   * @returns void\r\n   */\r\n  const upsertManyFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    // If there are no values to add, return early\r\n    if (value.values.length === 0) return\r\n    let newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    // Iterate through each value and add it to the store filter for the field, checking for duplicates\r\n    value.values.forEach((val) => {\r\n      const valueObj: TFieldValue = { values: [val], logic: options?.logic || value.logic }\r\n      if (checkDuplicateValue(newStoreFilter, field, valueObj)) return\r\n      newStoreFilter = mergeValueToStoreFilter(newStoreFilter, field, valueObj)\r\n    })\r\n    // Update the filter state with the new store filter after adding all values\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n  /**\r\n   * Remove all filter values for a specific field from the store.\r\n   * @param field - The field to remove filters from.\r\n   * @returns void\r\n   */\r\n  const removeFilter = (field: TFieldType<T>) => {\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    delete newStoreFilter[field]\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n\r\n  const removeFilterByFieldValue = (field: TFieldType<T>, value: TFieldValid) => {\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    const fieldVal: TFieldValue | undefined = newStoreFilter[field]\r\n    if (!fieldVal) return\r\n    newStoreFilter[field] = { ...fieldVal, values: fieldVal.values.filter((v) => v.toString() !== value.toString()) }\r\n    if (newStoreFilter[field] && newStoreFilter[field]!.values.length === 0) {\r\n      delete newStoreFilter[field]\r\n    }\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n\r\n  const clearAllFilters = () => {\r\n    context.setFilterState({ ...context.filterState, storeFilter: {} as TFieldStore<T> })\r\n  }\r\n\r\n  const getCountByField = (field: TFieldType<T>): number => {\r\n    const fieldVal = context.filterState.storeFilter?.[field]\r\n    return fieldVal ? fieldVal.values.length : 0\r\n  }\r\n\r\n  const getTotalCount = (): number => {\r\n    const storeFilter = context.filterState.storeFilter\r\n    if (!storeFilter) return 0\r\n    const keys = Object.keys(storeFilter) as (keyof TFieldStore<T>)[]\r\n    return keys.reduce((acc, key) => {\r\n      const fieldVal = storeFilter[key]\r\n      return acc + (fieldVal ? fieldVal.values.length : 0)\r\n    }, 0)\r\n  }\r\n\r\n  const hasSortByField = (field: TFieldType<T>): boolean => {\r\n    const sort = context.filterState.storeSort\r\n    return sort?.field === field\r\n  }\r\n\r\n  const getSort = (): TFieldSort<T> | undefined => {\r\n    return context.filterState.storeSort\r\n  }\r\n\r\n  const changeSort = (field: TFieldType<T>) => {\r\n    const currentSort = context.filterState.storeSort\r\n    let newDirection: 'asc' | 'desc' = 'desc'\r\n    if (currentSort?.field === field) {\r\n      newDirection = currentSort.direction === 'desc' ? 'asc' : 'desc'\r\n    }\r\n    const newSort = { field, direction: newDirection }\r\n    context.setFilterState({ ...context.filterState, storeSort: newSort })\r\n  }\r\n\r\n  const removeSort = () => {\r\n    context.setFilterState({ ...context.filterState, storeSort: undefined })\r\n  }\r\n\r\n  return {\r\n    addFilter,\r\n    replaceFilter,\r\n    upsertManyFilter,\r\n    removeFilter,\r\n    removeFilterByFieldValue,\r\n    clearAllFilters,\r\n    getCountByField,\r\n    getTotalCount,\r\n    hasSortByField,\r\n    getSort,\r\n    changeSort,\r\n    removeSort\r\n  }\r\n}\r\n"],"names":["checkDuplicateValue","storeFilter","field","value","fieldValue","fieldSet","Set","values","map","v","JSON","stringify","filter","Boolean","some","has","mergeValueToStoreFilter","newData","Array","from","concat","_toConsumableArray","logic","Object","assign","_defineProperty","useFilterActions","context","addFilter","options","filterState","valueObj","_objectSpread","newStoreFilter","setFilterState","replaceFilter","upsertManyFilter","length","forEach","val","removeFilter","removeFilterByFieldValue","fieldVal","toString","clearAllFilters","getCountByField","_context$filterState$","getTotalCount","keys","reduce","acc","key","hasSortByField","sort","storeSort","getSort","changeSort","currentSort","newDirection","direction","newSort","removeSort","undefined"],"mappings":"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"}
+{"version":3,"file":"hooks.js","sources":["../../../../src/filter-bar/components/hooks.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// types\r\nimport { useState } from 'react'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldSort, TFieldStore, TFieldType, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\ntype TOptions = {\r\n  logic?: TLogic\r\n}\r\n\r\n/**\r\n * Check if a given filter value already exists in the store for a specific field.\r\n * @param storeFilter - The current filter store.\r\n * @param field - The field to check for duplicate values.\r\n * @param value - The filter value to check for duplicates.\r\n * @returns True if a duplicate value exists, false otherwise.\r\n */\r\nconst checkDuplicateValue = <T>(storeFilter: TFieldStore<T> | undefined, field: keyof TFieldStore<T>, value: TFieldValue): boolean => {\r\n  // If there is no filter store or no filter values for the field, there can be no duplicates\r\n  if (!storeFilter) return false\r\n  const fieldValue = storeFilter[field]\r\n  // If there are no filter values for the field, there can be no duplicates\r\n  if (!fieldValue) return false\r\n  const isLogicChange = value.logic !== fieldValue.logic\r\n  // Create a set of existing values for the field to efficiently check for duplicates\r\n  const fieldSet = new Set(fieldValue.values.map((v) => JSON.stringify(v)).filter(Boolean))\r\n  return value.values.some((v) => fieldSet.has(JSON.stringify(v))) && !isLogicChange\r\n}\r\n/**\r\n * Merge a filter value into the store for a specific field.\r\n * @param storeFilter - The current filter store.\r\n * @param field - The field to merge the value into.\r\n * @param value - The filter value to merge.\r\n * @returns The updated filter store.\r\n */\r\nconst mergeValueToStoreFilter = <T>(storeFilter: TFieldStore<T> | undefined, field: keyof TFieldStore<T>, value: TFieldValue): TFieldStore<T> => {\r\n  const fieldValue: TFieldValue | undefined = storeFilter?.[field]\r\n  const values = Array.from(new Set([...(fieldValue?.values || []), ...value.values].filter(Boolean)))\r\n  const newData: TFieldValue = { values, logic: value.logic || fieldValue?.logic }\r\n  return Object.assign({}, storeFilter, { [field]: newData }) as TFieldStore<T>\r\n}\r\n\r\nexport const useFilterActions = <T>(context: IFilterBarContext<T>) => {\r\n  /**\r\n   * Add a filter value to the store for a specific field.\r\n   * @param field - The field to add the filter value to.\r\n   * @param value - The filter value to add.\r\n   * @returns void\r\n   */\r\n  const addFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    // Check for duplicate value before adding\r\n    const { storeFilter } = context.filterState\r\n    const valueObj: TFieldValue = { ...value, logic: options?.logic || value.logic }\r\n    // If the value already exists in the store for the field, do not add it again\r\n    if (checkDuplicateValue(storeFilter, field, valueObj)) return\r\n    // Merge the new value into the store filter for the field\r\n    const newData = mergeValueToStoreFilter(storeFilter, field, valueObj)\r\n    const newStoreFilter = Object.assign({}, storeFilter, newData)\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n  /**\r\n   * Replace all filter values for a specific field in the store with a new value.\r\n   * Value will be replaced instead of merged, which is useful for single-value filters or when you want to reset the filter values for a field.\r\n   * @param field - The field to update the filter value for.\r\n   * @param value - The new filter value to set.\r\n   */\r\n  const replaceFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    const valueObj: TFieldValue = { ...value, logic: options?.logic || value.logic }\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter, { [field]: valueObj })\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter as TFieldStore<T> })\r\n  }\r\n  /**\r\n   * Add multiple filter values to the store for a specific field, ensuring no duplicates are added.\r\n   * @param field - The field to add the filter values to.\r\n   * @param values - The filter values to add.\r\n   * @returns void\r\n   */\r\n  const upsertManyFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    // If there are no values to add, return early\r\n    if (value.values.length === 0) return\r\n    let newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    // Iterate through each value and add it to the store filter for the field, checking for duplicates\r\n    value.values.forEach((val) => {\r\n      const valueObj: TFieldValue = { values: [val], logic: options?.logic || value.logic }\r\n      if (checkDuplicateValue(newStoreFilter, field, valueObj)) return\r\n      newStoreFilter = mergeValueToStoreFilter(newStoreFilter, field, valueObj)\r\n    })\r\n    // Update the filter state with the new store filter after adding all values\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n  /**\r\n   * Remove all filter values for a specific field from the store.\r\n   * @param field - The field to remove filters from.\r\n   * @returns void\r\n   */\r\n  const removeFilter = (field: TFieldType<T>) => {\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    delete newStoreFilter[field]\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n\r\n  const removeFilterByFieldValue = (field: TFieldType<T>, value: TFieldValid) => {\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    const fieldVal: TFieldValue | undefined = newStoreFilter[field]\r\n    if (!fieldVal) return\r\n    newStoreFilter[field] = { ...fieldVal, values: fieldVal.values.filter((v) => v.toString() !== value.toString()) }\r\n    if (newStoreFilter[field] && newStoreFilter[field]!.values.length === 0) {\r\n      delete newStoreFilter[field]\r\n    }\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n\r\n  const clearAllFilters = () => {\r\n    context.setFilterState({ ...context.filterState, storeFilter: {} as TFieldStore<T> })\r\n  }\r\n\r\n  const getFieldInfo = (field: TFieldType<T>): TFieldValue | undefined => {\r\n    const fieldVal = context.filterState.storeFilter?.[field]\r\n    return fieldVal\r\n  }\r\n\r\n  const getTotalCount = (): number => {\r\n    const storeFilter = context.filterState.storeFilter\r\n    if (!storeFilter) return 0\r\n    const keys = Object.keys(storeFilter) as (keyof TFieldStore<T>)[]\r\n    return keys.reduce((acc, key) => {\r\n      const fieldVal = storeFilter[key]\r\n      return acc + (fieldVal ? fieldVal.values.length : 0)\r\n    }, 0)\r\n  }\r\n\r\n  const hasSortByField = (field: TFieldType<T>): boolean => {\r\n    const sort = context.filterState.storeSort\r\n    return sort?.field === field\r\n  }\r\n\r\n  const getSort = (): TFieldSort<T> | undefined => {\r\n    return context.filterState.storeSort\r\n  }\r\n\r\n  const changeSort = (field: TFieldType<T>) => {\r\n    const currentSort = context.filterState.storeSort\r\n    let newDirection: 'asc' | 'desc' = 'desc'\r\n    if (currentSort?.field === field) {\r\n      newDirection = currentSort.direction === 'desc' ? 'asc' : 'desc'\r\n    }\r\n    const newSort = { field, direction: newDirection }\r\n    context.setFilterState({ ...context.filterState, storeSort: newSort })\r\n  }\r\n\r\n  const removeSort = () => {\r\n    context.setFilterState({ ...context.filterState, storeSort: undefined })\r\n  }\r\n\r\n  return {\r\n    addFilter,\r\n    replaceFilter,\r\n    upsertManyFilter,\r\n    removeFilter,\r\n    removeFilterByFieldValue,\r\n    clearAllFilters,\r\n    getFieldInfo,\r\n    getTotalCount,\r\n    hasSortByField,\r\n    getSort,\r\n    changeSort,\r\n    removeSort\r\n  }\r\n}\r\n"],"names":["checkDuplicateValue","storeFilter","field","value","fieldValue","isLogicChange","logic","fieldSet","Set","values","map","v","JSON","stringify","filter","Boolean","some","has","mergeValueToStoreFilter","newData","Array","from","concat","_toConsumableArray","Object","assign","_defineProperty","useFilterActions","context","addFilter","options","filterState","valueObj","_objectSpread","newStoreFilter","setFilterState","replaceFilter","upsertManyFilter","length","forEach","val","removeFilter","removeFilterByFieldValue","fieldVal","toString","clearAllFilters","getFieldInfo","_context$filterState$","getTotalCount","keys","reduce","acc","key","hasSortByField","sort","storeSort","getSort","changeSort","currentSort","newDirection","direction","newSort","removeSort","undefined"],"mappings":"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"}

package/dist/src/filter-bar/components/popper-custom.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,objectSpread2 as t,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as r}from"react/jsx-runtime";import{useMemo as n}from"react";import{styled as a,Popper as l,Fade as d,Box as s,alpha as c,Typography as p,Tooltip as u,IconButton as m}from"@mui/material";import h from"@mui/icons-material/Close";var g=["children"],b=["title","children","onClose","disableGutter","disableMinMaxWidth","slots"],f=a(function(o){var n=o.children,a=e(o,g);return i(l,t(t({},a),{},{children:function(e){var o=e.TransitionProps;return i(d,t(t({},o),{},{timeout:350,children:r("div",{children:[" ",n]})}))}}))})(function(e){return{zIndex:e.theme.zIndex.modal+1,maxWidth:"100%"}}),x=function(o){var a=n(function(){return M},[]),l=o.title,d=o.children,s=o.onClose,c=o.disableGutter,g=o.disableMinMaxWidth,f=o.slots,x=e(o,b),C=[a.root];return c&&C.push(a.disableGutter),g&&C.push(a.disableMinMaxWidth),r(y,t(t({className:C.join(" ")},x),{},{children:[r("div",{className:a.header,children:[null==f?void 0:f.beforeTitle,i(p,{variant:"subtitle1",className:a.title,children:l||"Menu Title"}),null==f?void 0:f.afterTitle,i(u,{title:"Close",placement:"top",arrow:!0,children:i(m,{size:"small",className:a.buttonClose,onClick:s,children:i(h,{fontSize:"small"})})})]}),d]}))},C=function(e){var t=e.children;return i("div",{className:M.footer,children:t})},v=function(e){var t=e.children;return i("div",{className:M.body,children:t})},M={root:"DinoPopperCustom-root",body:"DinoPopperCustom-body",header:"DinoPopperCustom-header",footer:"DinoPopperCustom-footer",title:"DinoPopperCustom-title",buttonClose:"DinoPopperCustom-buttonClose",disableGutter:"DinoPopperCustom-disableGutter",disableMinMaxWidth:"DinoPopperCustom-disableMinMaxWidth"},y=a(s)(function(e){var t=e.theme;return o(o(o(o(o(o(o({},"&.".concat(M.root),o({borderRadius:t.shape.borderRadius,boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:t.palette.background.paper,overflow:"hidden"},"&:not(.".concat(M.disableMinMaxWidth,")"),{minWidth:"300px",maxWidth:"420px"})),".".concat(M.body),{padding:t.spacing(1),maxHeight:"70vh",overflow:"auto"}),".".concat(M.header),{display:"flex",alignItems:"center",justifyContent:"space-between",gap:t.spacing(.5),backgroundColor:t.palette.grey[900],padding:t.spacing(.5,1),color:t.palette.common.white}),".".concat(M.title),{fontSize:"0.875rem",fontWeight:600,lineHeight:1,flexGrow:1}),".".concat(M.buttonClose),{color:t.palette.common.white,transition:t.transitions.create("color"),".MuiSvgIcon-root":{transition:t.transitions.create("transform")},"&:hover":{color:t.palette.error.light,backgroundColor:c(t.palette.common.white,.1),".MuiSvgIcon-root":{transform:"rotate(90deg)"}}}),".".concat(M.footer),o({display:"flex",justifyContent:"flex-end",gap:t.spacing(1),borderTop:"1px solid ".concat(t.palette.grey[100]),padding:t.spacing(.5,1)},".MuiButtonBase-root",{textTransform:"none",fontWeight:500,lineHeight:1,padding:t.spacing(1,1.5)})),"&.".concat(M.disableGutter),o(o(o({},".".concat(M.body),{padding:0}),".".concat(M.header),{padding:t.spacing(.5,1)}),".".concat(M.footer),{padding:t.spacing(.5,1.5),margin:t.spacing(1,1,0)}))});export{v as PopperBody,x as PopperContent,f as PopperCustom,C as PopperFooter};
+import{objectWithoutProperties as e,objectSpread2 as t,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as n}from"react/jsx-runtime";import{useMemo as r}from"react";import{styled as a,Popper as l,Fade as d,Box as s,alpha as c,Typography as p,Tooltip as u,IconButton as m}from"@mui/material";import h from"@mui/icons-material/Close";var b=["children"],g=["title","children","onClose","disableGutter","disableMinMaxWidth","slots"],f=a(function(o){var r=o.children,a=e(o,b);return i(l,t(t({},a),{},{children:function(e){var o=e.TransitionProps;return i(d,t(t({},o),{},{timeout:350,children:n("div",{children:[" ",r]})}))}}))})(function(e){return{zIndex:e.theme.zIndex.modal+1,maxWidth:"100%"}}),x=function(o){var a=r(function(){return M},[]),l=o.title,d=o.children,s=o.onClose,c=o.disableGutter,b=o.disableMinMaxWidth,f=o.slots,x=e(o,g),v=[a.root];return c&&v.push(a.disableGutter),b&&v.push(a.disableMinMaxWidth),n(W,t(t({className:v.join(" ")},x),{},{children:[n("div",{className:a.header,children:[null==f?void 0:f.beforeTitle,i(p,{variant:"subtitle1",className:a.title,children:l||"Menu Title"}),null==f?void 0:f.afterTitle,i(u,{title:"Close",placement:"top",arrow:!0,children:i(m,{size:"small",className:a.buttonClose,onClick:s,children:i(h,{fontSize:"small"})})})]}),d]}))},v=function(e){var t=e.children;return i("div",{className:M.footer,children:t})},C=function(e){var t=e.children;return i("div",{className:M.body,children:t})},M={root:"DinoPopperCustom-root",body:"DinoPopperCustom-body",header:"DinoPopperCustom-header",footer:"DinoPopperCustom-footer",title:"DinoPopperCustom-title",buttonClose:"DinoPopperCustom-buttonClose",disableGutter:"DinoPopperCustom-disableGutter",disableMinMaxWidth:"DinoPopperCustom-disableMinMaxWidth"},W=a(s)(function(e){var t=e.theme;return o(o(o(o(o(o(o({},"&.".concat(M.root),o({borderRadius:t.shape.borderRadius,boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:t.palette.background.paper,overflow:"hidden"},"&:not(.".concat(M.disableMinMaxWidth,")"),o({minWidth:"350px",maxWidth:"550px"},t.breakpoints.down("sm"),{minWidth:"240px",maxWidth:"90vw"}))),".".concat(M.body),{padding:t.spacing(1),maxHeight:"70vh",overflow:"auto"}),".".concat(M.header),{display:"flex",alignItems:"center",justifyContent:"space-between",gap:t.spacing(.5),backgroundColor:t.palette.grey[900],padding:t.spacing(.5,1),color:t.palette.common.white}),".".concat(M.title),{fontSize:"0.875rem",fontWeight:600,lineHeight:1,flexGrow:1}),".".concat(M.buttonClose),{color:t.palette.common.white,transition:t.transitions.create("color"),".MuiSvgIcon-root":{transition:t.transitions.create("transform")},"&:hover":{color:t.palette.error.light,backgroundColor:c(t.palette.common.white,.1),".MuiSvgIcon-root":{transform:"rotate(90deg)"}}}),".".concat(M.footer),o({display:"flex",justifyContent:"flex-end",gap:t.spacing(1),borderTop:"1px solid ".concat(t.palette.grey[100]),padding:t.spacing(.5,1)},".MuiButtonBase-root",{textTransform:"none",fontWeight:500,lineHeight:1,padding:t.spacing(1,1.5)})),"&.".concat(M.disableGutter),o(o(o({},".".concat(M.body),{padding:0}),".".concat(M.header),{padding:t.spacing(.5,1)}),".".concat(M.footer),{padding:t.spacing(.5,1.5),margin:t.spacing(1,1,0)}))});export{C as PopperBody,x as PopperContent,f as PopperCustom,v as PopperFooter};
 //# sourceMappingURL=popper-custom.js.map

package/dist/src/filter-bar/components/popper-custom.js.map

@@ -1 +1 @@
-{"version":3,"file":"popper-custom.js","sources":["../../../../src/filter-bar/components/popper-custom.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useMemo, useState } from 'react'\r\nimport { alpha, Box, Fade, IconButton, Popper, styled, Tooltip, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\n// types\r\nimport type { FC, PropsWithChildren } from 'react'\r\nimport type { BoxProps, ButtonProps, PopperProps } from '@mui/material'\r\n\r\nexport const usePopperState = () => {\r\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n  const isOpen = Boolean(anchorEl)\r\n\r\n  const handleToggle: React.MouseEventHandler<HTMLElement> = (event) => {\r\n    setAnchorEl((prev) => (prev ? null : event.currentTarget))\r\n  }\r\n\r\n  const handleClose = () => {\r\n    setAnchorEl(null)\r\n  }\r\n\r\n  return { anchorEl, isOpen, handleToggle, handleClose }\r\n}\r\n\r\ninterface IPopperProps extends Omit<PopperProps, 'children'>, PropsWithChildren {}\r\n\r\nexport const PopperCustom = styled(({ children, ...props }: IPopperProps) => (\r\n  <Popper {...props}>\r\n    {({ TransitionProps }) => (\r\n      <Fade {...TransitionProps} timeout={350}>\r\n        <div> {children}</div>\r\n      </Fade>\r\n    )}\r\n  </Popper>\r\n))(({ theme }) => ({\r\n  zIndex: theme.zIndex.modal + 1,\r\n  maxWidth: '100%'\r\n}))\r\n\r\nexport interface PopperContentProps extends BoxProps {\r\n  sx?: BoxProps['sx']\r\n  title?: string\r\n  children: React.ReactNode\r\n  onClose?: ButtonProps['onClick']\r\n  disableGutter?: boolean\r\n  disableMinMaxWidth?: boolean\r\n  slots?: {\r\n    afterTitle?: React.ReactNode\r\n    beforeTitle?: React.ReactNode\r\n  }\r\n}\r\n\r\nexport const PopperContent: FC<PopperContentProps> = (props) => {\r\n  const classes = useMemo(() => popperCustomClasses, [])\r\n  const { title, children, onClose, disableGutter, disableMinMaxWidth, slots, ...rest } = props\r\n\r\n  const rootClasses = [classes.root]\r\n  if (disableGutter) rootClasses.push(classes.disableGutter)\r\n  if (disableMinMaxWidth) rootClasses.push(classes.disableMinMaxWidth)\r\n\r\n  return (\r\n    <PopperContentStyled className={rootClasses.join(' ')} {...rest}>\r\n      <div className={classes.header}>\r\n        {slots?.beforeTitle}\r\n        <Typography variant='subtitle1' className={classes.title}>\r\n          {title || 'Menu Title'}\r\n        </Typography>\r\n        {slots?.afterTitle}\r\n        <Tooltip title='Close' placement='top' arrow>\r\n          <IconButton size='small' className={classes.buttonClose} onClick={onClose}>\r\n            <CloseIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      </div>\r\n      {children}\r\n    </PopperContentStyled>\r\n  )\r\n}\r\n\r\nexport const PopperFooter: FC<Required<PropsWithChildren>> = ({ children }) => {\r\n  return <div className={popperCustomClasses.footer}>{children}</div>\r\n}\r\n\r\nexport const PopperBody: FC<Required<PropsWithChildren>> = ({ children }) => {\r\n  return <div className={popperCustomClasses.body}>{children}</div>\r\n}\r\n\r\nconst popperCustomClasses = {\r\n  root: 'DinoPopperCustom-root',\r\n  body: 'DinoPopperCustom-body',\r\n  header: 'DinoPopperCustom-header',\r\n  footer: 'DinoPopperCustom-footer',\r\n  title: 'DinoPopperCustom-title',\r\n  buttonClose: 'DinoPopperCustom-buttonClose',\r\n  disableGutter: 'DinoPopperCustom-disableGutter',\r\n  disableMinMaxWidth: 'DinoPopperCustom-disableMinMaxWidth'\r\n}\r\n\r\nconst PopperContentStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${popperCustomClasses.root}`]: {\r\n    borderRadius: theme.shape.borderRadius,\r\n    boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n    backgroundColor: theme.palette.background.paper,\r\n    overflow: 'hidden',\r\n    [`&:not(.${popperCustomClasses.disableMinMaxWidth})`]: {\r\n      minWidth: '300px',\r\n      maxWidth: '420px'\r\n    }\r\n  },\r\n  [`.${popperCustomClasses.body}`]: {\r\n    padding: theme.spacing(1),\r\n    maxHeight: '70vh',\r\n    overflow: 'auto'\r\n  },\r\n  [`.${popperCustomClasses.header}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'space-between',\r\n    gap: theme.spacing(0.5),\r\n    backgroundColor: theme.palette.grey[900],\r\n    padding: theme.spacing(0.5, 1),\r\n    color: theme.palette.common.white\r\n  },\r\n  [`.${popperCustomClasses.title}`]: {\r\n    fontSize: '0.875rem',\r\n    fontWeight: 600,\r\n    lineHeight: 1,\r\n    flexGrow: 1\r\n  },\r\n  [`.${popperCustomClasses.buttonClose}`]: {\r\n    color: theme.palette.common.white,\r\n    transition: theme.transitions.create('color'),\r\n    '.MuiSvgIcon-root': { transition: theme.transitions.create('transform') },\r\n    '&:hover': {\r\n      color: theme.palette.error.light,\r\n      backgroundColor: alpha(theme.palette.common.white, 0.1),\r\n      '.MuiSvgIcon-root': { transform: 'rotate(90deg)' }\r\n    }\r\n  },\r\n  [`.${popperCustomClasses.footer}`]: {\r\n    display: 'flex',\r\n    justifyContent: 'flex-end',\r\n    gap: theme.spacing(1),\r\n    borderTop: `1px solid ${theme.palette.grey[100]}`,\r\n    padding: theme.spacing(0.5, 1),\r\n    [`.MuiButtonBase-root`]: {\r\n      textTransform: 'none',\r\n      fontWeight: 500,\r\n      lineHeight: 1,\r\n      padding: theme.spacing(1, 1.5)\r\n    }\r\n  },\r\n  [`&.${popperCustomClasses.disableGutter}`]: {\r\n    [`.${popperCustomClasses.body}`]: { padding: 0 },\r\n    [`.${popperCustomClasses.header}`]: { padding: theme.spacing(0.5, 1) },\r\n    [`.${popperCustomClasses.footer}`]: { padding: theme.spacing(0.5, 1.5), margin: theme.spacing(1, 1, 0) }\r\n  }\r\n}))\r\n"],"names":["PopperCustom","styled","_ref","children","props","_objectWithoutProperties","_excluded","_jsx","Popper","_objectSpread","_ref2","TransitionProps","Fade","timeout","_jsxs","_ref3","zIndex","theme","modal","maxWidth","PopperContent","classes","useMemo","popperCustomClasses","title","onClose","disableGutter","disableMinMaxWidth","slots","rest","_excluded2","rootClasses","root","push","PopperContentStyled","className","join","header","beforeTitle","Typography","variant","afterTitle","Tooltip","placement","arrow","IconButton","size","buttonClose","onClick","CloseIcon","fontSize","PopperFooter","_ref4","footer","PopperBody","_ref5","body","Box","_ref6","_defineProperty","concat","borderRadius","shape","boxShadow","backgroundColor","palette","background","paper","overflow","minWidth","padding","spacing","maxHeight","display","alignItems","justifyContent","gap","grey","color","common","white","fontWeight","lineHeight","flexGrow","transition","transitions","create","error","light","alpha","transform","borderTop","textTransform","margin"],"mappings":"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"}
+{"version":3,"file":"popper-custom.js","sources":["../../../../src/filter-bar/components/popper-custom.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useMemo, useState } from 'react'\r\nimport { alpha, Box, Fade, IconButton, Popper, styled, Tooltip, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\n// types\r\nimport type { FC, PropsWithChildren } from 'react'\r\nimport type { BoxProps, ButtonProps, PopperProps } from '@mui/material'\r\n\r\nexport const usePopperState = () => {\r\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n  const isOpen = Boolean(anchorEl)\r\n\r\n  const handleToggle: React.MouseEventHandler<HTMLElement> = (event) => {\r\n    setAnchorEl((prev) => (prev ? null : event.currentTarget))\r\n  }\r\n\r\n  const handleClose = () => {\r\n    setAnchorEl(null)\r\n  }\r\n\r\n  return { anchorEl, isOpen, handleToggle, handleClose }\r\n}\r\n\r\ninterface IPopperProps extends Omit<PopperProps, 'children'>, PropsWithChildren {}\r\n\r\nexport const PopperCustom = styled(({ children, ...props }: IPopperProps) => (\r\n  <Popper {...props}>\r\n    {({ TransitionProps }) => (\r\n      <Fade {...TransitionProps} timeout={350}>\r\n        <div> {children}</div>\r\n      </Fade>\r\n    )}\r\n  </Popper>\r\n))(({ theme }) => ({\r\n  zIndex: theme.zIndex.modal + 1,\r\n  maxWidth: '100%'\r\n}))\r\n\r\nexport interface PopperContentProps extends BoxProps {\r\n  sx?: BoxProps['sx']\r\n  title?: string\r\n  children: React.ReactNode\r\n  onClose?: ButtonProps['onClick']\r\n  disableGutter?: boolean\r\n  disableMinMaxWidth?: boolean\r\n  slots?: {\r\n    afterTitle?: React.ReactNode\r\n    beforeTitle?: React.ReactNode\r\n  }\r\n}\r\n\r\nexport const PopperContent: FC<PopperContentProps> = (props) => {\r\n  const classes = useMemo(() => popperCustomClasses, [])\r\n  const { title, children, onClose, disableGutter, disableMinMaxWidth, slots, ...rest } = props\r\n\r\n  const rootClasses = [classes.root]\r\n  if (disableGutter) rootClasses.push(classes.disableGutter)\r\n  if (disableMinMaxWidth) rootClasses.push(classes.disableMinMaxWidth)\r\n\r\n  return (\r\n    <PopperContentStyled className={rootClasses.join(' ')} {...rest}>\r\n      <div className={classes.header}>\r\n        {slots?.beforeTitle}\r\n        <Typography variant='subtitle1' className={classes.title}>\r\n          {title || 'Menu Title'}\r\n        </Typography>\r\n        {slots?.afterTitle}\r\n        <Tooltip title='Close' placement='top' arrow>\r\n          <IconButton size='small' className={classes.buttonClose} onClick={onClose}>\r\n            <CloseIcon fontSize='small' />\r\n          </IconButton>\r\n        </Tooltip>\r\n      </div>\r\n      {children}\r\n    </PopperContentStyled>\r\n  )\r\n}\r\n\r\nexport const PopperFooter: FC<Required<PropsWithChildren>> = ({ children }) => {\r\n  return <div className={popperCustomClasses.footer}>{children}</div>\r\n}\r\n\r\nexport const PopperBody: FC<Required<PropsWithChildren>> = ({ children }) => {\r\n  return <div className={popperCustomClasses.body}>{children}</div>\r\n}\r\n\r\nconst popperCustomClasses = {\r\n  root: 'DinoPopperCustom-root',\r\n  body: 'DinoPopperCustom-body',\r\n  header: 'DinoPopperCustom-header',\r\n  footer: 'DinoPopperCustom-footer',\r\n  title: 'DinoPopperCustom-title',\r\n  buttonClose: 'DinoPopperCustom-buttonClose',\r\n  disableGutter: 'DinoPopperCustom-disableGutter',\r\n  disableMinMaxWidth: 'DinoPopperCustom-disableMinMaxWidth'\r\n}\r\n\r\nconst PopperContentStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${popperCustomClasses.root}`]: {\r\n    borderRadius: theme.shape.borderRadius,\r\n    boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n    backgroundColor: theme.palette.background.paper,\r\n    overflow: 'hidden',\r\n    [`&:not(.${popperCustomClasses.disableMinMaxWidth})`]: {\r\n      minWidth: '350px',\r\n      maxWidth: '550px',\r\n      [theme.breakpoints.down('sm')]: {\r\n        minWidth: '240px',\r\n        maxWidth: '90vw'\r\n      }\r\n    }\r\n  },\r\n  [`.${popperCustomClasses.body}`]: {\r\n    padding: theme.spacing(1),\r\n    maxHeight: '70vh',\r\n    overflow: 'auto'\r\n  },\r\n  [`.${popperCustomClasses.header}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'space-between',\r\n    gap: theme.spacing(0.5),\r\n    backgroundColor: theme.palette.grey[900],\r\n    padding: theme.spacing(0.5, 1),\r\n    color: theme.palette.common.white\r\n  },\r\n  [`.${popperCustomClasses.title}`]: {\r\n    fontSize: '0.875rem',\r\n    fontWeight: 600,\r\n    lineHeight: 1,\r\n    flexGrow: 1\r\n  },\r\n  [`.${popperCustomClasses.buttonClose}`]: {\r\n    color: theme.palette.common.white,\r\n    transition: theme.transitions.create('color'),\r\n    '.MuiSvgIcon-root': { transition: theme.transitions.create('transform') },\r\n    '&:hover': {\r\n      color: theme.palette.error.light,\r\n      backgroundColor: alpha(theme.palette.common.white, 0.1),\r\n      '.MuiSvgIcon-root': { transform: 'rotate(90deg)' }\r\n    }\r\n  },\r\n  [`.${popperCustomClasses.footer}`]: {\r\n    display: 'flex',\r\n    justifyContent: 'flex-end',\r\n    gap: theme.spacing(1),\r\n    borderTop: `1px solid ${theme.palette.grey[100]}`,\r\n    padding: theme.spacing(0.5, 1),\r\n    [`.MuiButtonBase-root`]: {\r\n      textTransform: 'none',\r\n      fontWeight: 500,\r\n      lineHeight: 1,\r\n      padding: theme.spacing(1, 1.5)\r\n    }\r\n  },\r\n  [`&.${popperCustomClasses.disableGutter}`]: {\r\n    [`.${popperCustomClasses.body}`]: { padding: 0 },\r\n    [`.${popperCustomClasses.header}`]: { padding: theme.spacing(0.5, 1) },\r\n    [`.${popperCustomClasses.footer}`]: { padding: theme.spacing(0.5, 1.5), margin: theme.spacing(1, 1, 0) }\r\n  }\r\n}))\r\n"],"names":["PopperCustom","styled","_ref","children","props","_objectWithoutProperties","_excluded","_jsx","Popper","_objectSpread","_ref2","TransitionProps","Fade","timeout","_jsxs","_ref3","zIndex","theme","modal","maxWidth","PopperContent","classes","useMemo","popperCustomClasses","title","onClose","disableGutter","disableMinMaxWidth","slots","rest","_excluded2","rootClasses","root","push","PopperContentStyled","className","join","header","beforeTitle","Typography","variant","afterTitle","Tooltip","placement","arrow","IconButton","size","buttonClose","onClick","CloseIcon","fontSize","PopperFooter","_ref4","footer","PopperBody","_ref5","body","Box","_ref6","_defineProperty","concat","borderRadius","shape","boxShadow","backgroundColor","palette","background","paper","overflow","minWidth","breakpoints","down","padding","spacing","maxHeight","display","alignItems","justifyContent","gap","grey","color","common","white","fontWeight","lineHeight","flexGrow","transition","transitions","create","error","light","alpha","transform","borderTop","textTransform","margin"],"mappings":"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"}

package/dist/src/filter-bar/convert-to-graphql.js

@@ -1,2 +1,2 @@
-import{createClass as t,classCallCheck as r,defineProperty as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{createRequestBuilder as i}from"../http-service/graphql/request-param.js";var l=function(t){return"or"===t?"Or":"And"},o=function(t){return"asc"===t?"ASC":"DESC"},n=function(){return t(function t(l){var o=this;r(this,t),e(this,"graphqlBuilder",i({ignoreEmpty:!0})),e(this,"autoMap",function(t){(o.currentObjectMap=t,o.state.storeFilter)&&Object.keys(o.state.storeFilter).forEach(function(r){var e,i=t[r],l=null===(e=o.state.storeFilter)||void 0===e?void 0:e[r];if(i){var n=i.targetfield,a=i.operation;if(i.custom)return void i.custom(o.graphqlBuilder,l,o.state.storeFilter);"equal"===a?o.fillterEqual(r,n):"contains"===a&&o.fillterContains(r,n)}});if(o.state.storeSort){var r,e=o.state.storeSort.field;o.sort(e,null===(r=t[e])||void 0===r?void 0:r.targetfield)}return o}),e(this,"prebuild",function(t){return o.prebuildFunc=t,o}),this.state=l},[{key:"filterScope",value:function(t,r){var e=this;if(this.state.storeFilter){var i=(null==r?void 0:r.logic)||this.state.filterLogic||"and",o=l(i);this.graphqlBuilder.scope(function(r){return t(r,e.state.storeFilter),r},{logic:o})}return this}},{key:"fillterEqual",value:function(t,r,e){var i,o,n=null!==(i=null===(o=this.state.storeFilter)||void 0===o?void 0:o[t])&&void 0!==i?i:{values:[]},a=Array.isArray(n.values)?n.values:[n.values];if(!a||a.length<1||!r)return this;var s=l(n.logic);return this.filterScope(function(t,e){for(var i=0;i<a.length;i++){var l=a[i];"string"==typeof l?t.filter(r,l,{logic:s}):("number"==typeof l||"boolean"==typeof l)&&t.filter(r,l.toString(),{logic:s})}},e),this}},{key:"fillterContains",value:function(t,r,e){var i,o,n=null!==(i=null===(o=this.state.storeFilter)||void 0===o?void 0:o[t])&&void 0!==i?i:{values:[]},a=Array.isArray(n.values)?n.values:[n.values];if(!a||a.length<1||!r)return this;var s=l(n.logic);return this.filterScope(function(t){for(var e=0;e<a.length;e++){var i=a[e];"string"==typeof i?t.filterContains(r,i,{logic:s}):("number"==typeof i||"boolean"==typeof i)&&t.filter(r,i.toString(),{logic:s})}},e),this}},{key:"sort",value:function(t,r){var e=this.state.storeSort;return console.log("sortConfig",{sortStore:e,field:t,targetField:r}),r&&e&&e.field===t?(this.graphqlBuilder.sort(r,{direction:o(e.direction)}),this):this}},{key:"quickSearch",value:function(t){var r,e,i=this;this.currentObjectMap||console.warn("No autoMap config found, quick search will not work properly without target field mapping.");var o=null!==(r=null===(e=this.state.storeFilter)||void 0===e?void 0:e.quickSearch)&&void 0!==r?r:{values:[],logic:"or"},n=Array.isArray(o.values)?o.values:[o.values];if(!n||n.length<1)return this;var a=l(o.logic),s=Array.isArray(t)?t:[t];return this.filterScope(function(t){s.forEach(function(r){var e,l=null===(e=i.currentObjectMap)||void 0===e?void 0:e[r];if(l&&n&&n.length>0)if(l.custom)l.custom(t,o,i.state.storeFilter);else if(l.targetfield)for(var s=0;s<n.length;s++){var u=n[s];"string"==typeof u?t.filterContains(l.targetfield,u,{logic:a}):("number"==typeof u||"boolean"==typeof u)&&t.filter(l.targetfield,u.toString(),{logic:a})}})}),this}},{key:"build",value:function(){return this.prebuildFunc&&this.prebuildFunc(this.graphqlBuilder),this.graphqlBuilder.build()}}])}(),a=function(t){return new n(t)};export{n as TableFileterConverter,a as createConvertToGraphQL,l as mapLogic,o as mapSortDirection};
+import{createClass as t,classCallCheck as r,defineProperty as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{createRequestBuilder as i}from"../http-service/graphql/request-param.js";var l=function(t){return"or"===t?"Or":"And"},o=function(t){return"asc"===t?"ASC":"DESC"},a=function(){return t(function t(l){var o=this;r(this,t),e(this,"graphqlBuilder",i({ignoreEmpty:!0})),e(this,"autoMap",function(t){(o.currentObjectMap=t,o.state.storeFilter)&&Object.keys(o.state.storeFilter).forEach(function(r){var e,i=t[r],l=null===(e=o.state.storeFilter)||void 0===e?void 0:e[r];if(i){var a=i.targetfield,n=i.operation;if(i.custom)return void i.custom(o.graphqlBuilder,l,o.state.storeFilter);"equal"===n?o.fillterEqual(r,a):"contains"===n&&o.fillterContains(r,a)}});if(o.state.storeSort){var r,e=o.state.storeSort.field;o.sort(e,null===(r=t[e])||void 0===r?void 0:r.targetfield)}return o}),e(this,"prebuild",function(t){return o.prebuildFunc=t,o}),this.state=l},[{key:"filterScope",value:function(t,r){var e=this;if(this.state.storeFilter){var i=(null==r?void 0:r.logic)||this.state.filterLogic||"and",o=l(i);this.graphqlBuilder.scope(function(r){return t(r,e.state.storeFilter),r},{logic:o})}return this}},{key:"fillterEqual",value:function(t,r,e){var i,o,a=null!==(i=null===(o=this.state.storeFilter)||void 0===o?void 0:o[t])&&void 0!==i?i:{values:[]},n=Array.isArray(a.values)?a.values:[a.values];if(!n||n.length<1||!r)return this;var s=l(a.logic);return this.filterScope(function(t,e){for(var i=0;i<n.length;i++){var l=n[i];"string"==typeof l?t.filter(r,l,{logic:s}):("number"==typeof l||"boolean"==typeof l)&&t.filter(r,l.toString(),{logic:s})}},e),this}},{key:"fillterContains",value:function(t,r,e){var i,o,a=null!==(i=null===(o=this.state.storeFilter)||void 0===o?void 0:o[t])&&void 0!==i?i:{values:[]},n=Array.isArray(a.values)?a.values:[a.values];if(!n||n.length<1||!r)return this;var s=l(a.logic);return this.filterScope(function(t){for(var e=0;e<n.length;e++){var i=n[e];"string"==typeof i?t.filterContains(r,i,{logic:s}):("number"==typeof i||"boolean"==typeof i)&&t.filter(r,i.toString(),{logic:s})}},e),this}},{key:"sort",value:function(t,r){var e=this.state.storeSort;return r&&e&&e.field===t?(this.graphqlBuilder.sort(r,{direction:o(e.direction)}),this):this}},{key:"quickSearch",value:function(t){var r,e,i=this;this.currentObjectMap||console.warn("No autoMap config found, quick search will not work properly without target field mapping.");var o=null!==(r=null===(e=this.state.storeFilter)||void 0===e?void 0:e.quickSearch)&&void 0!==r?r:{values:[],logic:"or"},a=Array.isArray(o.values)?o.values:[o.values];if(!a||a.length<1)return this;var n=l(o.logic),s=Array.isArray(t)?t:[t];return this.filterScope(function(t){s.forEach(function(r){var e,l=null===(e=i.currentObjectMap)||void 0===e?void 0:e[r];if(l&&a&&a.length>0)if(l.custom)l.custom(t,o,i.state.storeFilter);else if(l.targetfield)for(var s=0;s<a.length;s++){var u=a[s];"string"==typeof u?t.filterContains(l.targetfield,u,{logic:n}):("number"==typeof u||"boolean"==typeof u)&&t.filter(l.targetfield,u.toString(),{logic:n})}})}),this}},{key:"build",value:function(){return this.prebuildFunc&&this.prebuildFunc(this.graphqlBuilder),this.graphqlBuilder.build()}}])}(),n=function(t){return new a(t)};export{a as TableFileterConverter,n as createConvertToGraphQL,l as mapLogic,o as mapSortDirection};
 //# sourceMappingURL=convert-to-graphql.js.map

package/dist/src/filter-bar/convert-to-graphql.js.map

@@ -1 +1 @@
-{"version":3,"file":"convert-to-graphql.js","sources":["../../../src/filter-bar/convert-to-graphql.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRequestBuilder, RequestParam } from '../http-service/graphql/request-param'\r\n// types\r\nimport { TFilterState, TFieldStore, TFieldValue, TLogic, TDirection, TFieldType } from './types'\r\n\r\ntype TFilterScopeFn<TSource, TTarget extends object> = (currentBuilder: RequestParam<TTarget>, store?: TFieldStore<TSource>) => void\r\n\r\n/**\r\n * @en\r\n * - Utility class to convert filter state from a filter bar into a GraphQL query builder.\r\n * - Supports mapping filter fields to different GraphQL fields, custom filter logic, and sorting.\r\n * @vi\r\n * - Lớp tiện ích để chuyển đổi trạng thái filter từ filter bar thành builder truy vấn GraphQL.\r\n * - Hỗ trợ ánh xạ các trường filter sang các trường GraphQL khác, logic filter tùy chỉnh và sắp xếp.\r\n */\r\ntype TAutoMapFieldCustomFn<TSource, TTarget extends object> = (\r\n  currentBuilder: RequestParam<TTarget>,\r\n  value?: NonNullable<TFieldStore<TSource>>[keyof TFieldStore<TSource>],\r\n  store?: TFieldStore<TSource>\r\n) => void\r\n\r\ntype TAutoMapConfig<TSource, TTarget extends object> = {\r\n  targetfield?: keyof TTarget\r\n  operation?: 'equal' | 'contains'\r\n  /**\r\n   * @en\r\n   * - Custom function to apply complex filter logic that doesn't fit standard 'equal' or 'contains' operations.\r\n   * - Receives the current GraphQL builder, the value of the filter field, and the entire filter store for context.\r\n   * @vi\r\n   * - Hàm tùy chỉnh để áp dụng logic filter phức tạp không phù hợp với các thao tác 'equal' hoặc 'contains' tiêu chuẩn.\r\n   * - Nhận builder GraphQL hiện tại, giá trị của trường filter và toàn bộ store filter để có ngữ cảnh.\r\n   */\r\n  custom?: TAutoMapFieldCustomFn<TSource, TTarget>\r\n}\r\n\r\ntype TAutoMapConfigs<TSource, TTarget extends object> = Partial<Record<keyof TSource, TAutoMapConfig<TSource, TTarget>>>\r\n\r\ntype TFilterOption = {\r\n  logic?: TLogic\r\n}\r\n\r\nexport const mapLogic = (logic?: TLogic): 'And' | 'Or' => {\r\n  return logic === 'or' ? 'Or' : 'And'\r\n}\r\n\r\nexport const mapSortDirection = (direction?: TDirection): 'ASC' | 'DESC' => {\r\n  return direction === 'asc' ? 'ASC' : 'DESC'\r\n}\r\n\r\nexport class TableFileterConverter<TSource extends Record<string, any>, TTarget extends object> {\r\n  private state: TFilterState<TSource>\r\n  constructor(state: TFilterState<TSource>) {\r\n    this.state = state\r\n  }\r\n  private graphqlBuilder = createRequestBuilder<TTarget>({ ignoreEmpty: true })\r\n  filterScope(fn: TFilterScopeFn<TSource, TTarget>, options?: TFilterOption) {\r\n    if (this.state.storeFilter) {\r\n      const mergedLogic = options?.logic || this.state.filterLogic || 'and'\r\n      const logic = mapLogic(mergedLogic)\r\n      this.graphqlBuilder.scope(\r\n        (b) => {\r\n          fn(b, this.state.storeFilter)\r\n          return b\r\n        },\r\n        { logic }\r\n      )\r\n    }\r\n    return this\r\n  }\r\n  fillterEqual(field: TFieldType<TSource>, targetField?: keyof TTarget, options?: TFilterOption) {\r\n    const fieldValue: TFieldValue = this.state.storeFilter?.[field] ?? { values: [] }\r\n    const values = Array.isArray(fieldValue.values) ? fieldValue.values : [fieldValue.values]\r\n    const isValueEmpty = !values || values.length < 1\r\n    if (isValueEmpty || !targetField) return this\r\n\r\n    const logic = mapLogic(fieldValue.logic)\r\n    const fn: TFilterScopeFn<TSource, TTarget> = (builder, value) => {\r\n      for (let index = 0; index < values.length; index++) {\r\n        const element = values[index]\r\n        if (typeof element === 'string') {\r\n          builder.filter(targetField, element, { logic })\r\n        } else if (typeof element === 'number') {\r\n          //TODO: for number type, we can only do equal filter, so we treat it as equal filter\r\n          builder.filter(targetField, element.toString(), { logic })\r\n        } else if (typeof element === 'boolean') {\r\n          //TODO: for boolean type, we also treat it as equal filter\r\n          builder.filter(targetField, element.toString(), { logic })\r\n        }\r\n      }\r\n    }\r\n    this.filterScope(fn, options)\r\n    return this\r\n  }\r\n  fillterContains(field: TFieldType<TSource>, targetField?: keyof TTarget, options?: TFilterOption) {\r\n    const fieldValue: TFieldValue = this.state.storeFilter?.[field] ?? { values: [] }\r\n    const values = Array.isArray(fieldValue.values) ? fieldValue.values : [fieldValue.values]\r\n    const isValueEmpty = !values || values.length < 1\r\n    if (isValueEmpty || !targetField) return this\r\n\r\n    const finalLogic = mapLogic(fieldValue.logic)\r\n    const fn: TFilterScopeFn<TSource, TTarget> = (builder) => {\r\n      for (let index = 0; index < values.length; index++) {\r\n        const val = values[index]\r\n        if (typeof val === 'string') {\r\n          builder.filterContains(targetField, val, { logic: finalLogic })\r\n        } else if (typeof val === 'number') {\r\n          //TODO: for number type, we can only do equal filter, so we treat it as equal filter\r\n          builder.filter(targetField, val.toString(), { logic: finalLogic })\r\n        } else if (typeof val === 'boolean') {\r\n          //TODO: for boolean type, we also treat it as equal filter\r\n          builder.filter(targetField, val.toString(), { logic: finalLogic })\r\n        }\r\n      }\r\n    }\r\n    this.filterScope(fn, options)\r\n    return this\r\n  }\r\n  sort(field: TFieldType<TSource>, targetField?: keyof TTarget) {\r\n    const store = this.state.storeSort\r\n    console.log('sortConfig', { sortStore: store, field, targetField })\r\n\r\n    if (!targetField || !store || store.field !== field) return this\r\n\r\n    this.graphqlBuilder.sort(targetField, { direction: mapSortDirection(store.direction) })\r\n    return this\r\n  }\r\n  quickSearch(fields: TFieldType<TSource> | TFieldType<TSource>[]) {\r\n    if (!this.currentObjectMap) {\r\n      console.warn('No autoMap config found, quick search will not work properly without target field mapping.')\r\n    }\r\n    const fieldValue: TFieldValue = this.state.storeFilter?.quickSearch ?? { values: [], logic: 'or' }\r\n    const values = Array.isArray(fieldValue.values) ? fieldValue.values : [fieldValue.values]\r\n    const isValueEmpty = !values || values.length < 1\r\n    if (isValueEmpty) return this\r\n\r\n    const logic = mapLogic(fieldValue.logic)\r\n    const targetFields = Array.isArray(fields) ? fields : [fields]\r\n    const fn: TFilterScopeFn<TSource, TTarget> = (builder) => {\r\n      targetFields.forEach((field) => {\r\n        const fieldMap = this.currentObjectMap?.[field]\r\n        if (fieldMap && values && values.length > 0) {\r\n          if (fieldMap.custom) {\r\n            fieldMap.custom(builder, fieldValue, this.state.storeFilter)\r\n          } else if (fieldMap.targetfield) {\r\n            for (let index = 0; index < values.length; index++) {\r\n              const element = values[index]\r\n              if (typeof element === 'string') {\r\n                builder.filterContains(fieldMap.targetfield, element, { logic })\r\n              } else if (typeof element === 'number') {\r\n                builder.filter(fieldMap.targetfield, element.toString(), { logic })\r\n              } else if (typeof element === 'boolean') {\r\n                builder.filter(fieldMap.targetfield, element.toString(), { logic })\r\n              }\r\n            }\r\n          }\r\n        }\r\n      })\r\n    }\r\n    this.filterScope(fn)\r\n    return this\r\n  }\r\n  private currentObjectMap?: TAutoMapConfigs<TSource, TTarget>\r\n  autoMap = (objMap: TAutoMapConfigs<TSource, TTarget>) => {\r\n    this.currentObjectMap = objMap\r\n\r\n    if (this.state.storeFilter) {\r\n      const keys = Object.keys(this.state.storeFilter) as (keyof TFieldStore<TSource>)[]\r\n      // filter the keys that exist in objMap\r\n      keys.forEach((key) => {\r\n        const mapConfig = objMap[key]\r\n        const fieldValue: TFieldValue | undefined = this.state.storeFilter?.[key]\r\n        if (mapConfig) {\r\n          const { targetfield, operation } = mapConfig\r\n          if (mapConfig.custom) {\r\n            mapConfig.custom(this.graphqlBuilder, fieldValue, this.state.storeFilter)\r\n            return // skip the rest logic if custom function is provided\r\n          }\r\n          if (operation === 'equal') {\r\n            this.fillterEqual(key, targetfield)\r\n          } else if (operation === 'contains') {\r\n            this.fillterContains(key, targetfield)\r\n          }\r\n        }\r\n      })\r\n    }\r\n\r\n    //sort the field if exist in storeSort\r\n    if (this.state.storeSort) {\r\n      const sortKey: TFieldType<TSource> = this.state.storeSort.field\r\n      this.sort(sortKey, objMap[sortKey]?.targetfield)\r\n    }\r\n\r\n    return this\r\n  }\r\n  private prebuildFunc?: (rp: RequestParam<TTarget>) => RequestParam<TTarget>\r\n  prebuild = (func: (requestParam: RequestParam<TTarget>) => RequestParam<TTarget>) => {\r\n    this.prebuildFunc = func\r\n    return this\r\n  }\r\n\r\n  build() {\r\n    if (this.prebuildFunc) this.prebuildFunc(this.graphqlBuilder)\r\n    return this.graphqlBuilder.build()\r\n  }\r\n}\r\n\r\nexport const createConvertToGraphQL = <TSource extends Record<string, any>, TTarget extends object>(state: TFilterState<TSource>) => {\r\n  return new TableFileterConverter<TSource, TTarget>(state)\r\n}\r\n"],"names":["mapLogic","logic","mapSortDirection","direction","TableFileterConverter","_createClass","state","_this","this","_classCallCheck","_defineProperty","createRequestBuilder","ignoreEmpty","objMap","currentObjectMap","storeFilter","Object","keys","forEach","key","_this$state$storeFilt","mapConfig","fieldValue","targetfield","operation","custom","graphqlBuilder","fillterEqual","fillterContains","storeSort","_objMap$sortKey","sortKey","field","sort","func","prebuildFunc","value","fn","options","_this2","mergedLogic","filterLogic","scope","b","targetField","_this$state$storeFilt2","_this$state$storeFilt3","values","Array","isArray","length","filterScope","builder","index","element","filter","toString","_this$state$storeFilt4","_this$state$storeFilt5","finalLogic","val","filterContains","store","console","log","sortStore","fields","_this$state$storeFilt6","_this$state$storeFilt7","_this3","warn","quickSearch","targetFields","_this3$currentObjectM","fieldMap","build","createConvertToGraphQL"],"mappings":"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"}
+{"version":3,"file":"convert-to-graphql.js","sources":["../../../src/filter-bar/convert-to-graphql.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRequestBuilder, RequestParam } from '../http-service/graphql/request-param'\r\n// types\r\nimport { TFilterState, TFieldStore, TFieldValue, TLogic, TDirection, TFieldType } from './types'\r\n\r\ntype TFilterScopeFn<TSource, TTarget extends object> = (currentBuilder: RequestParam<TTarget>, store?: TFieldStore<TSource>) => void\r\n\r\n/**\r\n * @en\r\n * - Utility class to convert filter state from a filter bar into a GraphQL query builder.\r\n * - Supports mapping filter fields to different GraphQL fields, custom filter logic, and sorting.\r\n * @vi\r\n * - Lớp tiện ích để chuyển đổi trạng thái filter từ filter bar thành builder truy vấn GraphQL.\r\n * - Hỗ trợ ánh xạ các trường filter sang các trường GraphQL khác, logic filter tùy chỉnh và sắp xếp.\r\n */\r\ntype TAutoMapFieldCustomFn<TSource, TTarget extends object> = (\r\n  currentBuilder: RequestParam<TTarget>,\r\n  value?: NonNullable<TFieldStore<TSource>>[keyof TFieldStore<TSource>],\r\n  store?: TFieldStore<TSource>\r\n) => void\r\n\r\ntype TAutoMapConfig<TSource, TTarget extends object> = {\r\n  targetfield?: keyof TTarget\r\n  operation?: 'equal' | 'contains'\r\n  /**\r\n   * @en\r\n   * - Custom function to apply complex filter logic that doesn't fit standard 'equal' or 'contains' operations.\r\n   * - Receives the current GraphQL builder, the value of the filter field, and the entire filter store for context.\r\n   * @vi\r\n   * - Hàm tùy chỉnh để áp dụng logic filter phức tạp không phù hợp với các thao tác 'equal' hoặc 'contains' tiêu chuẩn.\r\n   * - Nhận builder GraphQL hiện tại, giá trị của trường filter và toàn bộ store filter để có ngữ cảnh.\r\n   */\r\n  custom?: TAutoMapFieldCustomFn<TSource, TTarget>\r\n}\r\n\r\ntype TAutoMapConfigs<TSource, TTarget extends object> = Partial<Record<keyof TSource, TAutoMapConfig<TSource, TTarget>>>\r\n\r\ntype TFilterOption = {\r\n  logic?: TLogic\r\n}\r\n\r\nexport const mapLogic = (logic?: TLogic): 'And' | 'Or' => {\r\n  return logic === 'or' ? 'Or' : 'And'\r\n}\r\n\r\nexport const mapSortDirection = (direction?: TDirection): 'ASC' | 'DESC' => {\r\n  return direction === 'asc' ? 'ASC' : 'DESC'\r\n}\r\n\r\nexport class TableFileterConverter<TSource extends Record<string, any>, TTarget extends object> {\r\n  private state: TFilterState<TSource>\r\n  constructor(state: TFilterState<TSource>) {\r\n    this.state = state\r\n  }\r\n  private graphqlBuilder = createRequestBuilder<TTarget>({ ignoreEmpty: true })\r\n  filterScope(fn: TFilterScopeFn<TSource, TTarget>, options?: TFilterOption) {\r\n    if (this.state.storeFilter) {\r\n      const mergedLogic = options?.logic || this.state.filterLogic || 'and'\r\n      const logic = mapLogic(mergedLogic)\r\n      this.graphqlBuilder.scope(\r\n        (b) => {\r\n          fn(b, this.state.storeFilter)\r\n          return b\r\n        },\r\n        { logic }\r\n      )\r\n    }\r\n    return this\r\n  }\r\n  fillterEqual(field: TFieldType<TSource>, targetField?: keyof TTarget, options?: TFilterOption) {\r\n    const fieldValue: TFieldValue = this.state.storeFilter?.[field] ?? { values: [] }\r\n    const values = Array.isArray(fieldValue.values) ? fieldValue.values : [fieldValue.values]\r\n    const isValueEmpty = !values || values.length < 1\r\n    if (isValueEmpty || !targetField) return this\r\n\r\n    const logic = mapLogic(fieldValue.logic)\r\n    const fn: TFilterScopeFn<TSource, TTarget> = (builder, value) => {\r\n      for (let index = 0; index < values.length; index++) {\r\n        const element = values[index]\r\n        if (typeof element === 'string') {\r\n          builder.filter(targetField, element, { logic })\r\n        } else if (typeof element === 'number') {\r\n          //TODO: for number type, we can only do equal filter, so we treat it as equal filter\r\n          builder.filter(targetField, element.toString(), { logic })\r\n        } else if (typeof element === 'boolean') {\r\n          //TODO: for boolean type, we also treat it as equal filter\r\n          builder.filter(targetField, element.toString(), { logic })\r\n        }\r\n      }\r\n    }\r\n    this.filterScope(fn, options)\r\n    return this\r\n  }\r\n  fillterContains(field: TFieldType<TSource>, targetField?: keyof TTarget, options?: TFilterOption) {\r\n    const fieldValue: TFieldValue = this.state.storeFilter?.[field] ?? { values: [] }\r\n    const values = Array.isArray(fieldValue.values) ? fieldValue.values : [fieldValue.values]\r\n    const isValueEmpty = !values || values.length < 1\r\n    if (isValueEmpty || !targetField) return this\r\n\r\n    const finalLogic = mapLogic(fieldValue.logic)\r\n    const fn: TFilterScopeFn<TSource, TTarget> = (builder) => {\r\n      for (let index = 0; index < values.length; index++) {\r\n        const val = values[index]\r\n        if (typeof val === 'string') {\r\n          builder.filterContains(targetField, val, { logic: finalLogic })\r\n        } else if (typeof val === 'number') {\r\n          //TODO: for number type, we can only do equal filter, so we treat it as equal filter\r\n          builder.filter(targetField, val.toString(), { logic: finalLogic })\r\n        } else if (typeof val === 'boolean') {\r\n          //TODO: for boolean type, we also treat it as equal filter\r\n          builder.filter(targetField, val.toString(), { logic: finalLogic })\r\n        }\r\n      }\r\n    }\r\n    this.filterScope(fn, options)\r\n    return this\r\n  }\r\n  sort(field: TFieldType<TSource>, targetField?: keyof TTarget) {\r\n    const store = this.state.storeSort\r\n    if (!targetField || !store || store.field !== field) return this\r\n\r\n    this.graphqlBuilder.sort(targetField, { direction: mapSortDirection(store.direction) })\r\n    return this\r\n  }\r\n  quickSearch(fields: TFieldType<TSource> | TFieldType<TSource>[]) {\r\n    if (!this.currentObjectMap) {\r\n      console.warn('No autoMap config found, quick search will not work properly without target field mapping.')\r\n    }\r\n    const fieldValue: TFieldValue = this.state.storeFilter?.quickSearch ?? { values: [], logic: 'or' }\r\n    const values = Array.isArray(fieldValue.values) ? fieldValue.values : [fieldValue.values]\r\n    const isValueEmpty = !values || values.length < 1\r\n    if (isValueEmpty) return this\r\n\r\n    const logic = mapLogic(fieldValue.logic)\r\n    const targetFields = Array.isArray(fields) ? fields : [fields]\r\n    const fn: TFilterScopeFn<TSource, TTarget> = (builder) => {\r\n      targetFields.forEach((field) => {\r\n        const fieldMap = this.currentObjectMap?.[field]\r\n        if (fieldMap && values && values.length > 0) {\r\n          if (fieldMap.custom) {\r\n            fieldMap.custom(builder, fieldValue, this.state.storeFilter)\r\n          } else if (fieldMap.targetfield) {\r\n            for (let index = 0; index < values.length; index++) {\r\n              const element = values[index]\r\n              if (typeof element === 'string') {\r\n                builder.filterContains(fieldMap.targetfield, element, { logic })\r\n              } else if (typeof element === 'number') {\r\n                builder.filter(fieldMap.targetfield, element.toString(), { logic })\r\n              } else if (typeof element === 'boolean') {\r\n                builder.filter(fieldMap.targetfield, element.toString(), { logic })\r\n              }\r\n            }\r\n          }\r\n        }\r\n      })\r\n    }\r\n    this.filterScope(fn)\r\n    return this\r\n  }\r\n  private currentObjectMap?: TAutoMapConfigs<TSource, TTarget>\r\n  autoMap = (objMap: TAutoMapConfigs<TSource, TTarget>) => {\r\n    this.currentObjectMap = objMap\r\n\r\n    if (this.state.storeFilter) {\r\n      const keys = Object.keys(this.state.storeFilter) as (keyof TFieldStore<TSource>)[]\r\n      // filter the keys that exist in objMap\r\n      keys.forEach((key) => {\r\n        const mapConfig = objMap[key]\r\n        const fieldValue: TFieldValue | undefined = this.state.storeFilter?.[key]\r\n        if (mapConfig) {\r\n          const { targetfield, operation } = mapConfig\r\n          if (mapConfig.custom) {\r\n            mapConfig.custom(this.graphqlBuilder, fieldValue, this.state.storeFilter)\r\n            return // skip the rest logic if custom function is provided\r\n          }\r\n          if (operation === 'equal') {\r\n            this.fillterEqual(key, targetfield)\r\n          } else if (operation === 'contains') {\r\n            this.fillterContains(key, targetfield)\r\n          }\r\n        }\r\n      })\r\n    }\r\n\r\n    //sort the field if exist in storeSort\r\n    if (this.state.storeSort) {\r\n      const sortKey: TFieldType<TSource> = this.state.storeSort.field\r\n      this.sort(sortKey, objMap[sortKey]?.targetfield)\r\n    }\r\n\r\n    return this\r\n  }\r\n  private prebuildFunc?: (rp: RequestParam<TTarget>) => RequestParam<TTarget>\r\n  prebuild = (func: (requestParam: RequestParam<TTarget>) => RequestParam<TTarget>) => {\r\n    this.prebuildFunc = func\r\n    return this\r\n  }\r\n\r\n  build() {\r\n    if (this.prebuildFunc) this.prebuildFunc(this.graphqlBuilder)\r\n    return this.graphqlBuilder.build()\r\n  }\r\n}\r\n\r\nexport const createConvertToGraphQL = <TSource extends Record<string, any>, TTarget extends object>(state: TFilterState<TSource>) => {\r\n  return new TableFileterConverter<TSource, TTarget>(state)\r\n}\r\n"],"names":["mapLogic","logic","mapSortDirection","direction","TableFileterConverter","_createClass","state","_this","this","_classCallCheck","_defineProperty","createRequestBuilder","ignoreEmpty","objMap","currentObjectMap","storeFilter","Object","keys","forEach","key","_this$state$storeFilt","mapConfig","fieldValue","targetfield","operation","custom","graphqlBuilder","fillterEqual","fillterContains","storeSort","_objMap$sortKey","sortKey","field","sort","func","prebuildFunc","value","fn","options","_this2","mergedLogic","filterLogic","scope","b","targetField","_this$state$storeFilt2","_this$state$storeFilt3","values","Array","isArray","length","filterScope","builder","index","element","filter","toString","_this$state$storeFilt4","_this$state$storeFilt5","finalLogic","val","filterContains","store","fields","_this$state$storeFilt6","_this$state$storeFilt7","_this3","console","warn","quickSearch","targetFields","_this3$currentObjectM","fieldMap","build","createConvertToGraphQL"],"mappings":"sMA2CaA,EAAW,SAACC,GACvB,MAAiB,OAAVA,EAAiB,KAAO,KACjC,EAEaC,EAAmB,SAACC,GAC/B,MAAqB,QAAdA,EAAsB,MAAQ,MACvC,EAEaC,EAAqB,WAI/B,OAAAC,EAFD,SAAAD,EAAYE,GAA4B,IAAAC,EAAAC,KAAAC,OAAAL,GAAAM,EAAAF,KAAA,iBAGfG,EAA8B,CAAEC,aAAa,KAAOF,EAAAF,KAAA,UA0GnE,SAACK,IACTN,EAAKO,iBAAmBD,EAEpBN,EAAKD,MAAMS,cACAC,OAAOC,KAAKV,EAAKD,MAAMS,aAE/BG,QAAQ,SAACC,GAAO,IAAAC,EACbC,EAAYR,EAAOM,GACnBG,UAAUF,EAA4Bb,EAAKD,MAAMS,mBAAW,IAAAK,OAAA,EAAtBA,EAAyBD,GACrE,GAAIE,EAAW,CACb,IAAQE,EAA2BF,EAA3BE,YAAaC,EAAcH,EAAdG,UACrB,GAAIH,EAAUI,OAEZ,YADAJ,EAAUI,OAAOlB,EAAKmB,eAAgBJ,EAAYf,EAAKD,MAAMS,aAG7C,UAAdS,EACFjB,EAAKoB,aAAaR,EAAKI,GACA,aAAdC,GACTjB,EAAKqB,gBAAgBT,EAAKI,EAE7B,CACH,GAIF,GAAIhB,EAAKD,MAAMuB,UAAW,CAAA,IAAAC,EAClBC,EAA+BxB,EAAKD,MAAMuB,UAAUG,MAC1DzB,EAAK0B,KAAKF,EAAwBD,QAAjBA,EAAEjB,EAAOkB,cAAQD,SAAfA,EAAiBP,YACrC,CAED,OAAOhB,IACRG,EAAAF,KAAA,WAEU,SAAC0B,GAEV,OADA3B,EAAK4B,aAAeD,EACb3B,IA/IPC,KAAKF,MAAQA,CACf,EAAC,CAAA,CAAAa,IAAA,cAAAiB,MAED,SAAYC,EAAsCC,GAAuB,IAAAC,EAAA/B,KACvE,GAAIA,KAAKF,MAAMS,YAAa,CAC1B,IAAMyB,GAAcF,aAAAA,EAAAA,EAASrC,QAASO,KAAKF,MAAMmC,aAAe,MAC1DxC,EAAQD,EAASwC,GACvBhC,KAAKkB,eAAegB,MAClB,SAACC,GAEC,OADAN,EAAGM,EAAGJ,EAAKjC,MAAMS,aACV4B,CACT,EACA,CAAE1C,MAAAA,GAEL,CACD,OAAOO,IACT,GAAC,CAAAW,IAAA,eAAAiB,MACD,SAAaJ,EAA4BY,EAA6BN,GAAuB,IAAAO,EAAAC,EACrFxB,EAAyDuB,QAA/CA,UAAAC,EAAgBtC,KAAKF,MAAMS,mBAAW,IAAA+B,OAAA,EAAtBA,EAAyBd,UAAMa,IAAAA,EAAAA,EAAI,CAAEE,OAAQ,IACvEA,EAASC,MAAMC,QAAQ3B,EAAWyB,QAAUzB,EAAWyB,OAAS,CAACzB,EAAWyB,QAElF,IADsBA,GAAUA,EAAOG,OAAS,IAC3BN,EAAa,OAAOpC,KAEzC,IAAMP,EAAQD,EAASsB,EAAWrB,OAgBlC,OADAO,KAAK2C,YAdwC,SAACC,EAAShB,GACrD,IAAK,IAAIiB,EAAQ,EAAGA,EAAQN,EAAOG,OAAQG,IAAS,CAClD,IAAMC,EAAUP,EAAOM,GACA,iBAAZC,EACTF,EAAQG,OAAOX,EAAaU,EAAS,CAAErD,MAAAA,KACX,iBAAZqD,GAGY,kBAAZA,IADhBF,EAAQG,OAAOX,EAAaU,EAAQE,WAAY,CAAEvD,MAAAA,GAKrD,CACF,EACoBqC,GACd9B,IACT,GAAC,CAAAW,IAAA,kBAAAiB,MACD,SAAgBJ,EAA4BY,EAA6BN,GAAuB,IAAAmB,EAAAC,EACxFpC,EAAyDmC,QAA/CA,UAAAC,EAAgBlD,KAAKF,MAAMS,mBAAW,IAAA2C,OAAA,EAAtBA,EAAyB1B,UAAMyB,IAAAA,EAAAA,EAAI,CAAEV,OAAQ,IACvEA,EAASC,MAAMC,QAAQ3B,EAAWyB,QAAUzB,EAAWyB,OAAS,CAACzB,EAAWyB,QAElF,IADsBA,GAAUA,EAAOG,OAAS,IAC3BN,EAAa,OAAOpC,KAEzC,IAAMmD,EAAa3D,EAASsB,EAAWrB,OAgBvC,OADAO,KAAK2C,YAdwC,SAACC,GAC5C,IAAK,IAAIC,EAAQ,EAAGA,EAAQN,EAAOG,OAAQG,IAAS,CAClD,IAAMO,EAAMb,EAAOM,GACA,iBAARO,EACTR,EAAQS,eAAejB,EAAagB,EAAK,CAAE3D,MAAO0D,KAC1B,iBAARC,GAGQ,kBAARA,IADhBR,EAAQG,OAAOX,EAAagB,EAAIJ,WAAY,CAAEvD,MAAO0D,GAKxD,CACF,EACoBrB,GACd9B,IACT,GAAC,CAAAW,IAAA,OAAAiB,MACD,SAAKJ,EAA4BY,GAC/B,IAAMkB,EAAQtD,KAAKF,MAAMuB,UACzB,OAAKe,GAAgBkB,GAASA,EAAM9B,QAAUA,GAE9CxB,KAAKkB,eAAeO,KAAKW,EAAa,CAAEzC,UAAWD,EAAiB4D,EAAM3D,aACnEK,MAHqDA,IAI9D,GAAC,CAAAW,IAAA,cAAAiB,MACD,SAAY2B,GAAmD,IAAAC,EAAAC,EAAAC,EAAA1D,KACxDA,KAAKM,kBACRqD,QAAQC,KAAK,8FAEf,IAAM9C,EAA6D0C,QAAnDA,EAAsCC,QAAtCA,EAAgBzD,KAAKF,MAAMS,uBAAWkD,SAAtBA,EAAwBI,mBAAWL,IAAAA,EAAAA,EAAI,CAAEjB,OAAQ,GAAI9C,MAAO,MACtF8C,EAASC,MAAMC,QAAQ3B,EAAWyB,QAAUzB,EAAWyB,OAAS,CAACzB,EAAWyB,QAElF,IADsBA,GAAUA,EAAOG,OAAS,EAC9B,OAAO1C,KAEzB,IAAMP,EAAQD,EAASsB,EAAWrB,OAC5BqE,EAAetB,MAAMC,QAAQc,GAAUA,EAAS,CAACA,GAuBvD,OADAvD,KAAK2C,YArBwC,SAACC,GAC5CkB,EAAapD,QAAQ,SAACc,GAAS,IAAAuC,EACvBC,EAAgC,QAAxBD,EAAGL,EAAKpD,wBAAgB,IAAAyD,OAAA,EAArBA,EAAwBvC,GACzC,GAAIwC,GAAYzB,GAAUA,EAAOG,OAAS,EACxC,GAAIsB,EAAS/C,OACX+C,EAAS/C,OAAO2B,EAAS9B,EAAY4C,EAAK5D,MAAMS,kBAC3C,GAAIyD,EAASjD,YAClB,IAAK,IAAI8B,EAAQ,EAAGA,EAAQN,EAAOG,OAAQG,IAAS,CAClD,IAAMC,EAAUP,EAAOM,GACA,iBAAZC,EACTF,EAAQS,eAAeW,EAASjD,YAAa+B,EAAS,CAAErD,MAAAA,KAC5B,iBAAZqD,GAEY,kBAAZA,IADhBF,EAAQG,OAAOiB,EAASjD,YAAa+B,EAAQE,WAAY,CAAEvD,MAAAA,GAI9D,CAGP,EACD,GAEMO,IACT,GAAC,CAAAW,IAAA,QAAAiB,MAwCD,WAEE,OADI5B,KAAK2B,cAAc3B,KAAK2B,aAAa3B,KAAKkB,gBACvClB,KAAKkB,eAAe+C,OAC7B,IAAC,CAxJ+B,GA2JrBC,EAAyB,SAA8DpE,GAClG,OAAO,IAAIF,EAAwCE,EACrD"}

package/dist/src/filter-bar/index.context.js

@@ -1,2 +1,2 @@
-import{createContext as r,useContext as t}from"react";var e=r({filterState:{},setFilterState:function(){}}),n=function(){return{Provider:e.Provider,Consumer:e.Consumer,useFilterBarContext:function(){return t(e)}}};export{e as FilterBarContext,n as createFilterBarContext,n as default};
+import{createContext as r,useContext as t}from"react";var e=r({isLoading:!1,filterState:{},setFilterState:function(){}}),n=function(){return{Provider:e.Provider,Consumer:e.Consumer,useFilterBarContext:function(){return t(e)}}};export{e as FilterBarContext,n as createFilterBarContext,n as default};
 //# sourceMappingURL=index.context.js.map

package/dist/src/filter-bar/index.context.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.context.js","sources":["../../../src/filter-bar/index.context.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createContext, useContext } from 'react'\r\n// types\r\nimport { TFilterState } from './types'\r\n\r\nexport interface IFilterBarContextActions<T> {\r\n  setFilterState: (state: TFilterState<T>) => void\r\n}\r\n\r\nexport interface IFilterBarContextState<T> {\r\n  filterState: TFilterState<T>\r\n}\r\n\r\nexport interface IFilterBarContext<T> extends IFilterBarContextState<T>, IFilterBarContextActions<T> {}\r\n\r\nexport const FilterBarContext = createContext<IFilterBarContext<any>>({\r\n  filterState: {},\r\n  setFilterState: () => {}\r\n})\r\n\r\nexport const createFilterBarContext = <T extends unknown>() => {\r\n  const Provider = FilterBarContext.Provider\r\n  const Consumer = FilterBarContext.Consumer\r\n  return {\r\n    Provider,\r\n    Consumer,\r\n    useFilterBarContext: () => useContext(FilterBarContext) as IFilterBarContext<T>\r\n  }\r\n}\r\n\r\nexport default createFilterBarContext\r\n"],"names":["FilterBarContext","createContext","filterState","setFilterState","createFilterBarContext","Provider","Consumer","useFilterBarContext","useContext"],"mappings":"sDAiBaA,IAAAA,EAAmBC,EAAsC,CACpEC,YAAa,CAAE,EACfC,eAAgB,WAAK,IAGVC,EAAyB,WAGpC,MAAO,CACLC,SAHeL,EAAiBK,SAIhCC,SAHeN,EAAiBM,SAIhCC,oBAAqB,WAAF,OAAQC,EAAWR,EAAyC,EAEnF"}
+{"version":3,"file":"index.context.js","sources":["../../../src/filter-bar/index.context.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createContext, useContext } from 'react'\r\n// types\r\nimport { TFilterState } from './types'\r\n\r\nexport interface IFilterBarContextActions<T> {\r\n  setFilterState: (state: TFilterState<T>) => void\r\n}\r\n\r\nexport interface IFilterBarContextState<T> {\r\n  isLoading?: boolean\r\n  filterState: TFilterState<T>\r\n}\r\n\r\nexport interface IFilterBarContext<T> extends IFilterBarContextState<T>, IFilterBarContextActions<T> {}\r\n\r\nexport const FilterBarContext = createContext<IFilterBarContext<any>>({\r\n  isLoading: false,\r\n  filterState: {},\r\n  setFilterState: () => {}\r\n})\r\n\r\nexport const createFilterBarContext = <T extends unknown>() => {\r\n  const Provider = FilterBarContext.Provider\r\n  const Consumer = FilterBarContext.Consumer\r\n  return {\r\n    Provider,\r\n    Consumer,\r\n    useFilterBarContext: () => useContext(FilterBarContext) as IFilterBarContext<T>\r\n  }\r\n}\r\n\r\nexport default createFilterBarContext\r\n"],"names":["FilterBarContext","createContext","isLoading","filterState","setFilterState","createFilterBarContext","Provider","Consumer","useFilterBarContext","useContext"],"mappings":"sDAkBaA,IAAAA,EAAmBC,EAAsC,CACpEC,WAAW,EACXC,YAAa,CAAE,EACfC,eAAgB,WAAK,IAGVC,EAAyB,WAGpC,MAAO,CACLC,SAHeN,EAAiBM,SAIhCC,SAHeP,EAAiBO,SAIhCC,oBAAqB,WAAF,OAAQC,EAAWT,EAAyC,EAEnF"}

package/dist/src/filter-bar/index.create.js

@@ -1,2 +1,2 @@
-import{defineProperty as t,inherits as e,createClass as r,classCallCheck as o,callSuper as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as a}from"react/jsx-runtime";import{Component as s}from"react";import{styled as l,Box as m}from"@mui/material";import{createFilterBarContext as p}from"./index.context.js";import{createFilterSort as u}from"./components/filter-sort.js";import{createFilterMenu as f}from"./components/filter-menu.js";import{createFilterInput as c}from"./components/filter-input.js";import{createFilterSummary as d}from"./components/filter-summary.js";function g(l){if(!l.input){var m=l.inputConfig||{fields:{}};l.input=c(m),l.inputConfig=m}if(!l.menu){var g=l.menuConfig||{fields:{}};l.menu=f(g),l.menuConfig=g}if(!l.summary&&!1!==l.enableSummary){var y=l.summaryConfig||{fields:{}};l.summary=d(y),l.summaryConfig=y}if(!l.sort){var C=l.sortConfig||{fields:{}};l.sort=u(C),l.sortConfig=C}var S=l.defaultFilterLogic||"and",b=p();return function(){function m(e){var r;return o(this,m),r=i(this,m,[e]),t(r,"setFilterState",function(t){var e,o;(console.log("Updating filter state:",t),r.props.value)?null===(e=(o=r.props).onChange)||void 0===e||e.call(o,t):r.setState({filterState:t},function(){})}),t(r,"onAddFilter",function(){console.log("Add filter")}),t(r,"onAddRemove",function(){console.log("Remove filter")}),r.state=r.getInitialFilterState(),r}return e(m,s),r(m,[{key:"getInitialFilterState",value:function(){return this.props.value?{filterState:this.props.value}:{filterState:Object.assign({filterLogic:S},l.initialFilterState)}}},{key:"filterState",get:function(){return this.props.value||this.state.filterState}},{key:"render",value:function(){var t=l.input,e=l.menu,r=l.summary,o=l.sort;return n(b.Provider,{value:this,children:a(h,{className:v.root,sx:this.props.sx,children:[a("div",{className:v.inner,children:[n(e,{slots:{popperProps:{placement:"bottom-start"}}}),n(o,{slots:{popperProps:{placement:"bottom-start"}}}),n(t,{onAdd:this.onAddFilter,slots:{popperProps:{placement:"bottom-start"}}})]}),!1!==l.enableSummary&&n(r,{sx:{my:1}})]})})}}])}()}var v={root:"DinoFilterBar-root",inner:"DinoFilterBar-inner"},h=l(m)(function(e){var r=e.theme;return t(t({},"&.".concat(v.root),{backgroundColor:r.palette.background.paper}),".".concat(v.inner),{display:"flex",alignItems:"center",gap:r.spacing(1)})});export{g as createFilterBar};
+import{defineProperty as t,inherits as e,createClass as n,objectSpread2 as r,classCallCheck as o,callSuper as i,asyncToGenerator as a,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Component as p}from"react";import{styled as m,Box as f}from"@mui/material";import{createFilterBarContext as c}from"./index.context.js";import{createFilterSort as d}from"./components/filter-sort.js";import{createFilterMenu as v}from"./components/filter-menu.js";import{createFilterInput as g}from"./components/filter-input.js";import{createFilterSummary as h}from"./components/filter-summary.js";import{fetchDelay as C}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";function S(m){if(!m.InputComponent){var S=m.inputConfig||{fields:{}};m.inputConfig=S,m.InputComponent=g(S)}if(!m.MenuComponent){var b=m.menuConfig||{fields:{}};m.menuConfig=b,m.MenuComponent=v(b)}if(!m.SummaryComponent&&!1!==m.enableSummary){var x=m.summaryConfig||{fields:{}};m.summaryConfig=x,m.SummaryComponent=h(x)}if(!m.SortComponent){var F=m.sortConfig||{fields:{}};m.sortConfig=F,m.SortComponent=d(F)}var k=m.defaultFilterLogic||"and",P=c(),I=function(){function c(e){var n;return o(this,c),n=i(this,c,[e]),t(n,"handleChange",function(){var t=a(l().m(function t(e,r){var o;return l().w(function(t){for(;;)switch(t.p=t.n){case 0:return t.p=0,n.setState(function(t){var e;return{filterState:null!==(e=null==r?void 0:r.filterState)&&void 0!==e?e:t.filterState,isLoading:!0}}),t.n=1,C(a(l().m(function t(){var r,o;return l().w(function(t){for(;;)if(0===t.n)return t.a(2,null===(r=(o=n.props).onChange)||void 0===r?void 0:r.call(o,e))},t)})),500);case 1:n.setState({isLoading:!1}),t.n=3;break;case 2:throw t.p=2,o=t.v,n.setState({isLoading:!1}),o;case 3:return t.a(2)}},t,null,[[0,2]])}));return function(e,n){return t.apply(this,arguments)}}()),t(n,"setFilterState",function(t){n.props.value?n.handleChange(t):n.handleChange(t,{filterState:t})}),t(n,"onAddFilter",function(){console.log("Add filter")}),t(n,"onAddRemove",function(){console.log("Remove filter")}),n.state=n.getInitialFilterState(),n}return e(c,p),n(c,[{key:"getInitialFilterState",value:function(){return this.props.value?{filterState:this.props.value}:{filterState:Object.assign({filterLogic:k},m.initialFilterState)}}},{key:"filterState",get:function(){return this.props.value||this.state.filterState}},{key:"isLoading",get:function(){return this.state.isLoading||!1}},{key:"render",value:function(){var t,e=this.props.slots,n=m.InputComponent,o=m.MenuComponent,i=m.SummaryComponent,a=m.SortComponent;return s(P.Provider,{value:this,children:u(j,{className:y.root,sx:this.props.sx,children:[u("div",{className:y.inner,children:[(null==e?void 0:e.before)||null,s(o,{slots:{popperProps:{placement:"bottom-start"}}}),s(a,{slots:{popperProps:{placement:"bottom-start"}}}),s(n,{onAdd:this.onAddFilter,slots:{popperProps:{placement:"bottom-start"}}}),(null==e?void 0:e.after)||null]}),u(f,r(r({},null==e?void 0:e.summaryWrapProps),{},{sx:r({display:"flex",alignItems:"center"},null==e||null===(t=e.summaryWrapProps)||void 0===t?void 0:t.sx),children:[(null==e?void 0:e.summaryBefore)||null,s(f,{sx:{flex:1,minWidth:0},children:!1!==m.enableSummary&&s(i,{})}),(null==e?void 0:e.summaryAfter)||null]}))]})})}}])}();return I}var y={root:"DinoFilterBar-root",inner:"DinoFilterBar-inner"},j=m(f)(function(e){var n=e.theme;return t(t({},"&.".concat(y.root),{backgroundColor:n.palette.background.paper}),".".concat(y.inner),{display:"flex",alignItems:"center",gap:n.spacing(1)})});export{S as createFilterBar};
 //# sourceMappingURL=index.create.js.map

package/dist/src/filter-bar/index.create.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.create.js","sources":["../../../src/filter-bar/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Component } from 'react'\r\nimport { Box, BoxProps, styled } from '@mui/material'\r\nimport { createFilterBarContext } from './index.context'\r\nimport { createFilterSort } from './components/filter-sort'\r\nimport { createFilterMenu } from './components/filter-menu'\r\nimport { createFilterInput } from './components/filter-input'\r\nimport { createFilterSummary } from './components/filter-summary'\r\n// types\r\nimport type { ComponentType } from 'react'\r\nimport type { TFilterState } from './types'\r\nimport type { IFilterBarContext, IFilterBarContextState } from './index.context'\r\nimport type { IFilterMenuConfig, IFilterMenuProps } from './components/filter-menu.types'\r\nimport type { IFilterSortConfig, IFilterSortProps } from './components/filter-sort.types'\r\nimport type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps } from './components/filter-summary.types'\r\n\r\nexport interface IFilterBarConfigs<T> {\r\n  initialFilterState?: TFilterState<T>\r\n  /** Default filter logic, can be overridden by individual filters @default \"and\" */\r\n  defaultFilterLogic?: 'and' | 'or'\r\n  input?: ComponentType<IFilterInputProps<T>>\r\n  inputConfig?: IFilterInputConfig<T>\r\n  menu?: ComponentType<IFilterMenuProps<T>>\r\n  menuConfig?: IFilterMenuConfig<T>\r\n  summary?: ComponentType<IFilterSummaryProps<T>>\r\n  summaryConfig?: IFilterSummaryConfig<T>\r\n  /** Enable or disable the summary component. Default is true. */\r\n  enableSummary?: boolean\r\n  sortConfig?: IFilterSortConfig<T>\r\n  sort?: ComponentType<IFilterSortProps<T>>\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n  sx?: BoxProps['sx']\r\n  value?: TFilterState<T>\r\n  onChange?: (state: TFilterState<T>) => void\r\n}\r\n\r\ninterface IFilterBarState<T> extends IFilterBarContextState<T> {}\r\n\r\nexport function createFilterBar<T>(configs: IFilterBarConfigs<T>) {\r\n  if (!configs.input) {\r\n    const configInput = configs.inputConfig || { fields: {} }\r\n    configs.input = createFilterInput<T>(configInput)\r\n    configs.inputConfig = configInput\r\n  }\r\n  if (!configs.menu) {\r\n    const configMenu = configs.menuConfig || { fields: {} }\r\n    configs.menu = createFilterMenu<T>(configMenu)\r\n    configs.menuConfig = configMenu\r\n  }\r\n  if (!configs.summary && configs.enableSummary !== false) {\r\n    const configSummary: IFilterSummaryConfig<T> = configs.summaryConfig || { fields: {} }\r\n    configs.summary = createFilterSummary<T>(configSummary)\r\n    configs.summaryConfig = configSummary\r\n  }\r\n  if (!configs.sort) {\r\n    const configSort: IFilterSortConfig<T> = configs.sortConfig || { fields: {} }\r\n    configs.sort = createFilterSort<T>(configSort)\r\n    configs.sortConfig = configSort\r\n  }\r\n\r\n  const defaultFilterLogic = configs.defaultFilterLogic || 'and'\r\n  const Context = createFilterBarContext<T>()\r\n\r\n  class FilterBar extends Component<IFilterBarProps<T>, IFilterBarState<T>> implements IFilterBarContext<T> {\r\n    constructor(props: IFilterBarProps<T>) {\r\n      super(props)\r\n      this.state = this.getInitialFilterState()\r\n    }\r\n\r\n    getInitialFilterState(): IFilterBarState<T> {\r\n      if (this.props.value) return { filterState: this.props.value }\r\n      return { filterState: Object.assign({ filterLogic: defaultFilterLogic }, configs.initialFilterState) }\r\n    }\r\n\r\n    get filterState(): TFilterState<T> {\r\n      return this.props.value || this.state.filterState\r\n    }\r\n\r\n    setFilterState = (state: TFilterState<T>) => {\r\n      console.log('Updating filter state:', state)\r\n\r\n      if (this.props.value) {\r\n        this.props.onChange?.(state)\r\n        return\r\n      }\r\n      this.setState({ filterState: state }, () => {\r\n        // this.props.onChange?.(state)\r\n      })\r\n    }\r\n\r\n    onAddFilter = () => {\r\n      // TODO: add filter to filterState\r\n      console.log('Add filter')\r\n    }\r\n\r\n    onAddRemove = () => {\r\n      // TODO: remove filter from filterState\r\n      console.log('Remove filter')\r\n    }\r\n\r\n    render() {\r\n      const Input = configs.input as ComponentType<IFilterInputProps<T>>\r\n      const Menu = configs.menu as ComponentType<IFilterMenuProps<T>>\r\n      const Summary = configs.summary as ComponentType<IFilterSummaryProps<T>>\r\n      const Sort = configs.sort as ComponentType<IFilterSortProps<T>>\r\n      return (\r\n        <Context.Provider value={this}>\r\n          <FilterBarStyled className={filterbarClasses.root} sx={this.props.sx}>\r\n            <div className={filterbarClasses.inner}>\r\n              <Menu slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <Sort slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <Input onAdd={this.onAddFilter} slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n            </div>\r\n            {configs.enableSummary !== false && <Summary sx={{ my: 1 }} />}\r\n          </FilterBarStyled>\r\n          {/* <Box style={{ border: '1px solid red', marginTop: '16px', padding: '8px' }}>\r\n            <Typography variant='subtitle2'>For Debug - Current Filter State:</Typography>\r\n            <pre>{JSON.stringify(this.filterState, null, 2)}</pre>\r\n          </Box> */}\r\n        </Context.Provider>\r\n      )\r\n    }\r\n  }\r\n\r\n  return FilterBar\r\n}\r\n\r\nconst filterbarClasses = {\r\n  root: 'DinoFilterBar-root',\r\n  inner: 'DinoFilterBar-inner'\r\n}\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterbarClasses.root}`]: {\r\n    backgroundColor: theme.palette.background.paper\r\n  },\r\n  [`.${filterbarClasses.inner}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    gap: theme.spacing(1)\r\n  }\r\n}))\r\n"],"names":["createFilterBar","configs","input","configInput","inputConfig","fields","createFilterInput","menu","configMenu","menuConfig","createFilterMenu","summary","enableSummary","configSummary","summaryConfig","createFilterSummary","sort","configSort","sortConfig","createFilterSort","defaultFilterLogic","Context","createFilterBarContext","FilterBar","props","_this","_classCallCheck","_callSuper","_defineProperty","state","_this$props$onChange","_this$props","console","log","value","onChange","call","setState","filterState","getInitialFilterState","_inherits","Component","_createClass","key","this","Object","assign","filterLogic","initialFilterState","get","Input","Menu","Summary","Sort","_jsx","Provider","children","_jsxs","FilterBarStyled","className","filterbarClasses","root","sx","inner","slots","popperProps","placement","onAdd","onAddFilter","my","styled","Box","_ref","theme","concat","backgroundColor","palette","background","paper","display","alignItems","gap","spacing"],"mappings":"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"}
+{"version":3,"file":"index.create.js","sources":["../../../src/filter-bar/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Component } from 'react'\r\nimport { Box, BoxProps, styled } from '@mui/material'\r\nimport { createFilterBarContext } from './index.context'\r\nimport { createFilterSort } from './components/filter-sort'\r\nimport { createFilterMenu } from './components/filter-menu'\r\nimport { createFilterInput } from './components/filter-input'\r\nimport { createFilterSummary } from './components/filter-summary'\r\n// types\r\nimport type { ComponentType } from 'react'\r\nimport type { TFilterState } from './types'\r\nimport type { IFilterBarContext, IFilterBarContextState } from './index.context'\r\nimport type { IFilterMenuConfig, IFilterMenuProps } from './components/filter-menu.types'\r\nimport type { IFilterSortConfig, IFilterSortProps } from './components/filter-sort.types'\r\nimport type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types'\r\nimport type { IFilterSummaryConfig, IFilterSummaryProps } from './components/filter-summary.types'\r\nimport { fetchDelay } from '../utils'\r\n\r\nexport interface IFilterBarConfigs<T> {\r\n  initialFilterState?: TFilterState<T>\r\n  /** Default filter logic, can be overridden by individual filters @default \"and\" */\r\n  defaultFilterLogic?: 'and' | 'or'\r\n  InputComponent?: ComponentType<IFilterInputProps<T>>\r\n  inputConfig?: IFilterInputConfig<T>\r\n  MenuComponent?: ComponentType<IFilterMenuProps<T>>\r\n  menuConfig?: IFilterMenuConfig<T>\r\n  sortConfig?: IFilterSortConfig<T>\r\n  SortComponent?: ComponentType<IFilterSortProps<T>>\r\n  /** Enable or disable the summary component. Default is true. */\r\n  enableSummary?: boolean\r\n  SummaryComponent?: ComponentType<IFilterSummaryProps<T>>\r\n  summaryConfig?: IFilterSummaryConfig<T>\r\n}\r\n\r\nexport interface IFilterBarSlots {\r\n  summaryWrapProps?: BoxProps\r\n  summaryBefore?: React.ReactNode\r\n  summaryAfter?: React.ReactNode\r\n  before?: React.ReactNode\r\n  after?: React.ReactNode\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n  sx?: BoxProps['sx']\r\n  value?: TFilterState<T>\r\n  onChange?: (state: TFilterState<T>) => Promise<void> | void\r\n  slots?: IFilterBarSlots\r\n}\r\n\r\ninterface IFilterBarState<T> extends IFilterBarContextState<T> {}\r\n\r\nexport function createFilterBar<T>(configs: IFilterBarConfigs<T>) {\r\n  if (!configs.InputComponent) {\r\n    const configInput = configs.inputConfig || { fields: {} }\r\n    configs.inputConfig = configInput\r\n    configs.InputComponent = createFilterInput<T>(configInput)\r\n  }\r\n  if (!configs.MenuComponent) {\r\n    const configMenu = configs.menuConfig || { fields: {} }\r\n    configs.menuConfig = configMenu\r\n    configs.MenuComponent = createFilterMenu<T>(configMenu)\r\n  }\r\n  if (!configs.SummaryComponent && configs.enableSummary !== false) {\r\n    const configSummary: IFilterSummaryConfig<T> = configs.summaryConfig || { fields: {} }\r\n    configs.summaryConfig = configSummary\r\n    configs.SummaryComponent = createFilterSummary<T>(configSummary)\r\n  }\r\n  if (!configs.SortComponent) {\r\n    const configSort: IFilterSortConfig<T> = configs.sortConfig || { fields: {} }\r\n    configs.sortConfig = configSort\r\n    configs.SortComponent = createFilterSort<T>(configSort)\r\n  }\r\n\r\n  const defaultFilterLogic = configs.defaultFilterLogic || 'and'\r\n  const Context = createFilterBarContext<T>()\r\n\r\n  class FilterBar extends Component<IFilterBarProps<T>, IFilterBarState<T>> implements IFilterBarContext<T> {\r\n    constructor(props: IFilterBarProps<T>) {\r\n      super(props)\r\n      this.state = this.getInitialFilterState()\r\n    }\r\n\r\n    getInitialFilterState(): IFilterBarState<T> {\r\n      if (this.props.value) return { filterState: this.props.value }\r\n      return { filterState: Object.assign({ filterLogic: defaultFilterLogic }, configs.initialFilterState) }\r\n    }\r\n\r\n    get filterState(): TFilterState<T> {\r\n      return this.props.value || this.state.filterState\r\n    }\r\n\r\n    get isLoading(): boolean {\r\n      return this.state.isLoading || false\r\n    }\r\n\r\n    handleChange = async (filterState: TFilterState<T>, state?: Partial<IFilterBarState<T>>) => {\r\n      try {\r\n        this.setState((prev) => ({ filterState: state?.filterState ?? prev.filterState, isLoading: true }))\r\n        await fetchDelay(async () => this.props.onChange?.(filterState), 500)\r\n        this.setState({ isLoading: false })\r\n      } catch (error) {\r\n        this.setState({ isLoading: false })\r\n        throw error\r\n      }\r\n    }\r\n\r\n    setFilterState = (state: TFilterState<T>) => {\r\n      if (this.props.value) {\r\n        this.handleChange(state)\r\n        return\r\n      }\r\n      this.handleChange(state, { filterState: state })\r\n    }\r\n\r\n    onAddFilter = () => {\r\n      // TODO: add filter to filterState\r\n      console.log('Add filter')\r\n    }\r\n\r\n    onAddRemove = () => {\r\n      // TODO: remove filter from filterState\r\n      console.log('Remove filter')\r\n    }\r\n\r\n    render() {\r\n      const { slots } = this.props\r\n      const InputComponent = configs.InputComponent as ComponentType<IFilterInputProps<T>>\r\n      const MenuComponent = configs.MenuComponent as ComponentType<IFilterMenuProps<T>>\r\n      const SummaryComponent = configs.SummaryComponent as ComponentType<IFilterSummaryProps<T>>\r\n      const SortComponent = configs.SortComponent as ComponentType<IFilterSortProps<T>>\r\n      return (\r\n        <Context.Provider value={this}>\r\n          <FilterBarStyled className={filterbarClasses.root} sx={this.props.sx}>\r\n            <div className={filterbarClasses.inner}>\r\n              {slots?.before || null}\r\n              <MenuComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <SortComponent slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              <InputComponent onAdd={this.onAddFilter} slots={{ popperProps: { placement: 'bottom-start' } }} />\r\n              {slots?.after || null}\r\n            </div>\r\n            <Box {...slots?.summaryWrapProps} sx={{ display: 'flex', alignItems: 'center', ...slots?.summaryWrapProps?.sx }}>\r\n              {slots?.summaryBefore || null}\r\n              <Box sx={{ flex: 1, minWidth: 0 }}>{configs.enableSummary !== false && <SummaryComponent />}</Box>\r\n              {slots?.summaryAfter || null}\r\n            </Box>\r\n          </FilterBarStyled>\r\n          {/* <Box style={{ border: '1px solid red', marginTop: '16px', padding: '8px' }}>\r\n            <Typography variant='subtitle2'>For Debug - Current Filter State:</Typography>\r\n            <pre>{JSON.stringify(this.filterState, null, 2)}</pre>\r\n          </Box> */}\r\n        </Context.Provider>\r\n      )\r\n    }\r\n  }\r\n\r\n  return FilterBar\r\n}\r\n\r\nconst filterbarClasses = {\r\n  root: 'DinoFilterBar-root',\r\n  inner: 'DinoFilterBar-inner'\r\n}\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterbarClasses.root}`]: {\r\n    backgroundColor: theme.palette.background.paper\r\n  },\r\n  [`.${filterbarClasses.inner}`]: {\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    gap: theme.spacing(1)\r\n  }\r\n}))\r\n"],"names":["createFilterBar","configs","InputComponent","configInput","inputConfig","fields","createFilterInput","MenuComponent","configMenu","menuConfig","createFilterMenu","SummaryComponent","enableSummary","configSummary","summaryConfig","createFilterSummary","SortComponent","configSort","sortConfig","createFilterSort","defaultFilterLogic","Context","createFilterBarContext","FilterBar","props","_this","_classCallCheck","_callSuper","_defineProperty","_ref","_asyncToGenerator","_regenerator","m","_callee2","filterState","state","_t","w","_context2","p","n","setState","prev","_state$filterState","isLoading","fetchDelay","_callee","_this$props$onChange","_this$props","_context","a","onChange","call","v","_x","_x2","apply","this","arguments","value","handleChange","console","log","getInitialFilterState","_inherits","Component","_createClass","key","Object","assign","filterLogic","initialFilterState","get","_slots$summaryWrapPro","slots","_jsx","Provider","children","_jsxs","FilterBarStyled","className","filterbarClasses","root","sx","inner","before","popperProps","placement","onAdd","onAddFilter","after","Box","_objectSpread","summaryWrapProps","display","alignItems","summaryBefore","flex","minWidth","summaryAfter","styled","_ref3","theme","concat","backgroundColor","palette","background","paper","gap","spacing"],"mappings":"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"}

package/dist/src/form/create.form-base.js

@@ -1,2 +1,2 @@
-import{inherits as r,createClass as e,objectSpread2 as t,classCallCheck as a,callSuper as o,defineProperty as s,asyncToGenerator as n,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Box as u}from"@mui/material";import{createContext as m,Component as c}from"react";import{validateMerge as f,convertFormDataToJson as p,trimAllStrings as d,singleValidate as v,getErrorCommonFromResponse as E,getErrorFromResponse as g}from"./helpers.js";import{FormValidator as S,SingleRuleValidate as h}from"./validator.js";import{ApiAlertContext as b}from"../api-context/alert-global.js";var j=function(j){var A=m({setModelState:function(){},messageErrors:{},onBlur:function(){},setError:function(){},removeError:function(){},clearErrorAll:function(){}}),C=function(){function m(r){var e;return a(this,m),e=o(this,m,[r]),s(e,"refForm",null),s(e,"mapContext",function(){var r=e,t=r.setError,a=r.removeError,o=r.setModelState,s=r.clearErrorAll,n=r.onBlur,l=e.state;return{modelState:l.modelState,messageErrors:l.messageErrors,setError:t,onBlur:n,clearErrorAll:s,setModelState:o,removeError:a}}),s(e,"setModelState",function(r){var t=Object.assign({},e.state.modelState,r);e.setState({modelState:t})}),s(e,"getValidate",function(){var r=new S({});return f(r,null==j?void 0:j.validate,e.props.validate)}),s(e,"setError",function(r,t){var a=s({},r,[{rule:h.Custom,message:t}]);e.setState({messageErrors:Object.assign({},e.state.messageErrors,a)})}),s(e,"removeError",function(r){var a=t({},e.state.messageErrors);Array.isArray(r)?r.forEach(function(r){a[r]&&delete a[r]}):a[r]&&delete a[r],e.setState({messageErrors:a})}),s(e,"clearErrorAll",function(){e.setState({messageErrors:{}})}),s(e,"onSubmit",function(){var r=n(l().m(function r(a){var o,s,n,i,u,m,c,f;return l().w(function(r){for(;;)switch(r.p=r.n){case 0:if(a.preventDefault(),o=new FormData(a.currentTarget),s=p(o),n=d(s),e.setState({modelState:n}),i=e.validate.run(n),e.props.onError&&Object.keys(i).length>0&&e.props.onError(i),!i){r.n=1;break}if(e.setState({messageErrors:i}),!(Object.keys(i).length>0)){r.n=1;break}return r.a(2);case 1:return r.p=1,r.n=2,e.props.onSubmit(n,a);case 2:r.n=4;break;case 3:r.p=3,f=r.v,(m=E(f)).length>0&&(null===(u=b.ApiAlert)||void 0===u||u.PushError(m[0])),c=g(f,n),e.setState({messageErrors:t(t({},e.state.messageErrors),c||{})});case 4:return r.a(2)}},r,null,[[1,3]])}));return function(e){return r.apply(this,arguments)}}()),s(e,"onBlur",function(r){if(e.refForm){var t=e.state.messageErrors,a=new FormData(e.refForm),o=p(a),s=d(o);e.setState({modelState:s});var n=v(r,s,t,e.validate)||{};e.setState({messageErrors:n})}}),e.validate=e.getValidate(),e.state={messageErrors:{}},e}return r(m,c),e(m,[{key:"render",value:function(){var r,e=this;return i(u,t(t({component:"form",ref:function(r){return e.refForm=r},onSubmit:this.onSubmit},null===(r=this.props.slots)||void 0===r?void 0:r.formProps),{},{children:i(A.Provider,{value:this.mapContext(),children:this.props.children})}))}}])}();return{Form:C,Validator:null==j?void 0:j.validate,Context:A,mapContext:function(r){return i(A.Consumer,{children:r})}}};export{j as default};
+import{inherits as r,createClass as e,objectSpread2 as t,classCallCheck as a,callSuper as o,defineProperty as s,asyncToGenerator as n,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Box as u}from"@mui/material";import{createContext as m,Component as c}from"react";import{validateMerge as f,getErrorCommonFromResponse as p,getErrorFromResponse as d,convertFormDataToJson as v,trimAllStrings as E,singleValidate as g}from"./helpers.js";import{FormValidator as S,SingleRuleValidate as h}from"./validator.js";import{ApiAlertContext as b}from"../api-context/alert-global.js";var j=function(j){var A=m({setModelState:function(){},messageErrors:{},onBlur:function(){},setError:function(){},removeError:function(){},clearErrorAll:function(){}}),C=function(){function m(r){var e;return a(this,m),e=o(this,m,[r]),s(e,"refForm",null),s(e,"mapContext",function(){var r=e,t=r.setError,a=r.removeError,o=r.setModelState,s=r.clearErrorAll,n=r.onBlur,l=e.state;return{modelState:l.modelState,messageErrors:l.messageErrors,setError:t,onBlur:n,clearErrorAll:s,setModelState:o,removeError:a}}),s(e,"setModelState",function(r){var t=Object.assign({},e.state.modelState,r);e.setState({modelState:t})}),s(e,"getValidate",function(){var r=new S({});return f(r,null==j?void 0:j.validate,e.props.validate)}),s(e,"setError",function(r,t){var a=s({},r,[{rule:h.Custom,message:t}]);e.setState({messageErrors:Object.assign({},e.state.messageErrors,a)})}),s(e,"removeError",function(r){var a=t({},e.state.messageErrors);Array.isArray(r)?r.forEach(function(r){a[r]&&delete a[r]}):a[r]&&delete a[r],e.setState({messageErrors:a})}),s(e,"clearErrorAll",function(){e.setState({messageErrors:{}})}),s(e,"onSubmit",function(){var r=n(l().m(function r(a){var o,s,n,i,u,m,c,f;return l().w(function(r){for(;;)switch(r.p=r.n){case 0:if(a.preventDefault(),o=new FormData(a.currentTarget),s=v(o),n=E(s),e.setState({modelState:n}),i=e.validate.run(n),e.props.onError&&Object.keys(i).length>0&&e.props.onError(i),!i){r.n=1;break}if(e.setState({messageErrors:i}),!(Object.keys(i).length>0)){r.n=1;break}return r.a(2);case 1:return r.p=1,r.n=2,e.props.onSubmit(n,a);case 2:r.n=4;break;case 3:r.p=3,f=r.v,(m=p(f)).length>0&&(null===(u=b.ApiAlert)||void 0===u||u.PushError(m[0])),c=d(f,n),e.setState({messageErrors:t(t({},e.state.messageErrors),c||{})});case 4:return r.a(2)}},r,null,[[1,3]])}));return function(e){return r.apply(this,arguments)}}()),s(e,"onBlur",function(r){if(e.refForm){var t=e.state.messageErrors,a=new FormData(e.refForm),o=v(a),s=E(o);e.setState({modelState:s});var n=g(r,s,t,e.validate)||{};e.setState({messageErrors:n})}}),e.validate=e.getValidate(),e.state={messageErrors:{}},e}return r(m,c),e(m,[{key:"render",value:function(){var r,e=this;return i(u,t(t({component:"form",ref:function(r){return e.refForm=r},onSubmit:this.onSubmit},null===(r=this.props.slots)||void 0===r?void 0:r.formProps),{},{children:i(A.Provider,{value:this.mapContext(),children:this.props.children})}))}}])}();return{Form:C,Validator:null==j?void 0:j.validate,Context:A,mapContext:function(r){return i(A.Consumer,{children:r})}}};export{j as default};
 //# sourceMappingURL=create.form-base.js.map

package/dist/src/lab/data-surface/button-switch.js

@@ -0,0 +1,2 @@
+import{objectSpread2 as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"@mui/material/Button";import n from"@mui/material/ButtonGroup";import o from"@mui/icons-material/ViewList";import a from"@mui/icons-material/GridView";var l={sm:"small",md:"medium"},s=function(s){var d=s.value,m=void 0===d?"list":d,u=s.onChange,c=s.size,f=void 0===c?"md":c,v=s.className,p=s.onlyIcon,x=void 0!==p&&p,z=l[f]||"small",g=function(i){i!==m&&(null==u||u(i))};return e(n,{className:v,variant:"outlined","aria-label":"view mode group",size:z,children:[t(r,i(i({"aria-pressed":"list"===m,onClick:function(){return g("list")},variant:"list"===m?"contained":"outlined",startIcon:x?void 0:t(o,{fontSize:z}),size:z,sx:{minWidth:x?"small"===z?36:44:void 0,px:x?1:void 0,display:"inline-flex",justifyContent:"center"}},x?{"aria-label":"List view"}:{}),{},{children:x?t(o,{fontSize:z}):"List"})),t(r,i(i({"aria-pressed":"grid"===m,onClick:function(){return g("grid")},variant:"grid"===m?"contained":"outlined",startIcon:x?void 0:t(a,{fontSize:z}),size:z,sx:{minWidth:x?"small"===z?36:44:void 0,px:x?1:void 0,display:"inline-flex",justifyContent:"center"}},x?{"aria-label":"Grid view"}:{}),{},{children:x?t(a,{fontSize:z}):"Grid"}))]})};export{s as default};
+//# sourceMappingURL=button-switch.js.map

package/dist/src/lab/data-surface/button-switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-switch.js","sources":["../../../../src/lab/data-surface/button-switch.tsx"],"sourcesContent":["import React from 'react'\r\nimport type { DataSurfaceViewMode } from './types'\r\nimport Button from '@mui/material/Button'\r\nimport ButtonGroup from '@mui/material/ButtonGroup'\r\nimport ViewListIcon from '@mui/icons-material/ViewList'\r\nimport GridViewIcon from '@mui/icons-material/GridView'\r\n\r\ntype Props = {\r\n  value?: DataSurfaceViewMode\r\n  onChange?: (value: DataSurfaceViewMode) => void\r\n  size?: 'sm' | 'md'\r\n  className?: string\r\n  onlyIcon?: boolean\r\n}\r\n\r\nconst sizeMap = {\r\n  sm: 'small',\r\n  md: 'medium'\r\n} as const\r\n\r\nconst ButtonSwitch: React.FC<Props> = ({ value = 'list', onChange, size = 'md', className, onlyIcon = false }) => {\r\n  const muiSize = sizeMap[size] || 'small'\r\n\r\n  const handleClick = (v: DataSurfaceViewMode) => {\r\n    if (v === value) return\r\n    onChange?.(v)\r\n  }\r\n\r\n  return (\r\n    <ButtonGroup className={className} variant='outlined' aria-label='view mode group' size={muiSize}>\r\n      <Button\r\n        aria-pressed={value === 'list'}\r\n        onClick={() => handleClick('list')}\r\n        variant={value === 'list' ? 'contained' : 'outlined'}\r\n        startIcon={!onlyIcon ? <ViewListIcon fontSize={muiSize} /> : undefined}\r\n        size={muiSize}\r\n        sx={{\r\n          minWidth: onlyIcon ? (muiSize === 'small' ? 36 : 44) : undefined,\r\n          px: onlyIcon ? 1 : undefined,\r\n          display: 'inline-flex',\r\n          justifyContent: 'center'\r\n        }}\r\n        {...(onlyIcon ? { 'aria-label': 'List view' } : {})}\r\n      >\r\n        {onlyIcon ? <ViewListIcon fontSize={muiSize} /> : 'List'}\r\n      </Button>\r\n\r\n      <Button\r\n        aria-pressed={value === 'grid'}\r\n        onClick={() => handleClick('grid')}\r\n        variant={value === 'grid' ? 'contained' : 'outlined'}\r\n        startIcon={!onlyIcon ? <GridViewIcon fontSize={muiSize} /> : undefined}\r\n        size={muiSize}\r\n        sx={{\r\n          minWidth: onlyIcon ? (muiSize === 'small' ? 36 : 44) : undefined,\r\n          px: onlyIcon ? 1 : undefined,\r\n          display: 'inline-flex',\r\n          justifyContent: 'center'\r\n        }}\r\n        {...(onlyIcon ? { 'aria-label': 'Grid view' } : {})}\r\n      >\r\n        {onlyIcon ? <GridViewIcon fontSize={muiSize} /> : 'Grid'}\r\n      </Button>\r\n    </ButtonGroup>\r\n  )\r\n}\r\n\r\nexport default ButtonSwitch\r\n"],"names":["sizeMap","sm","md","ButtonSwitch","_ref","_ref$value","value","onChange","_ref$size","size","className","_ref$onlyIcon","onlyIcon","muiSize","handleClick","v","_jsxs","ButtonGroup","variant","children","_jsx","Button","_objectSpread","onClick","startIcon","undefined","ViewListIcon","fontSize","sx","minWidth","px","display","justifyContent","GridViewIcon"],"mappings":"sSAeA,IAAMA,EAAU,CACdC,GAAI,QACJC,GAAI,UAGAC,EAAgC,SAApBC,GAA+F,IAAAC,EAAAD,EAAxEE,MAAAA,OAAQ,IAAHD,EAAG,OAAMA,EAAEE,EAAQH,EAARG,SAAQC,EAAAJ,EAAEK,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAEE,EAASN,EAATM,UAASC,EAAAP,EAAEQ,SAAAA,OAAW,IAAHD,GAAQA,EACnGE,EAAUb,EAAQS,IAAS,QAE3BK,EAAc,SAACC,GACfA,IAAMT,IACVC,SAAAA,EAAWQ,GACZ,EAED,OACEC,EAACC,EAAW,CAACP,UAAWA,EAAWQ,QAAQ,WAAU,aAAY,kBAAkBT,KAAMI,EACvFM,SAAA,CAAAC,EAACC,EAAMC,EAAAA,EAAA,CAAA,eACmB,SAAVhB,EACdiB,QAAS,WAAF,OAAQT,EAAY,OAAO,EAClCI,QAAmB,SAAVZ,EAAmB,YAAc,WAC1CkB,UAAYZ,OAAiDa,EAAtCL,EAACM,EAAa,CAAAC,SAAUd,IAC/CJ,KAAMI,EACNe,GAAI,CACFC,SAAUjB,EAAwB,UAAZC,EAAsB,GAAK,QAAMY,EACvDK,GAAIlB,EAAW,OAAIa,EACnBM,QAAS,cACTC,eAAgB,WAEbpB,EAAW,CAAE,aAAc,aAAgB,CAAA,GAAE,GAAA,UAEjDA,EAAWQ,EAACM,EAAY,CAACC,SAAUd,IAAc,UAGpDO,EAACC,EAAMC,EAAAA,EAAA,gBACmB,SAAVhB,EACdiB,QAAS,WAAF,OAAQT,EAAY,OAAO,EAClCI,QAAmB,SAAVZ,EAAmB,YAAc,WAC1CkB,UAAYZ,OAAiDa,EAAtCL,EAACa,EAAa,CAAAN,SAAUd,IAC/CJ,KAAMI,EACNe,GAAI,CACFC,SAAUjB,EAAwB,UAAZC,EAAsB,GAAK,QAAMY,EACvDK,GAAIlB,EAAW,OAAIa,EACnBM,QAAS,cACTC,eAAgB,WAEbpB,EAAW,CAAE,aAAc,aAAgB,CAAA,GAAE,GAAA,CAEjDO,SAAAP,EAAWQ,EAACa,EAAY,CAACN,SAAUd,IAAc,YAI1D"}

package/dist/src/lab/data-surface/index.create.js

@@ -0,0 +1,2 @@
+import{slicedToArray as n,asyncToGenerator as e,regenerator as i,objectSpread2 as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as a,jsx as t}from"react/jsx-runtime";import{styled as r,Box as l}from"@mui/material";import{useState as u,useMemo as d,useCallback as g,useRef as v}from"react";import{LoadingModeRule as p}from"./types.js";import{createViewGrid as s,createViewGridLoading as c}from"./view-grid.js";import{createViewList as f,createViewListLoading as m}from"./view-list.js";import{createViewSwitchTransition as h}from"./view-switch-transition.js";import{PanelLoading as C,PanelNoData as S,PanelLoadMore as w,PanelInfiniteScrollFooter as P,PanelPaginationFooter as x}from"./ui.units.js";function y(r){if(!r.GridComponent){var y=r.gridConfig||{getterId:function(n,e){return e}};r.gridConfig=y,r.GridComponent=s(y)}if(!r.ListComponent){var M=r.listConfig||{getterId:function(n,e){return e}};r.listConfig=M,r.ListComponent=f(M)}var N=r.defaultViewMode,j=void 0===N?"grid":N,b=r.defaultLoadMode,k=void 0===b?"pagination":b,B=r.defaultPageSize,G=void 0===B?20:B,L=h({}),H=c(r.GridComponent),A=m(r.ListComponent);return function(s){var c,f,m=u({viewMode:j,loadMode:k}),h=n(m,2),y=h[0];h[1];var M=u({page:0,pageSize:G}),N=n(M,2),b=N[0],B=N[1],I=d(function(){var n,e,i,o,a,t,l,u,d=null!==(n=s.state)&&void 0!==n?n:y,g=null!==(e=d.viewMode)&&void 0!==e?e:j,v=null!==(i=null===(o=r.listConfig)||void 0===o?void 0:o.renderStrategy)&&void 0!==i?i:"normal";"grid"===g&&(v=null!==(l=null===(u=r.gridConfig)||void 0===u?void 0:u.renderStrategy)&&void 0!==l?l:"normal");return{viewMode:g,loadMode:null!==(a=d.loadMode)&&void 0!==a?a:k,renderStrategy:null!==(t=d.renderStrategy)&&void 0!==t?t:v}},[s.state,y]),T=d(function(){var n,e,i,o,a,t=null!==(n=s.pagination)&&void 0!==n?n:b;return{page:null!==(e=t.page)&&void 0!==e?e:0,pageSize:null!==(i=t.pageSize)&&void 0!==i?i:G,hasNext:null!==(o=t.hasNext)&&void 0!==o&&o,hasPrev:null!==(a=t.hasPrev)&&void 0!==a&&a,total:t.total}},[s.pagination,b]),_=null!==(c=s.viewMode)&&void 0!==c?c:I.viewMode,D=null!==(f=s.loadMode)&&void 0!==f?f:I.loadMode,J=g(e(i().m(function n(){var e,a,t,r,l;return i().w(function(n){for(;;)switch(n.n){case 0:if(!((r=null!==(e=T.page)&&void 0!==e?e:0)<=0)){n.n=1;break}return n.a(2);case 1:return l=r-1,s.pagination||B(function(n){return o(o({},n),{},{page:l})}),n.n=2,null===(a=s.onPageChange)||void 0===a?void 0:a.call(s,l,null!==(t=T.pageSize)&&void 0!==t?t:G);case 2:return n.a(2)}},n)})),[T.page,T.pageSize,s.pagination,s.onPageChange]),V=g(e(i().m(function n(){var e,a,t,r,l;return i().w(function(n){for(;;)switch(n.n){case 0:if(T.hasNext){n.n=1;break}return n.a(2);case 1:return r=null!==(e=T.page)&&void 0!==e?e:0,l=r+1,s.pagination||B(function(n){return o(o({},n),{},{page:l})}),n.n=2,null===(a=s.onPageChange)||void 0===a?void 0:a.call(s,l,null!==(t=T.pageSize)&&void 0!==t?t:G);case 2:return n.a(2)}},n)})),[T.hasNext,T.page,T.pageSize,s.pagination,s.onPageChange]),q=g(function(){var n=e(i().m(function n(e){var a,t;return i().w(function(n){for(;;)switch(n.n){case 0:if(!(e<0)){n.n=1;break}return n.a(2);case 1:return s.pagination||B(function(n){return o(o({},n),{},{page:e})}),n.n=2,null===(a=s.onPageChange)||void 0===a?void 0:a.call(s,e,null!==(t=T.pageSize)&&void 0!==t?t:G);case 2:return n.a(2)}},n)}));return function(e){return n.apply(this,arguments)}}(),[T.pageSize,s.pagination,s.onPageChange]),E=s.value||[],F=0===E.length,K=Boolean(s.loading&&F),O=!s.loading&&F,Q=Boolean(s.loading)&&!F,R=g(function(){var n=e(i().m(function n(e,o){var a;return i().w(function(n){for(;;)switch(n.n){case 0:return s.pagination||B({page:e,pageSize:o}),n.n=1,null===(a=s.onPageChange)||void 0===a?void 0:a.call(s,e,o);case 1:return n.a(2)}},n)}));return function(e,i){return n.apply(this,arguments)}}(),[s.pagination,s.onPageChange]),U=d(function(){return{value:E,loadMode:D,loading:s.loading,pagination:T,onPageChange:R}},[E,D,s.loading,T,R]),W=v(U);W.current=U;var X=d(function(){var n,e,i;return{value:E,loadMode:D,loading:s.loading,pagination:T,onPageChange:R,columns:null===(n=r.listConfig)||void 0===n?void 0:n.columns,density:null===(e=r.listConfig)||void 0===e?void 0:e.density,renderStrategy:I.renderStrategy,virtualizedConfig:null===(i=r.listConfig)||void 0===i?void 0:i.virtualizedConfig}},[E,D,s.loading,T,I.renderStrategy,R]),Y=v(X);Y.current=X;var Z,$,nn,en,on,an=d(function(){return function(){return t(A,o({},Y.current))}},[A]),tn=d(function(){return function(){return t(H,o({},W.current))}},[H]);return a(z,{sx:s.sx,children:[a(l,{sx:{flex:1,minHeight:0,position:"relative"},children:[K&&t(C,{}),O&&t(S,{}),!K&&!O&&t(L,{value:_,viewA:{value:"list",Content:an},viewB:{value:"grid",Content:tn}}),Q&&t(w,{})]}),D===p.infiniteScroll?t(P,{loading:s.loading,hasNext:null===(en=s.pagination)||void 0===en?void 0:en.hasNext,currentCount:E.length,total:null===(on=s.pagination)||void 0===on?void 0:on.total}):t(x,{page:null!==(Z=T.page)&&void 0!==Z?Z:0,pageSize:null!==($=T.pageSize)&&void 0!==$?$:G,total:T.total,hasNext:T.hasNext,hasPrev:(null!==(nn=T.page)&&void 0!==nn?nn:0)>0,loading:s.loading,onPrevPage:J,onNextPage:V,onPageJump:q})]})}}var z=r(l)(function(n){return{display:"flex",flexDirection:"column",width:"100%",height:"100%",position:"relative",backgroundColor:n.theme.palette.background.default,minHeight:0,flex:1}});export{y as createDataSurface,y as default};
+//# sourceMappingURL=index.create.js.map

package/dist/src/lab/data-surface/index.create.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.create.js","sources":["../../../../src/lab/data-surface/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, styled } from '@mui/material'\r\nimport { useCallback, useMemo, useRef, useState } from 'react'\r\nimport { DataSurfaceViewMode, LoadingModeRule } from './types'\r\nimport { createViewGrid, createViewGridLoading } from './view-grid'\r\nimport { createViewList, createViewListLoading } from './view-list'\r\nimport { createViewSwitchTransition } from './view-switch-transition'\r\nimport { PanelInfiniteScrollFooter, PanelLoadMore, PanelLoading, PanelNoData, PanelPaginationFooter } from './ui.units'\r\n// types\r\nimport type { BoxProps } from '@mui/material'\r\nimport type { ComponentType, FC } from 'react'\r\nimport type { TPagination, TDataSurfaceState } from './types'\r\nimport type { IViewGridConfig, IViewGridLoadingProps, IViewGridProps } from './view-grid'\r\nimport type { IViewListConfig, IViewListLoadingProps, IViewListProps } from './view-list'\r\n\r\nexport interface IDataSurfaceSlots {}\r\n\r\nexport interface IDataSurfaceProps<T> {\r\n  value?: T[]\r\n  /** Controlled state. When provided, DataSurface becomes fully controlled. */\r\n  state?: TDataSurfaceState\r\n  /** Called on any state change (viewMode, loadMode, page, pageSize). */\r\n  onStateChange?: (state: TDataSurfaceState) => void\r\n  viewMode?: DataSurfaceViewMode\r\n  /** Pagination metadata shared by both modes. */\r\n  pagination?: TPagination\r\n  /** True while a page fetch is in flight (shows loading indicator). */\r\n  loading?: boolean\r\n  /**\r\n   * Called when the component needs a new page of data.\r\n   * - pagination mode: triggered by user clicking page control\r\n   * - infiniteScroll mode: triggered automatically when scrolling near the bottom\r\n   * Supports async operations - return a Promise to indicate loading state.\r\n   */\r\n  onPageChange?: (page: number, pageSize: number) => void | Promise<void>\r\n  /** Load orchestration mode. @default 'pagination' */\r\n  loadMode?: LoadingModeRule\r\n  sx?: BoxProps['sx']\r\n  slots?: IDataSurfaceSlots\r\n}\r\n\r\nexport interface IDataSurfaceConfig<T> {\r\n  defaultViewMode?: DataSurfaceViewMode\r\n  /** Default load mode when not provided via props. @default 'pagination' */\r\n  defaultLoadMode?: LoadingModeRule\r\n  /** Default page size. @default 20 */\r\n  defaultPageSize?: number\r\n  enableSingleViewTransition?: boolean\r\n  listConfig?: IViewListConfig<T>\r\n  ListComponent?: ComponentType<IViewListProps<T>>\r\n  gridConfig?: IViewGridConfig<T>\r\n  GridComponent?: ComponentType<IViewGridProps<T>>\r\n}\r\n\r\nexport function createDataSurface<T>(config: IDataSurfaceConfig<T>) {\r\n  if (!config.GridComponent) {\r\n    const configInput: IViewGridConfig<T> = config.gridConfig || { getterId: (item: T, index: number) => index }\r\n    config.gridConfig = configInput\r\n    config.GridComponent = createViewGrid<T>(configInput)\r\n  }\r\n\r\n  if (!config.ListComponent) {\r\n    const configInput: IViewListConfig<T> = config.listConfig || { getterId: (item: T, index: number) => index }\r\n    config.listConfig = configInput\r\n    config.ListComponent = createViewList<T>(configInput)\r\n  }\r\n\r\n  const { defaultViewMode = 'grid', defaultLoadMode = 'pagination', defaultPageSize = 20 } = config\r\n  const ViewSwitchTranstionInstance = createViewSwitchTransition<DataSurfaceViewMode>({})\r\n  const GridLoadingComponent = createViewGridLoading<T>(config.GridComponent as ComponentType<IViewGridProps<T>>)\r\n  const ListLoadingComponent = createViewListLoading<T>(config.ListComponent as ComponentType<IViewListProps<T>>)\r\n\r\n  const DataSurface: FC<IDataSurfaceProps<T>> = (props) => {\r\n    // uncontrolled internal state (used when props.state is not provided)\r\n    const [internalState, setInternalState] = useState<TDataSurfaceState>({\r\n      viewMode: defaultViewMode,\r\n      loadMode: defaultLoadMode\r\n    })\r\n\r\n    // separate pagination state\r\n    const [internalPagination, setInternalPagination] = useState<TPagination>({\r\n      page: 0,\r\n      pageSize: defaultPageSize\r\n    })\r\n\r\n    // resolved state: controlled takes priority over internal\r\n    const surfaceState = useMemo<Required<TDataSurfaceState>>(() => {\r\n      const s = props.state ?? internalState\r\n      const resolvedViewMode = s.viewMode ?? defaultViewMode\r\n\r\n      // Determine default renderStrategy based on current viewMode\r\n      let defaultRenderStrategy = config.listConfig?.renderStrategy ?? 'normal'\r\n      if (resolvedViewMode === 'grid') {\r\n        defaultRenderStrategy = config.gridConfig?.renderStrategy ?? 'normal'\r\n      }\r\n\r\n      const resolved = {\r\n        viewMode: resolvedViewMode,\r\n        loadMode: s.loadMode ?? defaultLoadMode,\r\n        renderStrategy: s.renderStrategy ?? defaultRenderStrategy\r\n      }\r\n      return resolved\r\n    }, [props.state, internalState])\r\n\r\n    // resolved pagination: external takes priority over internal\r\n    const paginationState = useMemo<TPagination>(() => {\r\n      const p = props.pagination ?? internalPagination\r\n      return {\r\n        page: p.page ?? 0,\r\n        pageSize: p.pageSize ?? defaultPageSize,\r\n        hasNext: p.hasNext ?? false,\r\n        hasPrev: p.hasPrev ?? false,\r\n        total: p.total\r\n      }\r\n    }, [props.pagination, internalPagination])\r\n\r\n    // const updateState = useCallback(\r\n    //   (patch: Partial<TDataSurfaceState>) => {\r\n    //     const next = { ...surfaceState, ...patch }\r\n    //     if (!props.state) setInternalState(next)\r\n    //     props.onStateChange?.(next)\r\n    //   },\r\n    //   [surfaceState, props.state, props.onStateChange]\r\n    // )\r\n\r\n    const viewMode = props.viewMode ?? surfaceState.viewMode\r\n    const loadMode = props.loadMode ?? surfaceState.loadMode\r\n\r\n    const handlePrevPage = useCallback(async () => {\r\n      const currentPage = paginationState.page ?? 0\r\n      if (currentPage <= 0) return\r\n      const prevPage = currentPage - 1\r\n      if (!props.pagination) {\r\n        setInternalPagination((prev) => ({ ...prev, page: prevPage }))\r\n      }\r\n      await props.onPageChange?.(prevPage, paginationState.pageSize ?? defaultPageSize)\r\n    }, [paginationState.page, paginationState.pageSize, props.pagination, props.onPageChange])\r\n\r\n    const handleNextPage = useCallback(async () => {\r\n      if (!paginationState.hasNext) return\r\n      const currentPage = paginationState.page ?? 0\r\n      const nextPage = currentPage + 1\r\n      if (!props.pagination) {\r\n        setInternalPagination((prev) => ({ ...prev, page: nextPage }))\r\n      }\r\n      await props.onPageChange?.(nextPage, paginationState.pageSize ?? defaultPageSize)\r\n    }, [paginationState.hasNext, paginationState.page, paginationState.pageSize, props.pagination, props.onPageChange])\r\n\r\n    const handlePageJump = useCallback(\r\n      async (targetPage: number) => {\r\n        if (targetPage < 0) return\r\n        if (!props.pagination) {\r\n          setInternalPagination((prev) => ({ ...prev, page: targetPage }))\r\n        }\r\n        await props.onPageChange?.(targetPage, paginationState.pageSize ?? defaultPageSize)\r\n      },\r\n      [paginationState.pageSize, props.pagination, props.onPageChange]\r\n    )\r\n\r\n    const finalValue = props.value || []\r\n    const isEmptyData = finalValue.length === 0\r\n    const isInitialLoading = Boolean(props.loading && isEmptyData)\r\n    const isNoData = !props.loading && isEmptyData\r\n    const showLoadingOverlay = Boolean(props.loading) && !isEmptyData\r\n\r\n    const handleGridPageChange = useCallback(\r\n      async (page: number, pageSize: number) => {\r\n        if (!props.pagination) {\r\n          setInternalPagination({ page, pageSize })\r\n        }\r\n        await props.onPageChange?.(page, pageSize)\r\n      },\r\n      [props.pagination, props.onPageChange]\r\n    )\r\n\r\n    const gridPayload = useMemo<IViewGridLoadingProps<T>>(\r\n      () => ({\r\n        value: finalValue,\r\n        loadMode,\r\n        loading: props.loading,\r\n        pagination: paginationState,\r\n        onPageChange: handleGridPageChange\r\n      }),\r\n      [finalValue, loadMode, props.loading, paginationState, handleGridPageChange]\r\n    )\r\n\r\n    const gridPayloadRef = useRef<IViewGridLoadingProps<T>>(gridPayload)\r\n    gridPayloadRef.current = gridPayload\r\n\r\n    const listPayload = useMemo<IViewListLoadingProps<T>>(\r\n      () => ({\r\n        value: finalValue,\r\n        loadMode,\r\n        loading: props.loading,\r\n        pagination: paginationState,\r\n        onPageChange: handleGridPageChange,\r\n        columns: config.listConfig?.columns,\r\n        density: config.listConfig?.density,\r\n        renderStrategy: surfaceState.renderStrategy,\r\n        virtualizedConfig: config.listConfig?.virtualizedConfig\r\n      }),\r\n      [finalValue, loadMode, props.loading, paginationState, surfaceState.renderStrategy, handleGridPageChange]\r\n    )\r\n\r\n    const listPayloadRef = useRef<IViewListLoadingProps<T>>(listPayload)\r\n    listPayloadRef.current = listPayload\r\n\r\n    const ListViewContent = useMemo<ComponentType<{ value: DataSurfaceViewMode }>>(() => {\r\n      const ViewListContent: FC<{ value: DataSurfaceViewMode }> = () => {\r\n        return <ListLoadingComponent {...listPayloadRef.current} />\r\n      }\r\n      return ViewListContent\r\n    }, [ListLoadingComponent])\r\n\r\n    const GridViewContent = useMemo<ComponentType<{ value: DataSurfaceViewMode }>>(() => {\r\n      const ViewGridContent: FC<{ value: DataSurfaceViewMode }> = () => {\r\n        return <GridLoadingComponent {...gridPayloadRef.current} />\r\n      }\r\n      return ViewGridContent\r\n    }, [GridLoadingComponent])\r\n\r\n    const renderFooter = () => {\r\n      if (loadMode === LoadingModeRule.infiniteScroll) {\r\n        return (\r\n          <PanelInfiniteScrollFooter\r\n            loading={props.loading}\r\n            hasNext={props.pagination?.hasNext}\r\n            currentCount={finalValue.length}\r\n            total={props.pagination?.total}\r\n          />\r\n        )\r\n      }\r\n\r\n      // pagination mode\r\n      return (\r\n        <PanelPaginationFooter\r\n          page={paginationState.page ?? 0}\r\n          pageSize={paginationState.pageSize ?? defaultPageSize}\r\n          total={paginationState.total}\r\n          hasNext={paginationState.hasNext}\r\n          hasPrev={(paginationState.page ?? 0) > 0}\r\n          loading={props.loading}\r\n          onPrevPage={handlePrevPage}\r\n          onNextPage={handleNextPage}\r\n          onPageJump={handlePageJump}\r\n        />\r\n      )\r\n    }\r\n\r\n    return (\r\n      <DataSurfaceStyled sx={props.sx}>\r\n        <Box sx={{ flex: 1, minHeight: 0, position: 'relative' }}>\r\n          {isInitialLoading && <PanelLoading />}\r\n          {isNoData && <PanelNoData />}\r\n          {!isInitialLoading && !isNoData && (\r\n            <ViewSwitchTranstionInstance\r\n              value={viewMode}\r\n              viewA={{ value: 'list', Content: ListViewContent }}\r\n              viewB={{ value: 'grid', Content: GridViewContent }}\r\n            />\r\n          )}\r\n          {showLoadingOverlay && <PanelLoadMore />}\r\n        </Box>\r\n        {renderFooter()}\r\n      </DataSurfaceStyled>\r\n    )\r\n  }\r\n  return DataSurface\r\n}\r\n\r\nexport default createDataSurface\r\n\r\nconst DataSurfaceStyled = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  flexDirection: 'column',\r\n  width: '100%',\r\n  height: '100%',\r\n  position: 'relative',\r\n  backgroundColor: theme.palette.background.default,\r\n  minHeight: 0,\r\n  flex: 1\r\n}))\r\n"],"names":["createDataSurface","config","GridComponent","configInput","gridConfig","getterId","item","index","createViewGrid","ListComponent","listConfig","createViewList","_config$defaultViewMo","defaultViewMode","_config$defaultLoadMo","defaultLoadMode","_config$defaultPageSi","defaultPageSize","ViewSwitchTranstionInstance","createViewSwitchTransition","GridLoadingComponent","createViewGridLoading","ListLoadingComponent","createViewListLoading","props","_props$viewMode","_props$loadMode","_useState","useState","viewMode","loadMode","_useState2","_slicedToArray","internalState","_useState3","page","pageSize","_useState4","internalPagination","setInternalPagination","surfaceState","useMemo","_props$state","_s$viewMode","_config$listConfig$re","_config$listConfig","_s$loadMode","_s$renderStrategy","_config$gridConfig$re","_config$gridConfig","s","state","resolvedViewMode","defaultRenderStrategy","renderStrategy","paginationState","_props$pagination","_p$page","_p$pageSize","_p$hasNext","_p$hasPrev","p","pagination","hasNext","hasPrev","total","handlePrevPage","useCallback","_asyncToGenerator","_regenerator","m","_callee","_paginationState$page","_props$onPageChange","_paginationState$page2","currentPage","prevPage","w","_context","n","a","prev","_objectSpread","onPageChange","call","handleNextPage","_callee2","_paginationState$page3","_props$onPageChange2","_paginationState$page4","nextPage","_context2","handlePageJump","_ref3","_callee3","targetPage","_props$onPageChange3","_paginationState$page5","_context3","_x","apply","this","arguments","finalValue","value","isEmptyData","length","isInitialLoading","Boolean","loading","isNoData","showLoadingOverlay","handleGridPageChange","_ref4","_callee4","_props$onPageChange4","_context4","_x2","_x3","gridPayload","gridPayloadRef","useRef","current","listPayload","_config$listConfig2","_config$listConfig3","_config$listConfig4","columns","density","virtualizedConfig","listPayloadRef","_paginationState$page6","_paginationState$page7","_paginationState$page8","_props$pagination2","_props$pagination3","ListViewContent","_jsx","GridViewContent","_jsxs","DataSurfaceStyled","sx","children","Box","flex","minHeight","position","PanelLoading","PanelNoData","viewA","Content","viewB","PanelLoadMore","LoadingModeRule","infiniteScroll","PanelInfiniteScrollFooter","currentCount","PanelPaginationFooter","onPrevPage","onNextPage","onPageJump","styled","_ref5","display","flexDirection","width","height","backgroundColor","theme","palette","background"],"mappings":"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"}

package/dist/src/lab/data-surface/index.dino.js

@@ -0,0 +1,2 @@
+import{createClass as t,classCallCheck as r,defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{createViewGrid as i}from"./view-grid.js";import{createDataSurface as a}from"./index.create.js";import s from"./button-switch.js";var o=t(function t(){r(this,t),e(this,"createDataSurface",a),e(this,"createViewGrid",i),e(this,"createButtonSwitch",function(){return s})}),c=new o;export{o as DinoDataSurFace,c as dinoDataSurface};
+//# sourceMappingURL=index.dino.js.map

package/dist/src/lab/data-surface/index.dino.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.dino.js","sources":["../../../../src/lab/data-surface/index.dino.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport createViewGrid from './view-grid'\r\nimport createDataSurface from './index.create'\r\nimport ButtonSwitch from './button-switch'\r\n\r\nexport class DinoDataSurFace {\r\n  createDataSurface = createDataSurface\r\n  createViewGrid = createViewGrid\r\n  createButtonSwitch = () => ButtonSwitch\r\n}\r\n\r\nexport const dinoDataSurface = new DinoDataSurFace()\r\n"],"names":["DinoDataSurFace","_createClass","_classCallCheck","_defineProperty","createDataSurface","createViewGrid","this","ButtonSwitch","dinoDataSurface"],"mappings":"6PAMA,IAAaA,EAAeC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,2BACNC,GAAiBD,wBACpBE,GAAcF,EACVG,KAAA,qBAAA,WAAA,OAAMC,CAAY,EAAA,GAG5BC,EAAkB,IAAIR"}

package/dist/src/lab/data-surface/types.js

@@ -0,0 +1,2 @@
+var i={normal:"normal",virtualized:"virtualized"},l={list:"list",grid:"grid"},n={pagination:"pagination",infiniteScroll:"infiniteScroll"};export{l as DataSurfaceViewMode,n as LoadingModeRule,i as RenderStrategyRule};
+//# sourceMappingURL=types.js.map

package/dist/src/lab/data-surface/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":["../../../../src/lab/data-surface/types.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nexport type TGetterId<T> = (item: T, index: number) => string | number\r\n\r\nexport type TPagination = {\r\n  page?: number\r\n  pageSize?: number\r\n  hasNext?: boolean\r\n  hasPrev?: boolean\r\n  total?: number\r\n}\r\n\r\n/**\r\n * Virtualized rendering configuration.\r\n * Used by both grid and list views for windowing optimization.\r\n */\r\nexport type TVirtualizedConfig = {\r\n  scrollTop: number\r\n  viewportHeight: number\r\n  /** Number of extra rows/columns rendered outside the viewport as a buffer. Defaults to `4` (grid) / `6` (table). */\r\n  overscan?: number\r\n  gap?: number\r\n}\r\n\r\n/**\r\n * Controls how the list is rendered into the DOM.\r\n * - `normal`      — all rows are mounted (suitable for small datasets)\r\n * - `virtualized` — only visible rows are mounted (optimized for large datasets)\r\n */\r\nexport const RenderStrategyRule = {\r\n  normal: 'normal',\r\n  virtualized: 'virtualized'\r\n} as const\r\nexport type RenderStrategyRule = keyof typeof RenderStrategyRule\r\n\r\n/**\r\n * Controls how the list is displayed.\r\n * - `list` — items are displayed in a single column\r\n * - `grid` — items are displayed in multiple columns (number of columns is determined by the available width)\r\n */\r\nexport const DataSurfaceViewMode = {\r\n  list: 'list',\r\n  grid: 'grid'\r\n} as const\r\nexport type DataSurfaceViewMode = keyof typeof DataSurfaceViewMode\r\n/**\r\n * Controls how the data is loaded and when the loading indicator is shown.\r\n * - `pagination`    — loading indicator is shown when the user clicks on the pagination controls\r\n * - `infiniteScroll` — loading indicator is shown when the user scrolls to the end of the list\r\n */\r\nexport const LoadingModeRule = {\r\n  pagination: 'pagination',\r\n  infiniteScroll: 'infiniteScroll'\r\n} as const\r\nexport type LoadingModeRule = keyof typeof LoadingModeRule\r\n\r\n\r\nexport type TDataSurfaceState = {\r\n  viewMode?: DataSurfaceViewMode\r\n  loadMode?: LoadingModeRule\r\n  renderStrategy?: RenderStrategyRule\r\n}\r\n"],"names":["RenderStrategyRule","normal","virtualized","DataSurfaceViewMode","list","grid","LoadingModeRule","pagination","infiniteScroll"],"mappings":"AA6BO,IAAMA,EAAqB,CAChCC,OAAQ,SACRC,YAAa,eASFC,EAAsB,CACjCC,KAAM,OACNC,KAAM,QAQKC,EAAkB,CAC7BC,WAAY,aACZC,eAAgB"}

package/dist/src/lab/data-surface/ui.units.js

@@ -0,0 +1,2 @@
+import{objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as o}from"react/jsx-runtime";import{colors as n,styled as t,Box as a,CircularProgress as i,Typography as l,Pagination as c}from"@mui/material";var d={padding:"8px",height:"100%",minHeight:180,width:"100%","& > .inner":{width:"100%",height:"100%",padding:"24px 16px",border:"1px dashed ".concat(n.grey[400]),borderRadius:6,display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center"}},u=function(n){return r(g,e(e({},n),{},{children:o("div",{className:"inner",children:[r(i,{size:24}),r(l,{variant:"body2",color:"primary",children:"Loading..."})]})}))},g=t(a)(e(e({},d),{},{"& > div":{gap:8,borderColor:n.blue[400],backgroundColor:n.blue[50]}}));t(a)(e(e({},d),{},{"& > div":{borderColor:n.red[400],backgroundColor:n.red[50],color:n.red[900],flexDirection:"column"}}));var p=function(){return r(s,{children:o("div",{className:"inner",children:[r(l,{variant:"h6",gutterBottom:!0,children:"No data available"}),r(l,{variant:"body2",children:"Try changing the filter or search keyword"})]})})},s=t(a)(e(e({},d),{},{"& > div":{borderColor:n.grey[400],backgroundColor:n.grey[50],color:n.grey[700],flexDirection:"column"}}));t(a)(e(e({},d),{},{"& > div":{borderColor:n.blue[400],backgroundColor:n.blue[50],color:n.blue[900],flexDirection:"column"}})),t(a)(e(e({},d),{},{"& > div":{borderColor:n.red[700],backgroundColor:n.red[50],color:n.red[900],flexDirection:"column"}}));var b=function(){return r(h,{children:o("div",{children:[r(i,{size:24,thickness:4}),r(l,{variant:"body2",color:"text.primary",children:"Loading more..."})]})})},h=t(a)(function(e){return{position:"absolute",inset:0,bgcolor:"dark"===e.theme.palette.mode?"rgba(0,0,0,0.12)":"rgba(255,255,255,0.12)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:10,backdropFilter:"blur(1px)",transition:"opacity 0.2s","& > div":{display:"flex",alignItems:"center",gap:10}}}),m=function(e){var n=e.loading,t=e.hasNext,a=e.currentCount,i=e.total,c="";c=n?"Loading more...":t?"Scroll for more":"No more items";var d=a>0?null!=i?"1–".concat(a," of ").concat(i):"1–".concat(a):"—";return o(v,{children:[r(l,{variant:"caption",color:"text.secondary",children:c}),r(l,{variant:"caption",color:"text.secondary",children:d})]})},v=t(a)(function(e){var r=e.theme;return{display:"flex",alignItems:"center",justifyContent:"space-between",padding:r.spacing(1,1.5),backgroundColor:r.palette.background.paper,borderTop:"1px solid ".concat("dark"===r.palette.mode?"rgba(255, 255, 255, 0.12)":"rgba(0, 0, 0, 0.12)"),".MuiTypography-root":{lineHeight:1}}}),x=function(e){var n=e.page,t=e.pageSize,a=e.total,i=e.hasNext,d=e.loading,u=e.onPrevPage,g=e.onNextPage,p=e.onPageJump,s=n*t+1,b=null!=a?Math.min(s+t-1,a):s+t-1,h=null!=a?Math.ceil(a/t):void 0;return o(f,{children:[r(l,{variant:"caption",color:"text.secondary",children:null!=a?"".concat(s,"–").concat(b," / ").concat(a):"Page ".concat(n+1)}),r(c,{count:h,page:n+1,onChange:function(e,r){var o=r-1;p?p(o):o<n?null==u||u():o>n&&(null==g||g())},disabled:d,size:"small",showFirstButton:null!=h&&h>5,showLastButton:null!=h&&h>5,siblingCount:0,boundaryCount:1,hidePrevButton:null==h&&!i,hideNextButton:null==h&&!i})]})},f=t(a)(function(e){var r=e.theme;return{padding:"8px 16px",display:"flex",alignItems:"center",justifyContent:"space-between",backgroundColor:r.palette.background.paper,borderTop:"1px solid ".concat("dark"===r.palette.mode?"rgba(255, 255, 255, 0.12)":"rgba(0, 0, 0, 0.12)")}});export{m as PanelInfiniteScrollFooter,b as PanelLoadMore,u as PanelLoading,p as PanelNoData,x as PanelPaginationFooter};
+//# sourceMappingURL=ui.units.js.map

package/dist/src/lab/data-surface/ui.units.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui.units.js","sources":["../../../../src/lab/data-surface/ui.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, CircularProgress, Pagination, Typography, colors, styled } from '@mui/material'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { BoxProps } from '@mui/material'\r\n\r\nconst stateWrapBase = {\r\n  padding: '8px',\r\n  height: '100%',\r\n  minHeight: 180,\r\n  width: '100%',\r\n  '& > .inner': {\r\n    width: '100%',\r\n    height: '100%',\r\n    padding: '24px 16px',\r\n    border: `1px dashed ${colors.grey[400]}`,\r\n    borderRadius: 6,\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'center',\r\n    textAlign: 'center'\r\n  }\r\n} as const\r\n\r\nexport const PanelLoading: FC<BoxProps> = (props) => (\r\n  <PanelLoadingStyled {...props}>\r\n    <div className='inner'>\r\n      <CircularProgress size={24} />\r\n      <Typography variant='body2' color='primary'>\r\n        Loading...\r\n      </Typography>\r\n    </div>\r\n  </PanelLoadingStyled>\r\n)\r\n\r\nconst PanelLoadingStyled = styled(Box)({\r\n  ...stateWrapBase,\r\n  '& > div': { gap: 8, borderColor: colors.blue[400], backgroundColor: colors.blue[50] }\r\n})\r\n\r\nexport const PanelError: FC<{ error: string }> = ({ error }) => (\r\n  <PanelErrorStyled>\r\n    <div className='inner'>\r\n      <Typography variant='h6' gutterBottom>\r\n        An error occurred\r\n      </Typography>\r\n      {error && <Typography variant='body2'>{error}</Typography>}\r\n    </div>\r\n  </PanelErrorStyled>\r\n)\r\n\r\nconst PanelErrorStyled = styled(Box)({\r\n  ...stateWrapBase,\r\n  '& > div': {\r\n    borderColor: colors.red[400],\r\n    backgroundColor: colors.red[50],\r\n    color: colors.red[900],\r\n    flexDirection: 'column'\r\n  }\r\n})\r\n\r\nexport const PanelNoData: FC = () => (\r\n  <PanelNoDataStyled>\r\n    <div className='inner'>\r\n      <Typography variant='h6' gutterBottom>\r\n        No data available\r\n      </Typography>\r\n      <Typography variant='body2'>Try changing the filter or search keyword</Typography>\r\n    </div>\r\n  </PanelNoDataStyled>\r\n)\r\n\r\nconst PanelNoDataStyled = styled(Box)({\r\n  ...stateWrapBase,\r\n  '& > div': {\r\n    borderColor: colors.grey[400],\r\n    backgroundColor: colors.grey[50],\r\n    color: colors.grey[700],\r\n    flexDirection: 'column'\r\n  }\r\n})\r\n\r\nexport const PanelWaiting: FC = () => (\r\n  <PanelWaitingStyled>\r\n    <div className='inner'>\r\n      <Typography variant='h6' color='text.primary' sx={{ fontWeight: 'bold' }}>\r\n        Waiting for data...\r\n      </Typography>\r\n      <Typography variant='body2' color='text.secondary'>\r\n        Please wait while we fetch the data.\r\n      </Typography>\r\n    </div>\r\n  </PanelWaitingStyled>\r\n)\r\n\r\nconst PanelWaitingStyled = styled(Box)({\r\n  ...stateWrapBase,\r\n  '& > div': {\r\n    borderColor: colors.blue[400],\r\n    backgroundColor: colors.blue[50],\r\n    color: colors.blue[900],\r\n    flexDirection: 'column'\r\n  }\r\n})\r\n\r\nexport const PanelMissingConfig: FC = () => (\r\n  <PanelMissingConfigStyled>\r\n    <div className='inner'>\r\n      <Typography variant='h6' sx={{ fontWeight: 'bold' }}>\r\n        Missing Configuration\r\n      </Typography>\r\n      <Typography variant='body2'>A required configuration is missing for this view to work correctly.</Typography>\r\n    </div>\r\n  </PanelMissingConfigStyled>\r\n)\r\n\r\nconst PanelMissingConfigStyled = styled(Box)({\r\n  ...stateWrapBase,\r\n  '& > div': {\r\n    borderColor: colors.red[700],\r\n    backgroundColor: colors.red[50],\r\n    color: colors.red[900],\r\n    flexDirection: 'column'\r\n  }\r\n})\r\n\r\nexport const PanelLoadMore: FC = () => (\r\n  <PanelLoadMoreStyled>\r\n    <div>\r\n      <CircularProgress size={24} thickness={4} />\r\n      <Typography variant='body2' color='text.primary'>\r\n        Loading more...\r\n      </Typography>\r\n    </div>\r\n  </PanelLoadMoreStyled>\r\n)\r\n\r\nconst PanelLoadMoreStyled = styled(Box)(({ theme }) => ({\r\n  position: 'absolute',\r\n  inset: 0,\r\n  bgcolor: theme.palette.mode === 'dark' ? 'rgba(0,0,0,0.12)' : 'rgba(255,255,255,0.12)',\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'center',\r\n  zIndex: 10,\r\n  backdropFilter: 'blur(1px)',\r\n  transition: 'opacity 0.2s',\r\n  '& > div': { display: 'flex', alignItems: 'center', gap: 10 }\r\n}))\r\n\r\nexport interface IPanelInfiniteScrollFooterProps {\r\n  loading?: boolean\r\n  hasNext?: boolean\r\n  currentCount: number\r\n  total?: number\r\n}\r\n\r\nexport const PanelInfiniteScrollFooter: FC<IPanelInfiniteScrollFooterProps> = ({ loading, hasNext, currentCount, total }) => {\r\n  // Status text on the left\r\n  let statusText = ''\r\n  if (loading) {\r\n    statusText = 'Loading more...'\r\n  } else if (hasNext) {\r\n    statusText = 'Scroll for more'\r\n  } else {\r\n    statusText = 'No more items'\r\n  }\r\n\r\n  // Range text on the right\r\n  const rangeText = currentCount > 0 ? (total != null ? `1–${currentCount} of ${total}` : `1–${currentCount}`) : '—'\r\n\r\n  return (\r\n    <PanelInfiniteScrollFooterStyled>\r\n      <Typography variant='caption' color='text.secondary'>\r\n        {statusText}\r\n      </Typography>\r\n      <Typography variant='caption' color='text.secondary'>\r\n        {rangeText}\r\n      </Typography>\r\n    </PanelInfiniteScrollFooterStyled>\r\n  )\r\n}\r\n\r\nconst PanelInfiniteScrollFooterStyled = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'space-between',\r\n  padding: theme.spacing(1, 1.5),\r\n  backgroundColor: theme.palette.background.paper,\r\n  borderTop: `1px solid ${theme.palette.mode === 'dark' ? 'rgba(255, 255, 255, 0.12)' : 'rgba(0, 0, 0, 0.12)'}`,\r\n  '.MuiTypography-root': { lineHeight: 1 }\r\n}))\r\n\r\nexport interface IPanelPaginationFooterProps {\r\n  page: number\r\n  pageSize: number\r\n  total?: number\r\n  hasNext?: boolean\r\n  hasPrev?: boolean\r\n  loading?: boolean\r\n  onPrevPage?: () => void\r\n  onNextPage?: () => void\r\n  onPageJump?: (page: number) => void\r\n}\r\n\r\nexport const PanelPaginationFooter: FC<IPanelPaginationFooterProps> = (props) => {\r\n  const { page, pageSize, total, hasNext, loading, onPrevPage, onNextPage, onPageJump } = props\r\n  const from = page * pageSize + 1\r\n  const to = total != null ? Math.min(from + pageSize - 1, total) : from + pageSize - 1\r\n\r\n  // Calculate page count for MUI Pagination (1-indexed)\r\n  const pageCount = total != null ? Math.ceil(total / pageSize) : undefined\r\n\r\n  const handlePageChange = (_event: any, value: number) => {\r\n    // MUI Pagination uses 1-indexed, convert to 0-indexed\r\n    const targetPage = value - 1\r\n\r\n    if (onPageJump) {\r\n      // Use direct page jump if available\r\n      onPageJump(targetPage)\r\n    } else {\r\n      // Fallback to prev/next if no jump handler\r\n      if (targetPage < page) {\r\n        onPrevPage?.()\r\n      } else if (targetPage > page) {\r\n        onNextPage?.()\r\n      }\r\n    }\r\n  }\r\n\r\n  return (\r\n    <PanelPaginationFooterStyled>\r\n      <Typography variant='caption' color='text.secondary'>\r\n        {total != null ? `${from}–${to} / ${total}` : `Page ${page + 1}`}\r\n      </Typography>\r\n      <Pagination\r\n        count={pageCount}\r\n        page={page + 1}\r\n        onChange={handlePageChange}\r\n        disabled={loading}\r\n        size='small'\r\n        showFirstButton={pageCount != null && pageCount > 5}\r\n        showLastButton={pageCount != null && pageCount > 5}\r\n        siblingCount={0}\r\n        boundaryCount={1}\r\n        hidePrevButton={pageCount == null && !hasNext}\r\n        hideNextButton={pageCount == null && !hasNext}\r\n      />\r\n    </PanelPaginationFooterStyled>\r\n  )\r\n}\r\n\r\nconst PanelPaginationFooterStyled = styled(Box)(({ theme }) => ({\r\n  padding: '8px 16px',\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'space-between',\r\n  backgroundColor: theme.palette.background.paper,\r\n  borderTop: `1px solid ${theme.palette.mode === 'dark' ? 'rgba(255, 255, 255, 0.12)' : 'rgba(0, 0, 0, 0.12)'}`\r\n}))\r\n"],"names":["stateWrapBase","padding","height","minHeight","width","border","concat","colors","grey","borderRadius","display","alignItems","justifyContent","textAlign","PanelLoading","props","_jsx","PanelLoadingStyled","_objectSpread","children","_jsxs","className","CircularProgress","size","Typography","variant","color","styled","Box","gap","borderColor","blue","backgroundColor","red","flexDirection","PanelNoData","PanelNoDataStyled","gutterBottom","PanelLoadMore","PanelLoadMoreStyled","thickness","_ref2","position","inset","bgcolor","theme","palette","mode","zIndex","backdropFilter","transition","PanelInfiniteScrollFooter","_ref3","loading","hasNext","currentCount","total","statusText","rangeText","PanelInfiniteScrollFooterStyled","_ref4","spacing","background","paper","borderTop","lineHeight","PanelPaginationFooter","page","pageSize","onPrevPage","onNextPage","onPageJump","from","to","Math","min","pageCount","ceil","undefined","PanelPaginationFooterStyled","Pagination","count","onChange","_event","value","targetPage","disabled","showFirstButton","showLastButton","siblingCount","boundaryCount","hidePrevButton","hideNextButton","_ref5"],"mappings":"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"}

package/dist/src/lab/data-surface/view-grid.js

@@ -0,0 +1,2 @@
+import{defineProperty as e,objectSpread2 as n,asyncToGenerator as i,regenerator as t,slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as a}from"react/jsx-runtime";import{styled as l,Box as d,Grid as u}from"@mui/material";import{useCallback as c,useMemo as g,useRef as s,useState as v,useLayoutEffect as p}from"react";import{getMaxGridItemHeight as h,GridItemDefault as m,getGridItemSizes as f,getMaxGridGap as x,resolveGridColumnsFromWidth as z}from"./view-grid.units.js";function I(e){var i=function(e){return function(i){var t=g(function(){var n,t,r;return{gap:x(i.gap,e.gap,8),sizes:f(null!==(n=i.sizes)&&void 0!==n?n:e.sizes),getterId:e.getterId,Component:null!==(t=null!==(r=i.Component)&&void 0!==r?r:e.Component)&&void 0!==t?t:m,gridItemHeight:h(i.gridItemHeight,e.gridItemHeight)}},[i.value,i.gap,i.sizes,i.Component,e]),r=g(function(){return i.value},[i.value]),a=function(e,n){var i=t.Component;return o(i,{value:e,index:n})};return o(w,{className:C.root,children:o("div",{className:C.scrollContainer,onScroll:function(e){var n,t=e.currentTarget;t.scrollHeight-t.scrollTop-t.clientHeight<=80&&(null===(n=i.onNearEnd)||void 0===n||n.call(i))},children:o(u,{container:!0,spacing:"".concat(t.gap,"px"),children:r.map(function(e,i){var r,l=null!==(r=t.getterId(e,i))&&void 0!==r?r:i;return o(u,n(n({className:C.gridItem,item:!0},t.sizes),{},{sx:{height:t.gridItemHeight},children:a(e,i)}),l)})})})})}}(e),t=function(e){return function(n){var i,t,l=g(function(){return n.value},[n.value]),u=g(function(){var i,t,r;return{gap:x(n.gap,e.gap,8),sizes:f(null!==(i=n.sizes)&&void 0!==i?i:e.sizes),getterId:e.getterId,Component:null!==(t=null!==(r=n.Component)&&void 0!==r?r:e.Component)&&void 0!==t?t:m,gridItemHeight:h(n.gridItemHeight,e.gridItemHeight),virtualized:Object.assign({},e.virtualizedConfig,n.virtualizedConfig)}},[n.gap,n.sizes,n.Component,e]),c=u.sizes,I=u.getterId,H=u.virtualized,b=u.gridItemHeight,w=s(null),T=v(0),M=r(T,2),y=M[0],N=M[1],V=v(0),j=r(V,2),G=j[0],D=j[1],R=v(null!==(i=H.scrollTop)&&void 0!==i?i:0),P=r(R,2),k=P[0],E=P[1],Y=h(b),O=Math.max(1,null!==(t=H.overscan)&&void 0!==t?t:4),_=x(u.gap),A=_/2;p(function(){if(w.current){var e=function(){var e,n,i,t,r=null!==(e=null===(n=w.current)||void 0===n?void 0:n.clientWidth)&&void 0!==e?e:0,o=null!==(i=null===(t=w.current)||void 0===t?void 0:t.clientHeight)&&void 0!==i?i:0;N(function(e){return e===r?e:r}),D(function(e){return e===o?e:o})};e();var n=new ResizeObserver(function(){e()});return n.observe(w.current),function(){return n.disconnect()}}},[]),p(function(){"number"==typeof H.scrollTop&&E(H.scrollTop)},[H.scrollTop]);var B=z(y,c),W=Y+_,q=g(function(){var e,n,i=l.length;if(0===i)return{startRow:0,endRow:-1,topSpacerHeight:0,bottomSpacerHeight:0,startIndex:0,endIndex:-1};var t=Math.ceil(i/B),r=Math.max(1,null!==(e=null!==(n=H.viewportHeight)&&void 0!==n?n:G)&&void 0!==e?e:1),o="number"==typeof H.scrollTop?H.scrollTop:k,a=Math.max(0,Math.floor(o/W)-O),d=Math.ceil(r/W),u=Math.min(t-1,a+d+2*O),c=a*B,g=Math.min(i-1,(u+1)*B-1);return{startRow:a,endRow:u,topSpacerHeight:a*W,bottomSpacerHeight:Math.max(0,(t-u-1)*W),startIndex:c,endIndex:g}},[B,l.length,O,W,H,k,G]),F=q.endIndex>=q.startIndex?l.slice(q.startIndex,q.endIndex+1):[],J=function(e,n){var i=u.Component;return o(i,{value:e,index:n})},K=[C.gridVirtualized,C.grid].join(" ");return o(S,{className:K,children:a(d,{ref:w,sx:{p:"".concat(A,"px"),overflowY:"auto",height:"100%",boxSizing:"border-box"},onScroll:function(e){var i,t=e.currentTarget;"number"!=typeof H.scrollTop&&E(t.scrollTop),t.scrollHeight-t.scrollTop-t.clientHeight<=80&&(null===(i=n.onNearEnd)||void 0===i||i.call(n))},children:[q.topSpacerHeight>0?o(d,{sx:{height:q.topSpacerHeight}}):null,o(d,{sx:{display:"grid",gap:"".concat(_,"px"),gridTemplateColumns:"repeat(".concat(B,", minmax(0, 1fr))")},children:F.map(function(e,n){var i,t=q.startIndex+n,r=null!==(i=I(e,t))&&void 0!==i?i:t;return o(d,{sx:{minHeight:Y,height:Y},children:J(e,t)},r)})}),q.bottomSpacerHeight>0?o(d,{sx:{height:q.bottomSpacerHeight}}):null]})})}}(e);return function(r){var a,l,d=null!==(a=null!==(l=r.renderStrategy)&&void 0!==l?l:e.renderStrategy)&&void 0!==a?a:"normal";return o("virtualized"===d?t:i,n({},r))}}function H(e){return function(n){var r,a,l,d=c(i(t().m(function e(){var i,r,o,a,l,d,u,c,g;return t().w(function(e){for(;;)switch(e.n){case 0:if("infiniteScroll"===n.loadMode){e.n=1;break}return e.a(2);case 1:if(null!==(i=n.pagination)&&void 0!==i&&i.hasNext){e.n=2;break}return e.a(2);case 2:if(!n.loading){e.n=3;break}return e.a(2);case 3:return u=null!==(r=null===(o=n.pagination)||void 0===o?void 0:o.page)&&void 0!==r?r:0,c=null!==(a=null===(l=n.pagination)||void 0===l?void 0:l.pageSize)&&void 0!==a?a:20,g=u+1,e.n=4,null===(d=n.onPageChange)||void 0===d?void 0:d.call(n,g,c);case 4:return e.a(2)}},e)})),[n.loadMode,null===(r=n.pagination)||void 0===r?void 0:r.hasNext,null===(a=n.pagination)||void 0===a?void 0:a.page,null===(l=n.pagination)||void 0===l?void 0:l.pageSize,n.loading,n.onPageChange]);return o(e,{value:n.value,gap:n.gap,sizes:n.sizes,gridItemHeight:n.gridItemHeight,renderStrategy:n.renderStrategy,Component:n.Component,virtualizedConfig:n.virtualizedConfig,onNearEnd:"infiniteScroll"===n.loadMode?d:void 0})}}var b={root:"DinoViewGrid-root",scrollContainer:"DinoViewGrid-scrollContainer",grid:"DinoViewGrid-grid",gridVirtualized:"DinoViewGrid-gridVirtualized",gridItem:"DinoViewGrid-item"},C=b,w=l(d)(function(n){var i=n.theme;return e({position:"relative",width:"100%",height:"100%",overflow:"hidden"},"& .".concat(C.scrollContainer),{position:"absolute",top:0,left:0,right:0,bottom:0,overflowY:"auto",padding:i.spacing(1)})}),S=l(d)(function(n){var i=n.theme;return e({position:"relative",width:"100%",height:"100%",overflow:"hidden",boxSizing:"border-box","& > div":{height:"100%"}},"& .".concat(C.scrollContainer),{position:"absolute",top:0,left:0,right:0,bottom:0,overflowY:"auto",padding:i.spacing(1)})});export{I as createViewGrid,H as createViewGridLoading,I as default,b as viewGridClasses};
+//# sourceMappingURL=view-grid.js.map