@okta/odyssey-react-mui 1.45.0 → 1.47.1

package/dist/assets/{DataTable.stories-Db2HEmax.js → DataTable.stories-CaSfkouk.js}

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CnH95YSl.js";import{f as De}from"./index-BJMTVygn.js";import{r as n}from"./index-NdkWRN8K.js";import{d as Re,c as Se}from"./personData-CZJz4n06.js";import{M as xe}from"./Status-BYBMXN_H.js";import{M as f}from"./Box-BXOPvc0Q.js";import{d as $}from"./Typography-CiNRLenM.js";import{M as p}from"./Button-BOzIr8Jh.js";import{M as Te,a as ke}from"./ArrowRight-DCIAiEpA.js";import{d as E,M as h}from"./DataTable-CnCWIOTw.js";import{M as V}from"./EmptyState-DQoihCwU.js";import{M as R}from"./MenuItem-CuP47MJ-.js";/*!
+import{j as e}from"./jsx-runtime-CnH95YSl.js";import{f as we}from"./index-BJMTVygn.js";import{r as n}from"./index-NdkWRN8K.js";import{O as Re}from"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import{d as Se,c as xe}from"./personData-vW3mumD1.js";import{M as Te}from"./Status-BpzpxYZ-.js";import{M as f}from"./Box-BGpAHVQV.js";import{d as $}from"./Typography-DfSdXC7o.js";import{M as p}from"./Button-DGmXZ3jw.js";import{M as ke,a as ve}from"./ArrowRight-Bi2Pswgc.js";import{d as E,M as h}from"./DataTable-DeujVhYp.js";import{M as V}from"./EmptyState-9pxLjmqH.js";import{M as R}from"./MenuItem-n-UKDxiu.js";/*!
  * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.
  * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
  *
@@ -8,7 +8,7 @@ import{j as e}from"./jsx-runtime-CnH95YSl.js";import{f as De}from"./index-BJMTVy
  * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  *
  * See the License for the specific language governing permissions and limitations under the License.
- */const W=["paged","loadMore"],ve=({currentPage:d,currentNumberOfResults:a,isNextButtonDisabled:t,isPreviousButtonDisabled:s,onClickNext:o,onClickPrevious:l,paginationType:m})=>e.jsx(f,{sx:{display:"flex",gap:4,alignItems:"center"},children:m==="loadMore"?e.jsxs(e.Fragment,{children:[e.jsx(p,{isDisabled:t,label:"Show more",onClick:o,variant:"secondary"}),a&&e.jsxs($,{color:"textSecondary",children:[a," results"]})]}):e.jsxs(e.Fragment,{children:[e.jsx(p,{isDisabled:s,label:"Previous",onClick:l,startIcon:e.jsx(Te,{}),variant:"secondary"}),d&&e.jsx(f,{children:e.jsxs($,{color:"textSecondary",component:"span",children:["Page ",d]})}),e.jsx(p,{endIcon:e.jsx(ke,{}),isDisabled:t,label:"Next",onClick:o,variant:"secondary"})]})}),Me=n.memo(ve);Me.displayName="DataTablePagination";const g=[{accessorKey:"id",header:"Number"},{accessorKey:"name",header:"Name"},{accessorKey:"distance",header:"Distance from Sun (AU)"},{accessorKey:"visit",header:"Type of visit",filterVariant:"select",Cell:({cell:d})=>{const a=d.getValue(),t=a==="landing"?"success":a==="orbit"?"warning":"error";return e.jsx(xe,{label:a.charAt(0).toUpperCase()+a.slice(1),severity:t})},filterSelectOptions:[{label:"Flyby",value:"Flyby"},{label:"Orbit",value:"orbit"},{label:"Landing",value:"landing"}]}],w=[{id:1,name:"Mercury",distance:.4,visit:"landing"},{id:2,name:"Venus",distance:.7,visit:"landing"},{id:3,name:"Earth",distance:1,visit:"landing"},{id:4,name:"Mars",distance:1.5,visit:"landing"},{id:5,name:"Jupiter",distance:5.2,visit:"orbit"},{id:6,name:"Saturn",distance:9.6,visit:"landing"},{id:7,name:"Uranus",distance:19.2,visit:"flyby"},{id:8,name:"Neptune",distance:30,visit:"flyby"},{id:9,name:"Pluto",distance:39.5,visit:"flyby"}],Pe={component:h,argTypes:{columns:{description:"The columns that make up the table.",table:{type:{summary:"DataTableColumn<DataTableRowData>"}}},totalRows:{control:"number",description:`The total number of rows in the table. Optional, because it's sometimes impossible to calculate.Used in table pagination to know when to disable the "next"/"more" button.`,table:{type:{summary:"number"}}},getRowId:{description:"The function to get the ID of a row",table:{type:{summary:"((originalRow: MRT_RowData, index: number, parentRow: MRT_Row<MRT_RowData>) => string)"}}},initialDensity:{options:E,control:{type:"radio"},description:"The initial density (height & padding) of the table rows. This is available even if the table density isn't changeable by the end user via hasChangeableDensity.",table:{type:{summary:E.join(" | ")}}},hasChangeableDensity:{control:"boolean",description:"If true, the end user will be able to change the table density.",table:{type:{summary:"boolean"}}},hasColumnResizing:{control:"boolean",description:"If true, the end user can resize individual columns.",table:{type:{summary:"boolean"}}},hasColumnVisibility:{control:"boolean",description:"If true, the end user will be able to show/hide columns.",table:{type:{summary:"boolean"}}},hasFilters:{control:"boolean",description:"If true, the end user will be able to filter columns.",table:{type:{summary:"boolean"}}},hasPagination:{control:"boolean",description:"If true, the table will include pagination controls.",table:{type:{summary:"boolean"}}},hasRowSelection:{control:"boolean",description:"If true, the table will include checkboxes on each row, enabling the user to select some or all rows.",table:{type:{summary:"boolean"}}},hasSearch:{control:"boolean",description:"If true, the global table search controls will be shown.",table:{type:{summary:"boolean"}}},hasSorting:{control:"boolean",description:"If true, the end user can sort columns (ascending, descending, or neither)",table:{type:{summary:"boolean"}}},hasRowReordering:{control:"boolean",description:"If true, the end user can reorder rows via a drag-and-drop interface.",table:{type:{summary:"boolean"}}},hasSearchSubmitButton:{control:"boolean",description:"If true, the search field will include a Search button, rather than firing on input change.",table:{type:{summary:"boolean"}}},errorMessage:{control:"text",description:"If defined, the DataTable will indicate an error.",table:{type:{summary:"string"}}},searchDelayTime:{control:"number",description:"The debounce time, in milliseconds, for the search input firing `onChangeSearch` when changed. If `hasSearchSubmitButton` is true, this doesn't do anything.",table:{type:{summary:"number"}}},onChangeRowSelection:{description:"Callback that fires when a row (or rows) is selected or unselected.",table:{type:{summary:"(rowSelection: MRT_RowSelectionState) => void"}}},getData:{description:"Callback that fires whenever the table needs to fetch new data, due to changes in page, results per page, search input, filters, or sorting",table:{type:{summary:"({ page, resultsPerPage, search, filters, sort }: { page?: number; resultsPerPage?: number; search?: string; filters?: DataFilter[]; sort?: MRT_SortingState; }) => DataTableRowData"}}},onReorderRows:{description:"Callback that fires when the user reorders rows within the table. Can be used to propogate order change to the backend.",table:{type:{summary:"({ rowId, newRowIndex }: { rowId: string; newRowIndex: number; }) => void"}}},currentPage:{control:"number",description:"The current page number.",table:{type:{summary:"number"}}},resultsPerPage:{control:"number",description:"The number of results per page.",table:{type:{summary:"number"}}},isPaginationMoreDisabled:{control:"boolean",description:"If true, the pagination next or show more button will be disabled.",table:{type:{summary:"boolean"}}},maxPages:{control:"number",description:"The highest page number allowed to be manually input in pagination.",table:{type:{summary:"number"}}},maxResultsPerPage:{control:"number",description:"The largest number of rows allowed to be shown per page. This only affects the row input in pagination.",table:{type:{summary:"number"}}},paginationType:{options:W,control:{type:"radio"},description:'The type of pagination controls shown. Defaults to next/prev buttons, but can be set to a simple "Load more" button by setting to "loadMore".',table:{type:{summary:W.join(" | ")}}},rowActionButtons:{description:"Action buttons to display in each row.",table:{type:{summary:"(row: DataTableRowData) => ReactElement<typeof Button | typeof Fragment>"}}},rowActionMenuItems:{description:"Menu items to include in the optional actions menu on each row.",table:{type:{summary:'(row: DataTableRowData) => MenuButtonProps["children"]'}}},bulkActionMenuItems:{description:"Menu items to include in the bulk actions menu, which appears above the table if a row or rows are selected",table:{type:{summary:'(selectedRows: MRT_RowSelectionState) => MenuButtonProps["children"]'}}},emptyPlaceholder:{description:"The component to display when the table is displaying the initial empty state.",table:{type:{summary:"ReactElement<typeof EmptyState>"}}},noResultsPlaceholder:{description:"The component to display when the query returns no results.",table:{type:{summary:"ReactElement<typeof EmptyState>"}}},renderDetailPanel:{description:"The optional component to display when expanding a row.",table:{type:{summary:"(props: { row: MRT_Row<MRT_RowData>; table: MRT_TableInstance<MRT_RowData>; }) => ReactNode"}}},additionalActionButton:{description:"An optional action button above the table.",table:{type:{summary:"ReactNode"}}},additionalActionMenuItems:{description:"MenuItems that go in an optional action menu above the table.",table:{type:{summary:"ReactNode"}}}},args:{onChangeRowSelection:De()}},D=({data:d,...a})=>{let t=d;const{search:s,filters:o,sort:l,page:m=1,resultsPerPage:r=20}=a;s&&(t=t.filter(u=>Object.values(u).some(y=>y.toString().toLowerCase().includes(s.toLowerCase())))),o&&(t=t.filter(u=>o.every(({id:y,value:b})=>{var x,T;if(b==null)return!0;if(Array.isArray(b))return b.some(C=>{var L;return typeof C=="string"?(L=u[y])==null?void 0:L.toString().toLowerCase().includes(C.toString().toLowerCase()):!1});if(y==="startLetter"&&typeof u.name=="string"){const C=(x=u.name[0])==null?void 0:x.toLowerCase();return b==="vowel"?"aeiou".includes(C):b==="consonant"?!"aeiou".includes(C):!0}return(T=u[y])==null?void 0:T.toString().toLowerCase().includes(b.toString().toLowerCase())}))),l&&l.length>0&&t.sort((u,y)=>{for(const{id:b,desc:x}of l){const T=u[b],C=y[b];if(T<C)return x?1:-1;if(T>C)return x?-1:1}return 0});const i=(m-1)*r,c=i+r;return t=t.slice(i,c),t},S=({data:d,...a})=>{const t=d,{rowId:s,newRowIndex:o}=a,l=t.findIndex(m=>m.id===s);if(l!==-1){const[m]=t.splice(l,1);t.splice(o,0,m)}return t},k={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(w),o=n.useCallback(({...r})=>D({data:t,...r}),[t]),l=n.useCallback(({...r})=>{const i=S({data:t,...r});s(i)},[t]),m=n.useCallback(r=>{Object.keys(r).length>0&&console.log(`${Object.keys(r).length} selected`)},[]);return e.jsx(h,{...a,columns:g,getData:o,onChangeRowSelection:m,onReorderRows:l})}},v={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!0,hasFilters:!0,hasPagination:!0,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!0,totalRows:200},render:function(a){const[t,s]=n.useState(Re),o=n.useCallback(({...u})=>D({data:t,...u}),[t]),l=n.useCallback(({...u})=>{const y=S({data:t,...u});s(y)},[t]),m=n.useCallback(u=>{Object.keys(u).length>0&&console.log(`${Object.keys(u).length} selected`)},[]),r=n.useMemo(()=>e.jsx(V,{description:"All relevant data will be displayed and can be searched and filtered",heading:"Start by adding data assets",PrimaryCallToActionComponent:e.jsx(p,{label:"Primary",variant:"primary"}),SecondaryCallToActionComponent:e.jsx(p,{label:"Secondary",variant:"secondary"})}),[]),i=n.useMemo(()=>e.jsx(V,{description:"You should try searching or filtering for something else.",heading:"Whoops, there's nothing here!"}),[]),c=u=>e.jsxs(e.Fragment,{children:[e.jsx(R,{onClick:()=>console.log(u),children:"Action 1"}),e.jsx(R,{onClick:()=>console.log(u),children:"Action 2"})]});return e.jsx(h,{...a,bulkActionMenuItems:c,columns:Se,emptyPlaceholder:r,getData:o,noResultsPlaceholder:i,onChangeRowSelection:m,onReorderRows:l,rowActionMenuItems:c})}},M={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(w),o=n.useCallback(({...r})=>{const i=S({data:t,...r});s(i)},[t]),l=n.useCallback(r=>{Object.keys(r).length>0&&console.log(`${Object.keys(r).length} selected`)},[]),m=n.useMemo(()=>e.jsx(V,{description:"All relevant data will be displayed and can be searched and filtered",heading:"Start by adding data assets",PrimaryCallToActionComponent:e.jsx(p,{label:"Primary",variant:"primary"}),SecondaryCallToActionComponent:e.jsx(p,{label:"Secondary",variant:"secondary"})}),[]);return e.jsx(h,{...a,columns:g,emptyPlaceholder:m,getData:()=>[],onChangeRowSelection:l,onReorderRows:o})}},P={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!1,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(w),o=n.useCallback(({...r})=>D({data:t,...r}),[t]),l=n.useCallback(({...r})=>{const i=S({data:t,...r});s(i)},[t]),m=n.useMemo(()=>[...g,{id:"startLetter",label:"Name starting with...",render:r=>e.jsxs(f,{sx:{display:"flex",flexDirection:"column",alignContent:"stretch",gap:2},children:[e.jsx(f,{sx:{display:"flex",alignItems:"stretch",flexDirection:"column"},children:e.jsx(p,{isFullWidth:!0,label:"Vowel",onClick:()=>r({filterId:"startLetter",value:"vowel"}),variant:"secondary"})}),e.jsx(f,{sx:{display:"flex",alignItems:"stretch",flexDirection:"column"},children:e.jsx(p,{isFullWidth:!0,label:"Consonant",onClick:()=>r({filterId:"startLetter",value:"consonant"}),variant:"secondary"})}),e.jsx(f,{sx:{display:"flex",alignItems:"stretch",flexDirection:"column"},children:e.jsx(p,{isFullWidth:!0,label:"Any",onClick:()=>r({filterId:"startLetter",value:"any"}),variant:"secondary"})})]})}],[]);return e.jsx(h,{...a,columns:g,filters:m,getData:o,onReorderRows:l})}},I={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(w),o=n.useCallback(({...i})=>D({data:t,...i}),[t]),l=n.useCallback(({...i})=>{const c=S({data:t,...i});s(c)},[t]),m=n.useCallback(i=>{Object.keys(i).length>0&&console.log(`${Object.keys(i).length} selected`)},[]),r=n.useMemo(()=>[...g.filter(c=>c.id!=="visit"),{id:"visit",label:"Type of visit 🚀",render:c=>e.jsxs(f,{children:[e.jsx(p,{label:"🛬 Landing",onClick:()=>c({filterId:"visit",value:"landing"}),variant:"secondary"}),e.jsx(p,{label:"🛰️ Orbit",onClick:()=>c({filterId:"visit",value:"orbit"}),variant:"secondary"}),e.jsx(p,{label:"🛸 Flyby",onClick:()=>c({filterId:"visit",value:"flyby"}),variant:"secondary"}),e.jsx(p,{label:"🤷‍♂️ Any",onClick:()=>c({filterId:"visit",value:""}),variant:"secondary"})]})}],[]);return e.jsx(h,{...a,columns:g,filters:r,getData:o,onChangeRowSelection:m,onReorderRows:l})}},j={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!1,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t]=n.useState(w),s=n.useCallback(({...l})=>D({data:t,...l}),[t]),o=n.useMemo(()=>[...g,{id:"startLetter",label:"Starting letter",variant:"select",options:[{label:"Vowel",value:"vowel"},{label:"Consonant",value:"consonant"}]}],[]);return e.jsx(h,{...a,columns:g,filters:o,getData:s})}},A={render:function(){const a=w,t=n.useCallback(({...o})=>D({data:a,...o}),[a]),s=n.useCallback(({row:o})=>e.jsx(f,{children:`This planet is ${o.original.name}.`}),[]);return e.jsx(h,{columns:g,getData:t,renderDetailPanel:s})}},F={render:function(){const a=w,t=n.useCallback(({...o})=>D({data:a,...o}),[a]),s=n.useCallback(({row:o})=>{if(o.original.visit!=="landing")return e.jsx(f,{children:`Humanity has not landed on ${o.original.name} (yet).`})},[]);return e.jsx(h,{columns:g,getData:t,renderDetailPanel:s})}},B={render:function(){const a=n.useMemo(()=>[{accessorKey:"truncated",header:"Truncated"},{accessorKey:"wrapped",header:"Wrapped",hasTextWrapping:!0}],[]),t=n.useCallback(()=>{const s=[];return Array(10).fill(null).forEach(()=>{s.push({truncated:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla a quam et vulputate. Phasellus elementum turpis a lacus feugiat bibendum.",wrapped:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla a quam et vulputate. Phasellus elementum turpis a lacus feugiat bibendum."})}),s},[]);return e.jsx(h,{columns:a,getData:t,hasColumnResizing:!0})}},O={render:function(){const a=n.useMemo(()=>[{accessorKey:"name",header:"Name",grow:!0},{accessorKey:"apps",header:"Apps"},{accessorKey:"users",header:"Users assigned"}],[]),t=n.useCallback(()=>[{name:"Core engineering access",apps:5,users:10},{name:"Core sales access",apps:8,users:28},{name:"Super user access",apps:3,users:1}],[]),s=o=>e.jsxs(e.Fragment,{children:[e.jsx(R,{onClick:()=>console.log(o),children:"Action 1"}),e.jsx(R,{onClick:()=>console.log(o),children:"Action 2"})]});return e.jsx(h,{columns:a,getData:t,hasColumnResizing:!0,hasSearch:!0,hasSorting:!0,rowActionMenuItems:s})}},z={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(w),o=n.useCallback(({...c})=>D({data:t,...c}),[t]),l=n.useCallback(({...c})=>{const u=S({data:t,...c});s(u)},[t]),m=n.useCallback(c=>{Object.keys(c).length>0&&console.log(`${Object.keys(c).length} selected`)},[]),r=e.jsx(p,{label:"Add widget",variant:"primary"}),i=e.jsxs(e.Fragment,{children:[e.jsx(R,{onClick:()=>console.log("Action 1"),children:"Action 1"}),e.jsx(R,{onClick:()=>console.log("Action 2"),children:"Action 2"})]});return e.jsx(h,{...a,additionalActionButton:r,additionalActionMenuItems:i,columns:g,getData:o,onChangeRowSelection:m,onReorderRows:l})}};var _,K,G;k.parameters={...k.parameters,docs:{...(_=k.parameters)==null?void 0:_.docs,source:{originalSource:`{
+ */const W=["paged","loadMore"],Me=({currentPage:d,currentNumberOfResults:a,isNextButtonDisabled:t,isPreviousButtonDisabled:s,onClickNext:o,onClickPrevious:l,paginationType:m})=>e.jsx(f,{sx:{display:"flex",gap:4,alignItems:"center"},children:m==="loadMore"?e.jsxs(e.Fragment,{children:[e.jsx(p,{isDisabled:t,label:"Show more",onClick:o,variant:"secondary"}),a&&e.jsxs($,{color:"textSecondary",children:[a," results"]})]}):e.jsxs(e.Fragment,{children:[e.jsx(p,{isDisabled:s,label:"Previous",onClick:l,startIcon:e.jsx(ke,{}),variant:"secondary"}),d&&e.jsx(f,{children:e.jsxs($,{color:"textSecondary",component:"span",children:["Page ",d]})}),e.jsx(p,{endIcon:e.jsx(ve,{}),isDisabled:t,label:"Next",onClick:o,variant:"secondary"})]})}),Pe=n.memo(Me);Pe.displayName="DataTablePagination";const g=[{accessorKey:"id",header:"Number"},{accessorKey:"name",header:"Name"},{accessorKey:"distance",header:"Distance from Sun (AU)"},{accessorKey:"visit",header:"Type of visit",filterVariant:"select",Cell:({cell:d})=>{const a=d.getValue(),t=a==="landing"?"success":a==="orbit"?"warning":"error";return e.jsx(Te,{label:a.charAt(0).toUpperCase()+a.slice(1),severity:t})},filterSelectOptions:[{label:"Flyby",value:"Flyby"},{label:"Orbit",value:"orbit"},{label:"Landing",value:"landing"}]}],D=[{id:1,name:"Mercury",distance:.4,visit:"landing"},{id:2,name:"Venus",distance:.7,visit:"landing"},{id:3,name:"Earth",distance:1,visit:"landing"},{id:4,name:"Mars",distance:1.5,visit:"landing"},{id:5,name:"Jupiter",distance:5.2,visit:"orbit"},{id:6,name:"Saturn",distance:9.6,visit:"landing"},{id:7,name:"Uranus",distance:19.2,visit:"flyby"},{id:8,name:"Neptune",distance:30,visit:"flyby"},{id:9,name:"Pluto",distance:39.5,visit:"flyby"}],Ie={component:h,decorators:[Re],argTypes:{columns:{description:"The columns that make up the table.",table:{type:{summary:"DataTableColumn<DataTableRowData>"}}},totalRows:{control:"number",description:`The total number of rows in the table. Optional, because it's sometimes impossible to calculate.Used in table pagination to know when to disable the "next"/"more" button.`,table:{type:{summary:"number"}}},getRowId:{description:"The function to get the ID of a row",table:{type:{summary:"((originalRow: MRT_RowData, index: number, parentRow: MRT_Row<MRT_RowData>) => string)"}}},initialDensity:{options:E,control:{type:"radio"},description:"The initial density (height & padding) of the table rows. This is available even if the table density isn't changeable by the end user via hasChangeableDensity.",table:{type:{summary:E.join(" | ")}}},hasChangeableDensity:{control:"boolean",description:"If true, the end user will be able to change the table density.",table:{type:{summary:"boolean"}}},hasColumnResizing:{control:"boolean",description:"If true, the end user can resize individual columns.",table:{type:{summary:"boolean"}}},hasColumnVisibility:{control:"boolean",description:"If true, the end user will be able to show/hide columns.",table:{type:{summary:"boolean"}}},hasFilters:{control:"boolean",description:"If true, the end user will be able to filter columns.",table:{type:{summary:"boolean"}}},hasPagination:{control:"boolean",description:"If true, the table will include pagination controls.",table:{type:{summary:"boolean"}}},hasRowSelection:{control:"boolean",description:"If true, the table will include checkboxes on each row, enabling the user to select some or all rows.",table:{type:{summary:"boolean"}}},hasSearch:{control:"boolean",description:"If true, the global table search controls will be shown.",table:{type:{summary:"boolean"}}},hasSorting:{control:"boolean",description:"If true, the end user can sort columns (ascending, descending, or neither)",table:{type:{summary:"boolean"}}},hasRowReordering:{control:"boolean",description:"If true, the end user can reorder rows via a drag-and-drop interface.",table:{type:{summary:"boolean"}}},hasSearchSubmitButton:{control:"boolean",description:"If true, the search field will include a Search button, rather than firing on input change.",table:{type:{summary:"boolean"}}},errorMessage:{control:"text",description:"If defined, the DataTable will indicate an error.",table:{type:{summary:"string"}}},searchDelayTime:{control:"number",description:"The debounce time, in milliseconds, for the search input firing `onChangeSearch` when changed. If `hasSearchSubmitButton` is true, this doesn't do anything.",table:{type:{summary:"number"}}},onChangeRowSelection:{description:"Callback that fires when a row (or rows) is selected or unselected.",table:{type:{summary:"(rowSelection: MRT_RowSelectionState) => void"}}},getData:{description:"Callback that fires whenever the table needs to fetch new data, due to changes in page, results per page, search input, filters, or sorting",table:{type:{summary:"({ page, resultsPerPage, search, filters, sort }: { page?: number; resultsPerPage?: number; search?: string; filters?: DataFilter[]; sort?: MRT_SortingState; }) => DataTableRowData"}}},onReorderRows:{description:"Callback that fires when the user reorders rows within the table. Can be used to propogate order change to the backend.",table:{type:{summary:"({ rowId, newRowIndex }: { rowId: string; newRowIndex: number; }) => void"}}},currentPage:{control:"number",description:"The current page number.",table:{type:{summary:"number"}}},resultsPerPage:{control:"number",description:"The number of results per page.",table:{type:{summary:"number"}}},isPaginationMoreDisabled:{control:"boolean",description:"If true, the pagination next or show more button will be disabled.",table:{type:{summary:"boolean"}}},maxPages:{control:"number",description:"The highest page number allowed to be manually input in pagination.",table:{type:{summary:"number"}}},maxResultsPerPage:{control:"number",description:"The largest number of rows allowed to be shown per page. This only affects the row input in pagination.",table:{type:{summary:"number"}}},paginationType:{options:W,control:{type:"radio"},description:'The type of pagination controls shown. Defaults to next/prev buttons, but can be set to a simple "Load more" button by setting to "loadMore".',table:{type:{summary:W.join(" | ")}}},rowActionButtons:{description:"Action buttons to display in each row.",table:{type:{summary:"(row: DataTableRowData) => ReactElement<typeof Button | typeof Fragment>"}}},rowActionMenuItems:{description:"Menu items to include in the optional actions menu on each row.",table:{type:{summary:'(row: DataTableRowData) => MenuButtonProps["children"]'}}},bulkActionMenuItems:{description:"Menu items to include in the bulk actions menu, which appears above the table if a row or rows are selected",table:{type:{summary:'(selectedRows: MRT_RowSelectionState) => MenuButtonProps["children"]'}}},emptyPlaceholder:{description:"The component to display when the table is displaying the initial empty state.",table:{type:{summary:"ReactElement<typeof EmptyState>"}}},noResultsPlaceholder:{description:"The component to display when the query returns no results.",table:{type:{summary:"ReactElement<typeof EmptyState>"}}},renderDetailPanel:{description:"The optional component to display when expanding a row.",table:{type:{summary:"(props: { row: MRT_Row<MRT_RowData>; table: MRT_TableInstance<MRT_RowData>; }) => ReactNode"}}},additionalActionButton:{description:"An optional action button above the table.",table:{type:{summary:"ReactNode"}}},additionalActionMenuItems:{description:"MenuItems that go in an optional action menu above the table.",table:{type:{summary:"ReactNode"}}}},args:{onChangeRowSelection:we()}},w=({data:d,...a})=>{let t=d;const{search:s,filters:o,sort:l,page:m=1,resultsPerPage:r=20}=a;s&&(t=t.filter(u=>Object.values(u).some(y=>y.toString().toLowerCase().includes(s.toLowerCase())))),o&&(t=t.filter(u=>o.every(({id:y,value:b})=>{var x,T;if(b==null)return!0;if(Array.isArray(b))return b.some(C=>{var L;return typeof C=="string"?(L=u[y])==null?void 0:L.toString().toLowerCase().includes(C.toString().toLowerCase()):!1});if(y==="startLetter"&&typeof u.name=="string"){const C=(x=u.name[0])==null?void 0:x.toLowerCase();return b==="vowel"?"aeiou".includes(C):b==="consonant"?!"aeiou".includes(C):!0}return(T=u[y])==null?void 0:T.toString().toLowerCase().includes(b.toString().toLowerCase())}))),l&&l.length>0&&t.sort((u,y)=>{for(const{id:b,desc:x}of l){const T=u[b],C=y[b];if(T<C)return x?1:-1;if(T>C)return x?-1:1}return 0});const i=(m-1)*r,c=i+r;return t=t.slice(i,c),t},S=({data:d,...a})=>{const t=d,{rowId:s,newRowIndex:o}=a,l=t.findIndex(m=>m.id===s);if(l!==-1){const[m]=t.splice(l,1);t.splice(o,0,m)}return t},k={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(D),o=n.useCallback(({...r})=>w({data:t,...r}),[t]),l=n.useCallback(({...r})=>{const i=S({data:t,...r});s(i)},[t]),m=n.useCallback(r=>{Object.keys(r).length>0&&console.log(`${Object.keys(r).length} selected`)},[]);return e.jsx(h,{...a,columns:g,getData:o,onChangeRowSelection:m,onReorderRows:l})}},v={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!0,hasFilters:!0,hasPagination:!0,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!0,totalRows:200},render:function(a){const[t,s]=n.useState(Se),o=n.useCallback(({...u})=>w({data:t,...u}),[t]),l=n.useCallback(({...u})=>{const y=S({data:t,...u});s(y)},[t]),m=n.useCallback(u=>{Object.keys(u).length>0&&console.log(`${Object.keys(u).length} selected`)},[]),r=n.useMemo(()=>e.jsx(V,{description:"All relevant data will be displayed and can be searched and filtered",heading:"Start by adding data assets",PrimaryCallToActionComponent:e.jsx(p,{label:"Primary",variant:"primary"}),SecondaryCallToActionComponent:e.jsx(p,{label:"Secondary",variant:"secondary"})}),[]),i=n.useMemo(()=>e.jsx(V,{description:"You should try searching or filtering for something else.",heading:"Whoops, there's nothing here!"}),[]),c=u=>e.jsxs(e.Fragment,{children:[e.jsx(R,{onClick:()=>console.log(u),children:"Action 1"}),e.jsx(R,{onClick:()=>console.log(u),children:"Action 2"})]});return e.jsx(h,{...a,bulkActionMenuItems:c,columns:xe,emptyPlaceholder:r,getData:o,noResultsPlaceholder:i,onChangeRowSelection:m,onReorderRows:l,rowActionMenuItems:c})}},M={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(D),o=n.useCallback(({...r})=>{const i=S({data:t,...r});s(i)},[t]),l=n.useCallback(r=>{Object.keys(r).length>0&&console.log(`${Object.keys(r).length} selected`)},[]),m=n.useMemo(()=>e.jsx(V,{description:"All relevant data will be displayed and can be searched and filtered",heading:"Start by adding data assets",PrimaryCallToActionComponent:e.jsx(p,{label:"Primary",variant:"primary"}),SecondaryCallToActionComponent:e.jsx(p,{label:"Secondary",variant:"secondary"})}),[]);return e.jsx(h,{...a,columns:g,emptyPlaceholder:m,getData:()=>[],onChangeRowSelection:l,onReorderRows:o})}},P={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!1,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(D),o=n.useCallback(({...r})=>w({data:t,...r}),[t]),l=n.useCallback(({...r})=>{const i=S({data:t,...r});s(i)},[t]),m=n.useMemo(()=>[...g,{id:"startLetter",label:"Name starting with...",render:r=>e.jsxs(f,{sx:{display:"flex",flexDirection:"column",alignContent:"stretch",gap:2},children:[e.jsx(f,{sx:{display:"flex",alignItems:"stretch",flexDirection:"column"},children:e.jsx(p,{isFullWidth:!0,label:"Vowel",onClick:()=>r({filterId:"startLetter",value:"vowel"}),variant:"secondary"})}),e.jsx(f,{sx:{display:"flex",alignItems:"stretch",flexDirection:"column"},children:e.jsx(p,{isFullWidth:!0,label:"Consonant",onClick:()=>r({filterId:"startLetter",value:"consonant"}),variant:"secondary"})}),e.jsx(f,{sx:{display:"flex",alignItems:"stretch",flexDirection:"column"},children:e.jsx(p,{isFullWidth:!0,label:"Any",onClick:()=>r({filterId:"startLetter",value:"any"}),variant:"secondary"})})]})}],[]);return e.jsx(h,{...a,columns:g,filters:m,getData:o,onReorderRows:l})}},I={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(D),o=n.useCallback(({...i})=>w({data:t,...i}),[t]),l=n.useCallback(({...i})=>{const c=S({data:t,...i});s(c)},[t]),m=n.useCallback(i=>{Object.keys(i).length>0&&console.log(`${Object.keys(i).length} selected`)},[]),r=n.useMemo(()=>[...g.filter(c=>c.id!=="visit"),{id:"visit",label:"Type of visit 🚀",render:c=>e.jsxs(f,{children:[e.jsx(p,{label:"🛬 Landing",onClick:()=>c({filterId:"visit",value:"landing"}),variant:"secondary"}),e.jsx(p,{label:"🛰️ Orbit",onClick:()=>c({filterId:"visit",value:"orbit"}),variant:"secondary"}),e.jsx(p,{label:"🛸 Flyby",onClick:()=>c({filterId:"visit",value:"flyby"}),variant:"secondary"}),e.jsx(p,{label:"🤷‍♂️ Any",onClick:()=>c({filterId:"visit",value:""}),variant:"secondary"})]})}],[]);return e.jsx(h,{...a,columns:g,filters:r,getData:o,onChangeRowSelection:m,onReorderRows:l})}},j={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!1,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t]=n.useState(D),s=n.useCallback(({...l})=>w({data:t,...l}),[t]),o=n.useMemo(()=>[...g,{id:"startLetter",label:"Starting letter",variant:"select",options:[{label:"Vowel",value:"vowel"},{label:"Consonant",value:"consonant"}]}],[]);return e.jsx(h,{...a,columns:g,filters:o,getData:s})}},A={render:function(){const a=D,t=n.useCallback(({...o})=>w({data:a,...o}),[a]),s=n.useCallback(({row:o})=>e.jsx(f,{children:`This planet is ${o.original.name}.`}),[]);return e.jsx(h,{columns:g,getData:t,renderDetailPanel:s})}},F={render:function(){const a=D,t=n.useCallback(({...o})=>w({data:a,...o}),[a]),s=n.useCallback(({row:o})=>{if(o.original.visit!=="landing")return e.jsx(f,{children:`Humanity has not landed on ${o.original.name} (yet).`})},[]);return e.jsx(h,{columns:g,getData:t,renderDetailPanel:s})}},B={render:function(){const a=n.useMemo(()=>[{accessorKey:"truncated",header:"Truncated"},{accessorKey:"wrapped",header:"Wrapped",hasTextWrapping:!0}],[]),t=n.useCallback(()=>{const s=[];return Array(10).fill(null).forEach(()=>{s.push({truncated:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla a quam et vulputate. Phasellus elementum turpis a lacus feugiat bibendum.",wrapped:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla a quam et vulputate. Phasellus elementum turpis a lacus feugiat bibendum."})}),s},[]);return e.jsx(h,{columns:a,getData:t,hasColumnResizing:!0})}},O={render:function(){const a=n.useMemo(()=>[{accessorKey:"name",header:"Name",grow:!0},{accessorKey:"apps",header:"Apps"},{accessorKey:"users",header:"Users assigned"}],[]),t=n.useCallback(()=>[{name:"Core engineering access",apps:5,users:10},{name:"Core sales access",apps:8,users:28},{name:"Super user access",apps:3,users:1}],[]),s=o=>e.jsxs(e.Fragment,{children:[e.jsx(R,{onClick:()=>console.log(o),children:"Action 1"}),e.jsx(R,{onClick:()=>console.log(o),children:"Action 2"})]});return e.jsx(h,{columns:a,getData:t,hasColumnResizing:!0,hasSearch:!0,hasSorting:!0,rowActionMenuItems:s})}},z={args:{hasChangeableDensity:!0,hasColumnResizing:!0,hasColumnVisibility:!1,hasFilters:!0,hasPagination:!1,hasRowSelection:!0,hasSearch:!0,hasSorting:!0,hasRowReordering:!1},render:function(a){const[t,s]=n.useState(D),o=n.useCallback(({...c})=>w({data:t,...c}),[t]),l=n.useCallback(({...c})=>{const u=S({data:t,...c});s(u)},[t]),m=n.useCallback(c=>{Object.keys(c).length>0&&console.log(`${Object.keys(c).length} selected`)},[]),r=e.jsx(p,{label:"Add widget",variant:"primary"}),i=e.jsxs(e.Fragment,{children:[e.jsx(R,{onClick:()=>console.log("Action 1"),children:"Action 1"}),e.jsx(R,{onClick:()=>console.log("Action 2"),children:"Action 2"})]});return e.jsx(h,{...a,additionalActionButton:r,additionalActionMenuItems:i,columns:g,getData:o,onChangeRowSelection:m,onReorderRows:l})}};var _,K,G;k.parameters={...k.parameters,docs:{...(_=k.parameters)==null?void 0:_.docs,source:{originalSource:`{
   args: {
     hasChangeableDensity: true,
     hasColumnResizing: true,
@@ -392,7 +392,7 @@ import{j as e}from"./jsx-runtime-CnH95YSl.js";import{f as De}from"./index-BJMTVy
       </>;
     return <DataTable columns={columns} getData={getData} hasColumnResizing hasSearch hasSorting rowActionMenuItems={actionMenuItems} />;
   }
-}`,...(ye=(be=O.parameters)==null?void 0:be.docs)==null?void 0:ye.source}}};var fe,Ce,we;z.parameters={...z.parameters,docs:{...(fe=z.parameters)==null?void 0:fe.docs,source:{originalSource:`{
+}`,...(ye=(be=O.parameters)==null?void 0:be.docs)==null?void 0:ye.source}}};var fe,Ce,De;z.parameters={...z.parameters,docs:{...(fe=z.parameters)==null?void 0:fe.docs,source:{originalSource:`{
   args: {
     hasChangeableDensity: true,
     hasColumnResizing: true,
@@ -435,4 +435,4 @@ import{j as e}from"./jsx-runtime-CnH95YSl.js";import{f as De}from"./index-BJMTVy
       </>;
     return <DataTable {...props} additionalActionButton={additionalActionButton} additionalActionMenuItems={additionalActionMenuItems} columns={planetColumns} getData={getData} onChangeRowSelection={onChangeRowSelection} onReorderRows={onReorderRows} />;
   }
-}`,...(we=(Ce=z.parameters)==null?void 0:Ce.docs)==null?void 0:we.source}}};const Ie=["Default","API","Empty","CustomFilters","FilterWithCustomRender","CustomFilterWithDefaultVariant","Details","ConditionalDetails","Truncation","ColumnGrowDemo","AdditionalActions"],Ke=Object.freeze(Object.defineProperty({__proto__:null,API:v,AdditionalActions:z,ColumnGrowDemo:O,ConditionalDetails:F,CustomFilterWithDefaultVariant:j,CustomFilters:P,Default:k,Details:A,Empty:M,FilterWithCustomRender:I,Truncation:B,__namedExportsOrder:Ie,default:Pe},Symbol.toStringTag,{value:"Module"}));export{v as A,P as C,Ke as D,M as E,I as F,k as a,j as b};
+}`,...(De=(Ce=z.parameters)==null?void 0:Ce.docs)==null?void 0:De.source}}};const je=["Default","API","Empty","CustomFilters","FilterWithCustomRender","CustomFilterWithDefaultVariant","Details","ConditionalDetails","Truncation","ColumnGrowDemo","AdditionalActions"],Ne=Object.freeze(Object.defineProperty({__proto__:null,API:v,AdditionalActions:z,ColumnGrowDemo:O,ConditionalDetails:F,CustomFilterWithDefaultVariant:j,CustomFilters:P,Default:k,Details:A,Empty:M,FilterWithCustomRender:I,Truncation:B,__namedExportsOrder:je,default:Ie},Symbol.toStringTag,{value:"Module"}));export{v as A,P as C,Ne as D,M as E,I as F,k as a,j as b};

package/dist/assets/{DataView _labs_-DZnmSNME.js → DataView _labs_-CqZlEyu1.js }

@@ -1,4 +1,4 @@
-import{j as e}from"./jsx-runtime-CnH95YSl.js";import{useMDXComponents as r}from"./index-BeeV6X6A.js";import"./index-CtY5BB1N.js";import{M as a,T as s,S as l,D as d,C as c}from"./index-BpVuOoKb.js";import{D as i,a as p}from"./DataView _labs_.stories-CusuCHkc.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./preview-BzLY45Eo.js";import"./iframe-C-RQ_TKY.js";import"./DocsRenderer-CFRXHY34-DEwq8OPY.js";import"./client-akVMpN0m.js";import"./index-DieBXP3Z.js";import"./index-BJTM6NaI.js";import"./index-B5xazMy1.js";import"./index-CXQShRbs.js";import"./index-DrFu-skq.js";import"./index-B885ELRa.js";import"./v4-BOvFkHkt.js";import"./index-BJMTVygn.js";import"./personData-Ci-ru1S9.js";import"./Status-BYBMXN_H.js";import"./MuiPropsContext-DhRylJZk.js";import"./Chip-BOK8DR8m.js";import"./createTheme-BmPXDA4p.js";import"./createSvgIcon-DiC7XVU3.js";import"./SvgIcon-BQAg6Jm7.js";import"./DefaultPropsProvider-B7tpShA7.js";import"./generateUtilityClasses-DYvjsuMV.js";import"./chipClasses-BMWKl3Eu.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./ButtonBase-BqXVk-1q.js";import"./assertThisInitialized-B9jnkVVz.js";import"./inheritsLoose-CWawPfk8.js";import"./TransitionGroupContext-twgBS-Q3.js";import"./buttonBaseClasses-CSPKg76d.js";import"./DataView-BQBP0FCs.js";import"./Box-BXOPvc0Q.js";import"./Box-C2ekHaOu.js";import"./useTheme-C05bJKih.js";import"./Callout-CaNoXhaj.js";import"./Link-ClKgpBXG.js";import"./Typography-D7-qxuiy.js";import"./typographyClasses-D8vr2n3l.js";import"./ExternalLink-DTdulgUc.js";import"./OdysseyDesignTokensContext-BWQIA5ie.js";import"./Typography-CiNRLenM.js";import"./useUniqueId-Bsgqe1tm.js";import"./createUniqueId-ByTaVY63.js";import"./useTranslation-vEf1lqoc.js";import"./context-D_qJ2zXV.js";import"./AlertTitle-DlG4YQWR.js";import"./useSlot-F4Qz2Wzp.js";import"./resolveComponentProps-DMpKAZvD.js";import"./isHostComponent-DVu5iVWx.js";import"./Close-DA_Sph0R.js";import"./IconButton-CK9Do7vj.js";import"./Paper-DbAuDGNI.js";import"./alertTitleClasses-CSPeaunQ.js";import"./useScrollIndication-BJW9jXaC.js";import"./EmptyState-DQoihCwU.js";import"./DataFilters-DVey1xPT.js";import"./Autocomplete-UE4wqxn0.js";import"./useAutocomplete-C7VK9p4p.js";import"./Field-ilPS333M.js";import"./List-W5kRT_jR.js";import"./ListContext-C02XM7tn.js";import"./ListItem-CcduKzQu.js";import"./utils-iop7lDec.js";import"./useFormControl-BMISTZuX.js";import"./FormLabel-BLeax9q3.js";import"./formLabelClasses-xMgYguuN.js";import"./ScreenReaderText-vq7_Ob_I.js";import"./visuallyHidden-Dan1xhjv.js";import"./FormHelperText-ZkUAjajs.js";import"./FieldHint-Cv7aMlpU.js";import"./inputUtils-Dbi8XkA6.js";import"./InputBase--xDu7aWm.js";import"./inputBaseClasses-PAjj3ZBN.js";import"./ownerWindow-HkKU3E4x.js";import"./ownerDocument-DW-IO8s5.js";import"./debounce-Be36O1Ab.js";import"./GlobalStyles-BxDN_5FT.js";import"./Autocomplete-MfScEzbR.js";import"./ArrowDropDown-bSngWMh1.js";import"./autocompleteClasses-Bi4FgC8v.js";import"./Popper-CwLH-7YW.js";import"./Portal-Bvf2g5iG.js";import"./popper-CMBiYTiD.js";import"./useId-cMcvCE23.js";import"./useControlled-NQulfz4l.js";import"./ListSubheader-DXKE8lW0.js";import"./Checkbox-BTj1hXUa.js";import"./FormControlLabel-CxCmH5hv.js";import"./formControlLabelClasses-BtjP4uib.js";import"./Stack-Ba8l39se.js";import"./useThemeProps-Dy5sAWyz.js";import"./Checkbox-luq82K1t.js";import"./SwitchBase-Bja5dn-O.js";import"./checkboxClasses-Dtdq1kQG.js";import"./CheckboxGroup-Cgc2chES.js";import"./FormGroup-BaCH3e06.js";import"./formGroupClasses-D9ChLj7o.js";import"./Radio-D85jg1Ri.js";import"./Radio-Bi1_KmSD.js";import"./radioClasses-f3ayyf7y.js";import"./createChainedFunction-BO_9K8Jh.js";import"./RadioGroup-BS6oYUQf.js";import"./SearchField-jc9ws93I.js";import"./OdysseyThemeProvider-aR5shtx6.js";import"./useContrastMode-BthoHtLy.js";import"./tooltipClasses-C74HjonW.js";import"./tableRowClasses-inqOIkjd.js";import"./menuItemClasses-DFm3-Sf1.js";import"./inputAdornmentClasses-DYNxkEwO.js";import"./buttonClasses-DtIJBSf4.js";import"./CloseCircleFilled-D2aBlgBe.js";import"./WarningFilled-Y3Vw7n_w.js";import"./Check-BmyOKfcL.js";import"./Close-DA7fBExu.js";import"./ChevronDown-BnAWuc8V.js";import"./index-CpbQl8EB.js";import"./InputAdornment-CFgP75Dd.js";import"./Search-BvCmvJcV.js";import"./Tag-CjPSrGAL.js";import"./TagList-BQKiA1TW.js";import"./TextField-CZ0hstP2.js";import"./Button-BOzIr8Jh.js";import"./BaseButton-B5c4cgt8.js";import"./Tooltip-3088PjcT.js";import"./Tooltip-B4GIR2eB.js";import"./Grow-CIie3qhp.js";import"./utils-gq6yExow.js";import"./Button-BqwcAVQ-.js";import"./Filter-BAXcmMyf.js";import"./Menu-CGJO1mMf.js";import"./Modal-CW5mOzJG.js";import"./getScrollbarSize-Bqq2hMjQ.js";import"./MenuList-BboivbXC.js";import"./MenuItem-DjSqFwdt.js";import"./Trans-DZ9nii1x.js";import"./ChevronRight-BB0bQIRj.js";import"./MenuButton-OjJFnmOD.js";import"./BaseMenuButton-DbGGXXbP.js";import"./MenuContext-DKMyPMNY.js";import"./More-axx2rGKU.js";import"./CircularProgress-Ur28_31H.js";import"./CircularProgress-DNk4kmx6.js";import"./Card-B5eIV1vH.js";import"./Skeleton-BJLiCr2o.js";import"./colorManipulator-O7SU8zMv.js";import"./CardActionArea-yvoWcAsF.js";import"./ChevronUp-B9JV-jmd.js";import"./MenuItem-CuP47MJ-.js";import"./List-0o0OI1E9.js";import"./i18next-DbMy2do-.js";import"./index.esm-D7MwfoQM.js";import"./DialogContent-C_FnZ5ZS.js";import"./DialogTitle-CLDQZ0bg.js";import"./useMobilePicker-CfUl5sFz.js";import"./Select-DVJCNQIV.js";import"./useThemeProps-BG38P4ul.js";import"./Collapse-P1H1b4lO.js";import"./Divider-CsWa3KCo.js";import"./DateTimePicker-CnXcHc5u.js";import"./Tabs-ChAj4m0g.js";import"./DatePicker-DIRg7n4d.js";import"./Show-qQzUH4Sq.js";import"./Pagination-CgxBDBwQ.js";import"./ArrowRight-DCIAiEpA.js";import"./constants-CyailK6t.js";import"./Refresh-CPgGX1hz.js";function o(t){const n={blockquote:"blockquote",code:"code",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(a,{of:i}),`
+import{j as e}from"./jsx-runtime-CnH95YSl.js";import{useMDXComponents as r}from"./index-BeeV6X6A.js";import"./index-BsDcV5Kh.js";import{M as a,T as s,S as l,D as d,C as c}from"./index-BqmbiZ7T.js";import{D as i,a as h}from"./DataView _labs_.stories-CXjSXDeF.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./preview-BprB3Yzd.js";import"./iframe-CXLAql3E.js";import"./DocsRenderer-CFRXHY34-IKzmQUB4.js";import"./client-ByW5HbEz.js";import"./index-DieBXP3Z.js";import"./index-BJTM6NaI.js";import"./index-B5xazMy1.js";import"./index-CXQShRbs.js";import"./index-DrFu-skq.js";import"./index-B-lxVbXh.js";import"./v4-CtRu48qb.js";import"./index-BJMTVygn.js";import"./OdysseyStorybookThemeDecorator-BRjYVaUu.js";import"./OdysseyThemeProvider-BBwjgzn2.js";import"./OdysseyProvider-2xjMTEu6.js";import"./personData-zrA1iJih.js";import"./Status-BpzpxYZ-.js";import"./MuiPropsContext-DhRylJZk.js";import"./Chip-DXaMeATb.js";import"./createSvgIcon-DsUj6UQo.js";import"./useIsFocusVisible-DH0qxT5e.js";import"./ButtonBase-BAQsCgRq.js";import"./TransitionGroupContext-DLI0IzWy.js";import"./constants-CGUp4oSR.js";import"./constants-CyailK6t.js";import"./DataView-CYkwjPzk.js";import"./Box-BGpAHVQV.js";import"./Box-CWTB5xfE.js";import"./Callout-DyDdgWdc.js";import"./Link-DI6v1ROk.js";import"./Link-BnBknBcu.js";import"./Typography-Yf1Zkad_.js";import"./ExternalLink-BZ-Yczsk.js";import"./Typography-DfSdXC7o.js";import"./useUniqueId-Bsgqe1tm.js";import"./createUniqueId-ByTaVY63.js";import"./AlertTitle-BbBpDTwd.js";import"./useSlot-CaOQD_17.js";import"./resolveComponentProps-BzfJewMt.js";import"./isHostComponent-DVu5iVWx.js";import"./Close-ATS01D1v.js";import"./IconButton-OY9nJWpv.js";import"./Paper-XsV8SWR9.js";import"./useScrollIndication-C4t86M0g.js";import"./EmptyState-9pxLjmqH.js";import"./DataFilters-49CUFFBF.js";import"./Autocomplete-DD8JT6Eb.js";import"./useAutocomplete-DwWveFvJ.js";import"./index.esm-HelN6IAt.js";import"./Field-lyECanzU.js";import"./List-Be7fhh4_.js";import"./ListItem-C8ebNPnP.js";import"./utils-iop7lDec.js";import"./useFormControl-BMISTZuX.js";import"./FormLabel-BLj3hKkg.js";import"./ScreenReaderText-CM78bF1y.js";import"./visuallyHidden-Dan1xhjv.js";import"./FormHelperText-qF3DX-zz.js";import"./FieldHint-C3tXb7u4.js";import"./inputUtils-Dbi8XkA6.js";import"./InputBase-DSZ9ZgyW.js";import"./ownerWindow-HkKU3E4x.js";import"./ownerDocument-DW-IO8s5.js";import"./debounce-Be36O1Ab.js";import"./Autocomplete-CXy6JKKy.js";import"./ArrowDropDown-LYMnJjPD.js";import"./Popper-DjhYeJJy.js";import"./Portal-GAJY6Au9.js";import"./useControlled-NQulfz4l.js";import"./ListSubheader-Bwc0JItn.js";import"./Checkbox-BCh8HZ37.js";import"./FormControlLabel-BKhSSavj.js";import"./Stack-DKhviX3e.js";import"./createStyled-D0LG5-qz.js";import"./useThemeProps-D4857Xca.js";import"./Checkbox-BVTNXOF7.js";import"./SwitchBase-D-uzeIbM.js";import"./CheckboxGroup-D-ykWUnV.js";import"./FormGroup-Cuk9jkbL.js";import"./Radio-tkNaA8vy.js";import"./Radio-BimAm2in.js";import"./createChainedFunction-BO_9K8Jh.js";import"./RadioGroup-DhVJQTpS.js";import"./RadioGroup-DRNCKA-f.js";import"./SearchField-CYM6nbh5.js";import"./InputAdornment-D4SsBOPe.js";import"./Search-CkfJXFe5.js";import"./Tag-BgjQI7VM.js";import"./TagList-DGN86KvF.js";import"./TextField-BuwBI2RX.js";import"./Button-DGmXZ3jw.js";import"./BaseButton-COF38VLB.js";import"./Tooltip-XQJL1Byd.js";import"./Tooltip-D4AWrTBw.js";import"./Grow-DacPmog-.js";import"./utils-DkZjDCLm.js";import"./Button-CdPi1pZc.js";import"./Filter-Dx8z3DNi.js";import"./Menu-CHod3UUY.js";import"./Modal-B1-40kNg.js";import"./getScrollbarSize-Bqq2hMjQ.js";import"./Fade-CVbWKXvx.js";import"./MenuList-CW8ri5AI.js";import"./MenuItem-B0_vCuIq.js";import"./ChevronRight-DkL07pJu.js";import"./MenuButton-Dr4RJoKG.js";import"./BaseMenuButton-pigMBOEp.js";import"./MenuContext-DKMyPMNY.js";import"./More-D1qrtSvt.js";import"./CircularProgress-Dfpt5LAz.js";import"./CircularProgress-B5_VbcVt.js";import"./Card-CaY-V3Lt.js";import"./Skeleton-dfR0DjWP.js";import"./colorManipulator-CjGkpVfF.js";import"./CardActions-X5bUcMdJ.js";import"./CardActionArea-BTMPt80M.js";import"./ChevronUp-DBzjQ0Vq.js";import"./MenuItem-n-UKDxiu.js";import"./List-DsAZFSEg.js";import"./index.esm-CaIA2ztV.js";import"./DialogContent-_oGbCJT8.js";import"./dialogActionsClasses-BWrWITLY.js";import"./DialogTitle-DyO9kr6R.js";import"./useMobilePicker-5I3ooa1D.js";import"./Select-9yKLDVKS.js";import"./useThemeProps-Bfa1XAV-.js";import"./Collapse-COoe3Qtd.js";import"./Divider-DsFAYUeD.js";import"./tableSortLabelClasses-DtOYtU1J.js";import"./DateTimePicker-LSjVE-IM.js";import"./Tabs-DzeBYjfY.js";import"./DatePicker-txjKmLSi.js";import"./Show-BmUFIvXd.js";import"./Pagination-D6myvUfo.js";import"./ArrowRight-Bi2Pswgc.js";import"./Refresh-GVzSl4pN.js";function o(t){const n={blockquote:"blockquote",code:"code",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...r(),...t.components};return e.jsxs(e.Fragment,{children:[e.jsx(a,{of:i}),`
 `,e.jsx(s,{of:i}),`
 `,e.jsx(l,{of:i}),`
 `,e.jsx(d,{of:i}),`
@@ -328,5 +328,5 @@ perfect for things like an "Add row" button or a menu of actions that affect the
 `,e.jsx(n.p,{children:'This will display a "Load More" button instead of page numbers, allowing users to incrementally load more data.'}),`
 `,e.jsx(n.h2,{id:"customization",children:"Customization"}),`
 `,e.jsxs(n.p,{children:["While the ",e.jsx(n.code,{children:"DataView"})," come with pre-styled elements matching the Okta Odyssey design system, you can further customize the appearance using the theming capabilities of Material-UI and Emotion styled components."]}),`
-`,e.jsx(c,{of:p}),`
-`,e.jsxs(n.p,{children:["Explore the stories in this Storybook to see more examples and configurations of the ",e.jsx(n.code,{children:"DataView"})," suite."]})]})}function bt(t={}){const{wrapper:n}={...r(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(o,{...t})}):o(t)}export{bt as default};
+`,e.jsx(c,{of:h}),`
+`,e.jsxs(n.p,{children:["Explore the stories in this Storybook to see more examples and configurations of the ",e.jsx(n.code,{children:"DataView"})," suite."]})]})}function _n(t={}){const{wrapper:n}={...r(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(o,{...t})}):o(t)}export{_n as default};