@invopop/popui 0.1.21 → 0.1.23

package/dist/BaseCard.svelte

@@ -20,7 +20,7 @@
   {...rest}
   {onclick}
 >
-  <div class="flex flex-col gap-2 w-full">
+  <div class="flex flex-col gap-2 w-full flex-1">
     <div class="flex items-start justify-between w-full">
       <div
         class="size-8 border border-border rounded-lg overflow-hidden flex items-center justify-center shrink-0"

package/dist/BaseTableCellContent.svelte

@@ -29,7 +29,7 @@
       </span>
     {:else if field.copy && data}
       <ButtonUuidCopy uuid={String(data)} full oncopied={onCopied} />
-    {:else}
+    {:else if data}
       <span class="hidden md:inline">{data}</span>
       <span class="md:hidden">{data ? data : badge || status ? '' : '-'}</span>
     {/if}

package/dist/DrawerContextSeparator.svelte

@@ -1 +1 @@
-<li class="bg-border h-px w-full my-1"></li>
+<li class="bg-border h-px min-h-px w-full my-1"></li>

package/dist/DropdownSelect.svelte

@@ -44,7 +44,8 @@
     (!multiple && items.find((i) => i.selected)?.iconClass) || 'text-foreground-default-secondary'
   )
   let selectedLabel = $derived(
-    `${selectedItems[0]?.label || ''}${selectedItems.length > 1 ? ' and more' : ''}` || placeholder
+    `${selectedItems[0]?.label || ''}${selectedItems.length > 1 && multiple ? ' and more' : ''}` ||
+      placeholder
   )
 
   let styles = $derived(
@@ -114,7 +115,13 @@
       {/if}
     </div>
   {/snippet}
-  <DrawerContext {widthClass} {multiple} {items} onclick={handleClick} onselect={handleSelected} />
+  <DrawerContext
+    widthClass="min-w-[256px]"
+    {multiple}
+    {items}
+    onclick={handleClick}
+    onselect={handleSelected}
+  />
 </BaseDropdown>
 
 <style>

package/dist/GlobalSearch.svelte

@@ -13,7 +13,7 @@
   const styles = $derived(
     clsx('cursor-pointer flex items-center border border-border-inverse-default rounded-lg h-8', {
       'gap-1 px-2 py-1.5 w-full hover:bg-background-selected-inverse': !collapsed,
-      'p-1.5': collapsed
+      'p-2': collapsed
     })
   )
 

package/dist/MenuItem.svelte

@@ -113,7 +113,7 @@
   >
     <span class="flex items-center space-x-1.5">
       {#if resolvedIcon}
-        <Icon src={resolvedIcon} theme={iconTheme} class="{iconStyles} h-4 w-4 text-white-70" />
+        <Icon src={resolvedIcon} theme={iconTheme} class="{iconStyles} h-4 w-4 text-icon-inverse" />
       {/if}
       {#if !collapsedSidebar}
         <span class="whitespace-nowrap tracking-normal">{label}</span>

package/dist/MenuItemCollapsible.svelte

@@ -26,7 +26,7 @@
 
 <span
   {title}
-  class="{styles} text-foreground-inverse text-base flex items-center justify-between rounded-lg h-8"
+  class="{styles} text-foreground-inverse text-base flex items-center justify-between rounded-lg h-8 font-medium"
 >
   <span class:space-x-2={!collapsed} class="flex items-center">
     {@render children?.()}
@@ -34,12 +34,12 @@
       <div>
         <div class="whitespace-nowrap max-w-[118px] truncate tracking-tight">{title}</div>
         {#if subtitle}
-          <div class="text-sm font-medium text-yellow-600">{subtitle}</div>
+          <div class="text-sm text-foreground-inverse-secondary">{subtitle}</div>
         {/if}
       </div>
     {/if}
   </span>
   {#if icon}
-    <Icon src={icon} class="h-4 w-4 text-white-40 mt-px" />
+    <Icon src={icon} class="h-4 w-4 text-icon-inverse" />
   {/if}
 </span>

package/dist/button/button.svelte

@@ -99,7 +99,7 @@
         class: '[&_svg]:!text-icon-default-bold'
       },
       {
-        variant: ['primary', 'warning'],
+        variant: ['primary', 'warning', 'dark-ghost'],
         iconOnly: true,
         class: '[&_svg]:!text-icon-inverse-bold'
       },

package/dist/table/table-cell.svelte

@@ -15,7 +15,7 @@
   bind:this={ref}
   data-slot="table-cell"
   class={cn(
-    'py-3 pl-3 pr-3 align-middle text-foreground font-normal text-base [&:has([role=menu])]:pl-1 relative z-1',
+    'py-3 pl-3 pr-3 align-middle text-foreground font-normal text-base [&:has([role=menu])]:pl-1 relative z-1 border-b border-border',
     className
   )}
   onclick={bubble('click')}

package/dist/table/table-row.svelte

@@ -18,7 +18,7 @@
   bind:this={ref}
   data-slot="table-row"
   class={cn(
-    'data-[state=selected]:bg-background-default-secondary data-[state=checked]:bg-background-selected transition-colors border-b border-border h-10',
+    'data-[state=selected]:bg-background-default-secondary data-[state=checked]:bg-background-selected transition-colors h-10',
     className
   )}
   {oncontextmenu}

package/dist/tailwind.theme.css

@@ -375,16 +375,16 @@
      ============================================ */
 
   /* Accent */
-  --color-accent-40: var(--color-green-40);
-  --color-accent-50: var(--color-green-50);
-  --color-accent-60: var(--color-green-60);
-  --color-accent-70: var(--color-green-70);
-  --color-accent-80: var(--color-sherwood-50);
-  --color-accent-alpha-5: var(--color-green-alpha-5);
-  --color-accent-alpha-10: var(--color-green-alpha-10);
-  --color-accent-alpha-20: var(--color-green-alpha-20);
-  --color-accent-alpha-30: var(--color-green-alpha-30);
-  --color-accent-alpha-40: var(--color-green-alpha-40);
+  --color-accent-40: color-mix(in srgb, var(--color-accent-50) 72%, white);
+  --color-accent-50: var(--color-base-accent, var(--color-green-50));
+  --color-accent-60: color-mix(in srgb, var(--color-accent-50) 84%, black);
+  --color-accent-70: color-mix(in srgb, var(--color-accent-50) 68%, black);
+  --color-accent-80: color-mix(in srgb, var(--color-accent-50) 52%, black);
+  --color-accent-alpha-5: color-mix(in srgb, var(--color-accent-50) 5%, transparent);
+  --color-accent-alpha-10: color-mix(in srgb, var(--color-accent-50) 10%, transparent);
+  --color-accent-alpha-20: color-mix(in srgb, var(--color-accent-50) 20%, transparent);
+  --color-accent-alpha-30: color-mix(in srgb, var(--color-accent-50) 30%, transparent);
+  --color-accent-alpha-40: color-mix(in srgb, var(--color-accent-50) 40%, transparent);
 
   /* Neutral */
   --color-neutral-5: var(--color-grey-5);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@invopop/popui",
   "license": "MIT",
-  "version": "0.1.21",
+  "version": "0.1.23",
   "scripts": {
     "dev": "vite dev",
     "dev:clean": "npm run clean && vite dev",
@@ -82,7 +82,7 @@
   "type": "module",
   "dependencies": {
     "@floating-ui/core": "^1.5.1",
-    "@invopop/ui-icons": "0.0.71",
+    "@invopop/ui-icons": "0.0.72",
     "@steeze-ui/heroicons": "^2.2.3",
     "@steeze-ui/svelte-icon": "^1.6.2",
     "@tailwindcss/vite": "^4.1.12",