@economic/taco 1.41.0 → 2.0.0-alpha.5

package/dist/index.css

@@ -147,7 +147,7 @@
         @apply focus:yt-focus flex flex-col focus:rounded-sm;
     }
     table.yt-table thead.yt-table__head tr.yt-table__row {
-        @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-t-0 border-b-2 font-bold;
+        @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-b-2 border-t-0 font-bold;
     }
 
     table.yt-table thead.yt-table__head tr.yt-table__row th.yt-table__cell {
@@ -162,7 +162,6 @@
         @apply flex-1 truncate p-2 text-center align-middle;
     }
 
-    [aria-hidden] > [data-taco='menu'],
     [aria-hidden] > [data-taco='hanger'] {
         @apply invisible;
     }
@@ -638,3 +637,132 @@
 #yt-table__drag__placeholder {
     @apply flex w-3/12 rounded bg-blue-500 p-4 font-bold text-white;
 }
+
+/* cells */
+[role='cell'],
+[role='columnheader'] {
+    @apply border-grey-300 bg-white;
+}
+
+[role='cell']:not([data-highlighted='true']),
+[role='columnheader'] {
+    @apply flex px-4;
+}
+
+[role='cell'][data-align='left'],
+[role='columnheader'][data-align='left'] {
+    @apply justify-start text-left;
+}
+
+[role='cell'][data-align='center'],
+[role='columnheader'][data-align='center'] {
+    @apply justify-center text-center;
+}
+
+[role='cell'][data-align='right'],
+[role='columnheader'][data-align='right'] {
+    @apply justify-end text-right;
+}
+
+[role='row']:not(:last-child) [role='cell'] {
+    @apply border-b;
+}
+
+/* hovered row */
+[data-pause-hover='false'] [role='row']:hover [role='cell'] {
+    @apply bg-grey-100;
+}
+
+/* current row */
+[role='row'][data-current='true'] [role='cell'] {
+    @apply bg-grey-200;
+}
+
+/* selected row */
+[role='row'][data-selected='true']:not([aria-grabbed='true']) [role='cell'] {
+    @apply !bg-blue-100;
+}
+
+/* dragging row */
+[role='row'][aria-grabbed='true'] [role='cell'] {
+    @apply !wcag-blue-500;
+}
+
+/* error row */
+[role='row'][data-error='true'] [role='cell'] {
+    @apply !bg-red-100/30;
+}
+
+/* cell component overrides */
+
+/* small font size */
+[data-font-size='small'] [role='cell'] [data-taco='badge'],
+[data-font-size='small'] [role='cell'] [data-taco='badge-icon'],
+[data-font-size='small'] [role='cell'] [data-taco='icon'] {
+    @apply !-my-0.5 !text-xs;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='tag'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'],
+[data-font-size='small'] [role='cell'] [data-taco='input-container'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'] {
+    @apply !-my-1;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'] {
+    @apply h-6 min-h-[theme(spacing.6)] px-1.5 text-xs;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)];
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] [data-taco='icon'] {
+    @apply !h-4 !w-4;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='checkbox'],
+[data-font-size='small'] [role='cell'] [data-taco='checkbox-container'],
+[data-font-size='small'] [role='cell'] [data-taco='switch'],
+[data-font-size='small'] [role='cell'] [data-taco='switch-container'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='checkbox-container'] [data-taco='checkbox'],
+[data-font-size='small'] [role='cell'] [data-taco='switch-container'] [data-taco='switch'] {
+    @apply !my-0;
+}
+
+/* medium font size */
+[data-font-size='medium'] [role='cell'] [data-taco='tag'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='medium'] [role='cell'] [data-taco='Select2'],
+[data-font-size='medium'] [role='cell'] [data-taco='input-container'] {
+    @apply !-my-1.5;
+}
+
+/* large font size */
+[data-font-size='large'] [role='cell'] [data-taco='tag'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='Select2'],
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] {
+    @apply !-my-2;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input'],
+[data-font-size='large'] [role='cell'] [data-taco='Select2'] {
+    @apply h-10 px-2.5 text-lg;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply !h-10 !w-10;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] [data-taco='icon'] {
+    @apply !h-6 !w-6;
+}

package/dist/index.d.ts

@@ -33,6 +33,7 @@ export * from './components/Provider/Provider';
 export * from './components/Provider/Localization';
 export * from './components/RadioGroup/RadioGroup';
 export * from './components/SearchInput/SearchInput';
+export * from './components/SearchInput2/SearchInput2';
 export * from './components/Select/Select';
 export * from './components/Select2/Select2';
 export * from './components/Shortcut/Shortcut';
@@ -40,6 +41,7 @@ export * from './components/Spinner/Spinner';
 export * from './components/Switch/Switch';
 export * from './components/Table/Table';
 export * from './components/Table2/Table2';
+export * from './components/Table3/Table3';
 export * from './components/Tabs/Tabs';
 export * from './components/Tag/Tag';
 export * from './components/Textarea/Textarea';
@@ -59,6 +61,7 @@ export * from './hooks/useBoundaryOverflowDetection';
 export * from './hooks/useBoundingClientRectListener';
 export * from './hooks/useIntersectionObserver';
 export * from './hooks/useIsLargeScreen';
+export * from './hooks/useLazyEffect';
 export * from './hooks/useMatchMedia';
 export * from './hooks/useMergedRef';
 export * from './utils/hooks/useDropTarget';