@dosgato/dialog 0.0.42 → 0.0.44

package/Dialog.svelte

@@ -55,7 +55,9 @@ $: describedby = [title ? labelid : undefined, descid].filter(isNotBlank).join('
         {#if isNotBlank(cancelText)}
           <Button cancel {describedby} on:click={() => dispatch('escape')}>{cancelText}</Button>
         {/if}
-        <Button class="primary" disabled={disabled || (hasRequired && !ignoreTabs)} {describedby} on:click={() => dispatch('continue')}><Icon icon={continueIcon} inline />{continueText}</Button>
+        {#if isNotBlank(continueText)}
+          <Button class="primary" disabled={disabled || (hasRequired && !ignoreTabs)} {describedby} on:click={() => dispatch('continue')}><Icon icon={continueIcon} inline />{continueText}</Button>
+        {/if}
         {#if nextTitle && !ignoreTabs}
           <Button class="next" disabled={!nextTitle} on:click={onNext}>Next<ScreenReaderOnly> Tab ({nextTitle})</ScreenReaderOnly> <Icon width="1.2em" icon={arrowRightLight} inline /></Button>
         {/if}

package/FieldHidden.svelte

@@ -1,12 +1,15 @@
-<script>import { Field, nullableSerialize, nullableDeserialize, FormStore, FORM_CONTEXT } from '@txstate-mws/svelte-forms';
+<script>import { Field, nullableSerialize, nullableDeserialize, FormStore, FORM_CONTEXT, FORM_INHERITED_PATH } from '@txstate-mws/svelte-forms';
 import { getContext } from 'svelte';
+import { isNotBlank } from 'txstate-utils';
 export let id = undefined;
 export let path;
 export let value = '';
 export let notNull = false;
 export let conditional = undefined;
 const store = getContext(FORM_CONTEXT);
-$: store.setField(path, value);
+const inheritedPath = getContext(FORM_INHERITED_PATH);
+const finalPath = [inheritedPath, path].filter(isNotBlank).join('.');
+$: store.setField(finalPath, value);
 </script>
 
 <Field {path} {conditional} serialize={!notNull ? nullableSerialize : undefined} deserialize={!notNull ? nullableDeserialize : undefined} let:value>

package/Tab.svelte

@@ -15,12 +15,16 @@ const idx = $store.tabs.findIndex(t => t.name === name);
 const last = idx === $store.tabs.length - 1;
 </script>
 
-{#if $accordion}
-  <div bind:this={tabelements[idx]} id={$tabid} class="tabs-tab" class:last aria-selected={active} aria-controls={$panelid} role="tab" tabindex={0} on:click={onClick(idx)} on:keydown={onKeyDown(idx)}><Icon icon={$store.tabs[idx].icon} inline />{$title}<i class="tabs-accordion-arrow" aria-hidden="true"></i></div>
-{/if}
-<div id={$panelid} hidden={!active} role="tabpanel" tabindex="-1" aria-labelledby={$tabid} class="tabs-panel" class:accordion={$accordion}>
+{#if $store.tabs.length > 1}
+  {#if $accordion}
+    <div bind:this={tabelements[idx]} id={$tabid} class="tabs-tab" class:last aria-selected={active} aria-controls={$panelid} role="tab" tabindex={0} on:click={onClick(idx)} on:keydown={onKeyDown(idx)}><Icon icon={$store.tabs[idx].icon} inline />{$title}<i class="tabs-accordion-arrow" aria-hidden="true"></i></div>
+  {/if}
+  <div id={$panelid} hidden={!active} role="tabpanel" tabindex="-1" aria-labelledby={$tabid} class="tabs-panel" class:accordion={$accordion}>
+    <slot />
+  </div>
+{:else}
   <slot />
-</div>
+{/if}
 
 <style>
   .tabs-panel {

package/Tabs.svelte

@@ -85,20 +85,24 @@ $: reactToCurrent($activeStore);
 onMount(reactToCurrent);
 </script>
 
-{#if !$accordion}
-  <ul use:resize={{ store }} class="tabs-buttons" role="tablist">
-    {#each $store.tabs as tab, idx (tab.name)}
-      {@const active = isActive(idx, $store.current)}
-      {@const left = idx % cols === 0}
-      <li bind:this={tabelements[idx]} use:offset={{ store: active ? activeStore : undefined }} id={$store.tabids[tab.name]} class="tabs-tab" class:left class:wrapping class:active style:font-size="{scalefactor}em" style:line-height={1.2 / scalefactor} aria-selected={active} aria-controls={$store.panelids[tab.name]} role="tab" tabindex={active ? 0 : -1} on:click={onClick(idx)} on:keydown={onKeyDown(idx)}><span><Icon icon={tab.icon} inline />{tab.title}</span></li>
-    {/each}
-  </ul>
-  <div bind:this={activeelement} class="tabs-active"></div>
-  <slot current={$store.current} />
-{:else}
-  <div use:resize={{ store }} class="tabs-container">
+{#if $store.tabs.length > 1}
+  {#if !$accordion}
+    <ul use:resize={{ store }} class="tabs-buttons" role="tablist">
+      {#each $store.tabs as tab, idx (tab.name)}
+        {@const active = isActive(idx, $store.current)}
+        {@const left = idx % cols === 0}
+        <li bind:this={tabelements[idx]} use:offset={{ store: active ? activeStore : undefined }} id={$store.tabids[tab.name]} class="tabs-tab" class:left class:wrapping class:active style:font-size="{scalefactor}em" style:line-height={1.2 / scalefactor} aria-selected={active} aria-controls={$store.panelids[tab.name]} role="tab" tabindex={active ? 0 : -1} on:click={onClick(idx)} on:keydown={onKeyDown(idx)}><span><Icon icon={tab.icon} inline />{tab.title}</span></li>
+      {/each}
+    </ul>
+    <div bind:this={activeelement} class="tabs-active"></div>
     <slot current={$store.current} />
-  </div>
+  {:else}
+    <div use:resize={{ store }} class="tabs-container">
+      <slot current={$store.current} />
+    </div>
+  {/if}
+{:else}
+  <slot current={$store.current} />
 {/if}
 
 <style>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dosgato/dialog",
   "description": "A component library for building forms that edit a JSON document.",
-  "version": "0.0.42",
+  "version": "0.0.44",
   "dependencies": {
     "@txstate-mws/svelte-components": "^1.3.9",
     "@txstate-mws/svelte-forms": "^1.3.4",