@wishbone-media/spark 0.53.0 → 1.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wishbone-media/spark",
-  "version": "0.53.0",
+  "version": "1.1.0",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",

package/src/components/SparkCard.vue

@@ -13,18 +13,11 @@
     <div
       v-else-if="hasDefaultHeader"
       :class="[
-        'border-b border-gray-300',
-        $slots.nav
-          ? 'flex items-stretch justify-between gap-4 px-6'
-          : 'flex items-center justify-between gap-4 px-6 py-4',
+        'flex h-20 items-stretch justify-between gap-4 border-b border-gray-300 px-5',
         props.headerClass,
       ]"
     >
-      <!-- Left cluster: tab nav replaces back/title/extra when provided -->
-      <div v-if="$slots.nav" class="flex min-w-0 items-stretch">
-        <slot name="nav" />
-      </div>
-      <div v-else class="flex min-w-0 items-center gap-3">
+      <div class="flex min-w-0 items-center gap-3">
         <SparkButton
           v-if="props.backTo"
           variant="secondary"
@@ -40,15 +33,14 @@
           {{ props.title }}
         </h3>
         <slot name="title-extra" />
+        <div v-if="$slots.nav" class="flex self-stretch items-stretch">
+          <slot name="nav" />
+        </div>
+        <slot name="header-left" />
       </div>
 
-      <!-- Right cluster: metadata then actions -->
-      <div
-        v-if="$slots.meta || $slots.actions"
-        class="flex shrink-0 items-center gap-4"
-        :class="$slots.nav ? 'py-3' : ''"
-      >
-        <slot name="meta" />
+      <div v-if="$slots['header-right'] || $slots.actions" class="flex shrink-0 items-center gap-4">
+        <slot name="header-right" />
         <slot name="actions" />
       </div>
     </div>
@@ -64,10 +56,6 @@
     >
       <slot />
     </div>
-
-    <div v-if="$slots.footer" :class="['border-t border-gray-300 p-5', props.footerClass]">
-      <slot name="footer" />
-    </div>
   </div>
 </template>
 
@@ -107,14 +95,9 @@ const props = defineProps({
     type: String,
     default: '',
   },
-  // Extra classes for the footer wrapper.
-  footerClass: {
-    type: String,
-    default: '',
-  },
   // Default header: main heading text. Renders the header without needing
-  // the #header slot; combine with backTo and the title-extra/nav/meta/actions
-  // slots. The #header slot overrides the default header entirely.
+  // the #header slot; combine with backTo and the named/catch-all slots.
+  // The #header slot overrides the default header entirely.
   title: {
     type: String,
     default: null,
@@ -132,7 +115,13 @@ const bodyEl = ref(null)
 
 const hasDefaultHeader = computed(() =>
   Boolean(
-    props.title || props.backTo || slots['title-extra'] || slots.nav || slots.meta || slots.actions,
+    props.title ||
+    props.backTo ||
+    slots['title-extra'] ||
+    slots.nav ||
+    slots['header-left'] ||
+    slots['header-right'] ||
+    slots.actions,
   ),
 )
 

package/src/components/SparkTable.vue

@@ -70,6 +70,7 @@ const defaultTableSettings = {
   stretchH: 'all',
   colWidths: 50,
   renderAllRows: true,
+  height: 'auto',
   readOnly: true,
   tableClassName: 'spark-table-table',
   readOnlyCellClassName: 'read-only',