@economic/taco 2.27.2 → 2.28.0

package/dist/index.css

@@ -200,73 +200,35 @@
     @apply -mr-2 ml-0;
 }
 
-[data-taco='calendar'] .DayPicker-wrapper {
-    @apply relative select-none flex-row;
+[data-taco='calendar'] .rdp {
+    @apply select-none;
 }
-
-[data-taco='calendar'] .DayPicker-Months {
-    @apply flex flex-wrap justify-center;
-}
-
-[data-taco='calendar'] .DayPicker-Month {
-    @apply m-0 flex border-collapse select-none flex-col;
-}
-
-[data-taco='calendar'] .DayPicker-Weekdays {
-    @apply flex h-10 items-center;
-}
-
-[data-taco='calendar'] .DayPicker-WeekdaysRow {
-    @apply flex w-full justify-between;
+[data-taco='calendar'] .rdp-head {
+    @apply h-6;
 }
 
-[data-taco='calendar'] .DayPicker-Weekday {
-    @apply text-grey-700 flex-grow text-center uppercase;
+[data-taco='calendar'] .rdp-head_cell {
+    @apply text-grey-700 flex-grow text-center font-medium uppercase;
 }
 
-[data-taco='calendar'] .DayPicker-Weekday abbr[title] {
-    @apply no-underline;
+[data-taco='calendar'] .rdp-day {
+    @apply hover:wcag-grey-200 flex h-10 w-10 cursor-pointer items-center justify-center rounded-full;
 }
 
-[data-taco='calendar'] .DayPicker-Body {
-    @apply flex flex-col;
-}
-
-[data-taco='calendar'] .DayPicker-Week {
-    @apply flex w-full justify-between;
-}
-
-[data-taco='calendar'] .DayPicker-Day {
-    @apply flex h-10 w-10 cursor-pointer items-center justify-center rounded-full;
-}
-
-[data-taco='calendar'] .DayPicker--interactionDisabled .DayPicker-Day {
-    @apply cursor-default;
-}
-
-[data-taco='calendar'] .DayPicker-Footer {
-    @apply pt-1 text-center;
-}
-
-[data-taco='calendar'] .DayPicker-TodayButton {
-    @apply cursor-pointer border-none bg-transparent text-xs text-blue-500;
+[data-taco='calendar'] .rdp-day_today {
+    @apply font-bold text-blue-500;
 }
 
-[data-taco='calendar'] .DayPicker-TodayButton:hover {
-    @apply text-blue-300;
+[data-taco='calendar'] .rdp-day_selected {
+    @apply wcag-grey-200;
 }
 
 /* Default modifiers */
-
-[data-taco='calendar'] .DayPicker-Day--today {
-    @apply font-bold text-blue-500;
-}
-
 [data-taco='calendar'] .DayPicker-Day--outside {
     @apply text-grey-300 cursor-default;
 }
 
-[data-taco='calendar'] .DayPicker-Day--disabled {
+[data-taco='calendar'] .rdp-day_disabled {
     @apply text-grey-300 pointer-events-none cursor-default;
 }
 
@@ -456,6 +418,56 @@
     @apply mb-0;
 }
 
+[data-taco='list'] {
+    @apply flex flex-col gap-y-2;
+}
+
+[data-taco='list-item'] {
+    @apply border-grey-300 flex w-full items-center gap-x-3 rounded-lg border bg-white p-3 text-left;
+}
+
+[data-taco='list-item']:focus-visible {
+        @apply yt-focus z-10;
+    }
+
+[data-taco='list-item']:not([aria-disabled]):hover {
+        @apply cursor-pointer bg-black/[0.08];
+    }
+
+[data-taco='list-item'][aria-disabled] {
+        @apply pointer-events-none opacity-50;
+    }
+
+[data-taco='list-item-collapsible']:has([data-taco='list-item']:focus-visible) {
+        @apply z-10;
+    }
+
+[data-taco='list-item-collapsible'] > [data-taco='list-item'][aria-expanded='true']:not(:focus-visible) {
+        @apply rounded-b-none border-b-transparent;
+    }
+
+[data-taco='list-item-collapsible'] > div {
+        @apply border-grey-300 rounded-b-lg border border-t-0 bg-white p-3;
+    }
+
+[data-taco='list-group'] {
+    @apply flex flex-col;
+}
+
+[data-taco='list-group'] > [data-taco='list-item']:not(:first-child):not(:focus-visible),
+    [data-taco='list-group'] > [data-taco='list-item-collapsible']:not(:first-child) [data-taco='list-item']:not(:focus-visible) {
+        @apply !rounded-t-none border-t-transparent;
+    }
+
+[data-taco='list-group'] > [data-taco='list-item']:not(:last-child):not(:focus-visible),
+    [data-taco='list-group'] > [data-taco='list-item-collapsible']:not(:last-child) [data-taco='list-item']:not(:focus-visible) {
+        @apply !rounded-b-none;
+    }
+
+[data-taco='list-group'] > [data-taco='list-item-collapsible']:not(:last-child) > div {
+        @apply rounded-b-none;
+    }
+
 .yt-navigation__item a,
 .yt-navigation__item .yt-navigation__item__postfix {
     @apply text-black;

package/dist/index.d.ts

@@ -22,6 +22,7 @@ export * from './components/HoverCard/HoverCard';
 export * from './components/Icon/Icon';
 export * from './components/IconButton/IconButton';
 export * from './components/Input/Input';
+export * from './components/List/List';
 export * from './components/Listbox/Listbox';
 export * from './components/Menu/Menu';
 export * from './components/ModeSwitch/ModeSwitch';

package/dist/primitives/Table/types.d.ts

@@ -3,6 +3,7 @@ import { ColumnFilter as ReactTableColumnFilter, ColumnFiltersState as ReactTabl
 import { FontSize, FontSizes, ValueOf } from '../../types';
 import { MenuProps } from '../../components/Menu/Menu';
 import { MenuItemProps } from '../../components/Menu/components/Item';
+declare type TODO = any;
 export declare type TableRef = HTMLTableElement & {
     instance: {
         resetFiltering: () => void;
@@ -80,16 +81,15 @@ export declare type TableShortcutHandlerObject<TType = unknown> = {
     meta?: boolean;
     shift?: boolean;
 };
-export declare type TableFilterHandler = (filters: TableColumnFilter[]) => void | Promise<void>;
+export declare type TableFilterHandler = (filters: TableColumnFilter[]) => void;
 export declare type TableFontSize = keyof typeof FontSizes;
 export declare type TablePreset = 'complex' | 'list' | 'simple';
 export declare type TableRowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;
 export declare type TableScrollToIndexHandler = (index: number, options?: {
     align: 'start' | 'center' | 'end' | 'auto';
 }) => void;
-export declare type TableSearchHandler = (search: string | undefined) => void | Promise<void>;
-export declare type TableServerLoadPageHandler = (pageIndex: number, sorting: TableColumnSort[], filters: TableColumnFilter[]) => Promise<void>;
-export declare type TableServerLoadAllHandler = (sorting: TableColumnSort[], filters: TableColumnFilter[]) => Promise<void>;
+export declare type TableServerLoadPageHandler = (pageIndex: number, sorting: TableColumnSort[], filters: TableColumnFilter[], search: string | undefined) => Promise<void>;
+export declare type TableServerLoadAllHandler = (sorting: TableColumnSort[], filters: TableColumnFilter[], search: string | undefined) => Promise<void>;
 export declare enum TableServerLoadAllState {
     Incomplete = 0,
     Loading = 1,
@@ -97,7 +97,7 @@ export declare enum TableServerLoadAllState {
 }
 export declare type TableSettingsHandler = (settings: TableSettings) => void | Promise<void>;
 export declare type TableShortcuts<TType = unknown> = Record<string, TableShortcutHandlerFn<TType> | TableShortcutHandlerObject<TType>>;
-export declare type TableSortHandler = (sorting: TableColumnSort[]) => void | Promise<void>;
+export declare type TableSortHandler = (sorting: TableColumnSort[]) => void;
 export declare type TableCustomSettingsRenderer = (props: TableSettings) => React.ReactElement<MenuItemProps>[];
 export declare type TableEmptyStateRenderer = () => JSX.Element | null;
 export declare type TableSettings = {
@@ -172,7 +172,7 @@ export declare type TableCommonProps<TType = unknown> = TableFeatureProps & {
     onRowGoto?: TableRowGotoHandler;
     onRowSelect?: TableRowSelectHandler<TType>;
     onChangeFilter?: TableFilterHandler;
-    onChangeSearch?: TableSearchHandler;
+    onChangeSearch?: TODO;
     onChangeSettings?: TableSettingsHandler;
     onChangeSort?: TableSortHandler;
 };
@@ -374,3 +374,4 @@ export declare type TableTexts = {
         tooltip: string;
     };
 };
+export {};

package/dist/primitives/Table/useTableDataLoader.d.ts

@@ -1,10 +1,10 @@
-import { TableColumnFilter, TableColumnSort, TableFilterHandler, TableServerLoadPageHandler, TableServerLoadAllHandler, TableSortHandler, TableSearchHandler } from './types';
+import { TableColumnFilter, TableColumnSort, TableFilterHandler, TableServerLoadPageHandler, TableServerLoadAllHandler, TableSortHandler } from './types';
 export declare const DEFAULT_PAGE_SIZE = 100;
-export declare type useTableDataPageFetcher<TType = unknown> = (pageIndex: number, pageSize: number, sorting: TableColumnSort[], filters: TableColumnFilter[]) => Promise<{
+export declare type useTableDataPageFetcher<TType = unknown> = (pageIndex: number, pageSize: number, sorting: TableColumnSort[], filters: TableColumnFilter[], search: string | undefined) => Promise<{
     data: TType[];
     length: number;
 }>;
-export declare type useTableDataAllFetcher<TType = unknown> = (sorting: TableColumnSort[], filters: TableColumnFilter[]) => Promise<{
+export declare type useTableDataAllFetcher<TType = unknown> = (sorting: TableColumnSort[], filters: TableColumnFilter[], search: string | undefined) => Promise<{
     data: TType[];
     length: number;
 }>;
@@ -17,8 +17,7 @@ export declare type useTableDataLoaderValues<TType = unknown> = {
     loadAll: TableServerLoadAllHandler;
     loadPage: TableServerLoadPageHandler;
     onChangeFilter: TableFilterHandler;
-    onChangeSearch: TableSearchHandler;
     onChangeSort: TableSortHandler;
     pageSize: number;
 };
-export declare function useTableDataLoader<TType = unknown>(fetchPage: useTableDataPageFetcher<TType>, fetchAll: useTableDataAllFetcher<TType>, options?: useTableDataLoaderOptions): [useTableDataLoaderValues<TType>, () => void];
+export declare function useTableDataLoader<TType = unknown>(fetch: useTableDataPageFetcher<TType>, fetchAll: useTableDataAllFetcher<TType>, options?: useTableDataLoaderOptions): [useTableDataLoaderValues<TType>, () => void];

package/dist/primitives/Table/useTableManager/listeners/useTableSearchListener.d.ts

@@ -1,3 +1,2 @@
 import { Table as ReactTable } from '@tanstack/react-table';
-import { TableSearchHandler } from '../../types';
-export declare function useTableSearchListener<TType = unknown>(table: ReactTable<TType>, onChangeSearch?: TableSearchHandler): void;
+export declare function useTableSearchListener<TType = unknown>(table: ReactTable<TType>): void;