@budibase/bbui 1.0.98-alpha.8 → 1.0.100

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@budibase/bbui",
   "description": "A UI solution used in the different Budibase projects.",
-  "version": "1.0.98-alpha.8",
+  "version": "1.0.100",
   "license": "MPL-2.0",
   "svelte": "src/index.js",
   "module": "dist/bbui.es.js",
@@ -38,7 +38,7 @@
   ],
   "dependencies": {
     "@adobe/spectrum-css-workflow-icons": "^1.2.1",
-    "@budibase/string-templates": "^1.0.98-alpha.8",
+    "@budibase/string-templates": "^1.0.100",
     "@spectrum-css/actionbutton": "^1.0.1",
     "@spectrum-css/actiongroup": "^1.0.1",
     "@spectrum-css/avatar": "^3.0.2",
@@ -84,5 +84,5 @@
     "svelte-flatpickr": "^3.2.3",
     "svelte-portal": "^1.0.0"
   },
-  "gitHead": "54a848845e623a6052d5bb4341eda9cede5bcd1a"
+  "gitHead": "b8678e2f560a0c7d172b3b69e260973bc37c8277"
 }

package/src/Button/Button.svelte

@@ -13,7 +13,6 @@
   export let icon = undefined
   export let active = false
   export let tooltip = undefined
-  export let dataCy
 
   let showTooltip = false
 </script>
@@ -28,7 +27,6 @@
   class:active
   class="spectrum-Button spectrum-Button--size{size.toUpperCase()}"
   {disabled}
-  data-cy={dataCy}
   on:click|preventDefault
   on:mouseover={() => (showTooltip = true)}
   on:focus={() => (showTooltip = true)}

package/src/Modal/ModalContent.svelte

@@ -5,7 +5,6 @@
   import Divider from "../Divider/Divider.svelte"
   import Icon from "../Icon/Icon.svelte"
   import Context from "../context"
-  import ProgressCircle from "../ProgressCircle/ProgressCircle.svelte"
 
   export let title = undefined
   export let size = "S"
@@ -103,22 +102,15 @@
           <Button group secondary on:click={close}>{cancelText}</Button>
         {/if}
         {#if showConfirmButton}
-          <span class="confirm-wrap">
-            <Button
-              group
-              cta
-              {...$$restProps}
-              disabled={confirmDisabled}
-              on:click={confirm}
-            >
-              {#if loading}
-                <ProgressCircle overBackground={true} size="S" />
-              {/if}
-              {#if !loading}
-                {confirmText}
-              {/if}
-            </Button>
-          </span>
+          <Button
+            group
+            cta
+            {...$$restProps}
+            disabled={confirmDisabled}
+            on:click={confirm}
+          >
+            {confirmText}
+          </Button>
         {/if}
       </div>
     {/if}
@@ -177,8 +169,4 @@
   .spectrum-Dialog-buttonGroup {
     padding-left: 0;
   }
-
-  .confirm-wrap :global(.spectrum-Button-label) {
-    display: contents;
-  }
 </style>

package/src/Table/Table.svelte

@@ -56,7 +56,6 @@
   $: if (!loading) loaded = true
   $: fields = getFields(schema, showAutoColumns, autoSortColumns)
   $: rows = fields?.length ? data || [] : []
-  $: totalRowCount = rows?.length || 0
   $: visibleRowCount = getVisibleRowCount(
     loaded,
     height,
@@ -64,12 +63,7 @@
     rowCount,
     rowHeight
   )
-  $: heightStyle = getHeightStyle(
-    visibleRowCount,
-    rowCount,
-    totalRowCount,
-    rowHeight
-  )
+  $: contentStyle = getContentStyle(visibleRowCount, rowCount, rowHeight)
   $: sortedRows = sortRows(rows, sortColumn, sortOrder)
   $: gridStyle = getGridStyle(fields, schema, showEditColumn)
   $: showEditColumn = allowEditRows || allowSelectRows
@@ -113,16 +107,11 @@
     return Math.min(allRows, Math.ceil(height / rowHeight))
   }
 
-  const getHeightStyle = (
-    visibleRowCount,
-    rowCount,
-    totalRowCount,
-    rowHeight
-  ) => {
-    if (!rowCount || !visibleRowCount || totalRowCount <= rowCount) {
+  const getContentStyle = (visibleRows, rowCount, rowHeight) => {
+    if (!rowCount || !visibleRows) {
       return ""
     }
-    return `height: ${headerHeight + visibleRowCount * rowHeight}px;`
+    return `height: ${headerHeight + visibleRows * rowHeight}px;`
   }
 
   const getGridStyle = (fields, schema, showEditColumn) => {
@@ -275,11 +264,11 @@
   style={`--row-height: ${rowHeight}px; --header-height: ${headerHeight}px;`}
 >
   {#if !loaded}
-    <div class="loading" style={heightStyle}>
+    <div class="loading" style={contentStyle}>
       <ProgressCircle />
     </div>
   {:else}
-    <div class="spectrum-Table" style={`${heightStyle}${gridStyle}`}>
+    <div class="spectrum-Table" style={`${contentStyle}${gridStyle}`}>
       {#if fields.length}
         <div class="spectrum-Table-head">
           {#if showEditColumn}