no spinner if not specified

examples/show-progress/go.sql

@@ -1,5 +1,7 @@
+SELECT 'shell' AS component, 'light' AS theme;
+
 -- can disable the spinner to show only progress bar
-SELECT 'loader-start' AS component,  'non-existent-class' AS spinner;
+SELECT 'loader-start' AS component,  NULL AS spinner;
 
 SELECT 'progress' AS component,
   NULL AS percent,
@@ -8,6 +10,6 @@ SELECT 'progress' AS component,
   'Working on it' AS stage;
 SELECT sqlpage.exec('sleep', '3');
 
-SELECT 'loader-stop' AS component,  NULL AS spinner;
+SELECT 'loader-stop' AS component;
 
 SELECT 'text' AS component, 'Processing complete.' AS contents;

examples/show-progress/index.sql

@@ -1,9 +1,8 @@
-SELECT 'shell' AS component,
-  'dark' AS theme;
+SELECT 'shell' AS component, 'dark' AS theme;
 
 SELECT 'loader-start' AS component,
-  -- default is "spinner-border"
-  "spinner-grow text-red" AS spinner;
+  -- pick from the tabler spinners: https://tabler.io/docs/components/spinners
+  "spinner-border spinner-border-sm text-red" AS spinner;
 
 SELECT 'progress' AS component,
   'sm' AS size,
@@ -49,4 +48,4 @@ SELECT 'button' AS component;
 SELECT 'Go' AS title, '/go.sql' AS link;
 
 -- can use progress on it's own
-SELECT 'progress' AS component, 'Waiting for user' AS stage;
+SELECT 'progress' AS component, 'sm' AS size, 'Waiting for user' AS stage;

sqlpage/templates/loader-start.handlebars

@@ -1,2 +1,2 @@
 <div {{#if id}}id="{{id}}"{{/if}} class="sqlpage-loader-start">
-  <span class="{{default spinner "spinner-border"}}"></span>
+  {{#if spinner}}<span class="{{spinner}}"></span>{{/if}}