proto-sudoku-wc 0.0.690 → 0.0.692

package/dist/esm/proto-sudoku.entry.js

@@ -1,15 +1,15 @@
-import { h, g as getRenderingRef, f as forceUpdate, r as registerInstance } from './index-3ccc3f4a.js';
+import { h, g as getRenderingRef, f as forceUpdate, r as registerInstance } from './index-e105e4de.js';
 
 const Alien = props => {
-  const hex = props.hex || 'currentColor';
-  const klass = props.class;
-  const label = props.label || 'alien';
-  const size = props.size || 24;
-  return (h("svg", { class: klass, width: size, height: size, viewBox: "0 0 24 24", role: "img", "aria-label": "title" },
-    h("title", null, label),
-    h("g", { fill: hex },
-      h("path", { d: "M10.31 10.93C11.33 12.57 11.18 14.5 9.96 15.28C8.74 16.04 6.92 15.33\n      5.89 13.69C4.87 12.05 5.03 10.1 6.25 9.34C7.47 8.58 9.29 9.29 10.31\n      10.93M12 17.75C14 17.75 14.5 17 14.5 17C14.5 17 14 19 12 19C10 19 9.5\n      17.03 9.5 17C9.5 17 10 17.75 12 17.75M17.75 9.34C18.97 10.1 19.13 12.05\n      18.11 13.69C17.08 15.33 15.26 16.04 14.04 15.28C12.82 14.5 12.67 12.57\n      13.69 10.93C14.71 9.29 16.53 8.58 17.75 9.34M12 20C14.5 20 20 14.86 20\n      11C20 7.14 16.41 4 12 4C7.59 4 4 7.14 4 11C4 14.86 9.5 20 12 20M12 2C17.5\n      2 22 6.04 22 11C22 15.08 16.32 22 12 22C7.68 22 2 15.08 2 11C2 6.04 6.5 2\n      12 2Z" })),
-    h("path", { d: "M0 0h24v24H0z", fill: "none" })));
+    const hex = props.hex || 'currentColor';
+    const klass = props.class;
+    const label = props.label || 'alien';
+    const size = props.size || 24;
+    return (h("svg", { class: klass, width: size, height: size, viewBox: "0 0 24 24", role: "img", "aria-label": "title" },
+        h("title", null, label),
+        h("g", { fill: hex },
+            h("path", { d: "M10.31 10.93C11.33 12.57 11.18 14.5 9.96 15.28C8.74 16.04 6.92 15.33\n      5.89 13.69C4.87 12.05 5.03 10.1 6.25 9.34C7.47 8.58 9.29 9.29 10.31\n      10.93M12 17.75C14 17.75 14.5 17 14.5 17C14.5 17 14 19 12 19C10 19 9.5\n      17.03 9.5 17C9.5 17 10 17.75 12 17.75M17.75 9.34C18.97 10.1 19.13 12.05\n      18.11 13.69C17.08 15.33 15.26 16.04 14.04 15.28C12.82 14.5 12.67 12.57\n      13.69 10.93C14.71 9.29 16.53 8.58 17.75 9.34M12 20C14.5 20 20 14.86 20\n      11C20 7.14 16.41 4 12 4C7.59 4 4 7.14 4 11C4 14.86 9.5 20 12 20M12 2C17.5\n      2 22 6.04 22 11C22 15.08 16.32 22 12 22C7.68 22 2 15.08 2 11C2 6.04 6.5 2\n      12 2Z" })),
+        h("path", { d: "M0 0h24v24H0z", fill: "none" })));
 };
 
 const KEY = 'proto-sudoku';
@@ -17,38 +17,38 @@ const DATA = `${KEY}::data`;
 const INPUTS = `${KEY}::inputs`;
 const PICK = `${KEY}::pick`;
 const getForKey = (key) => {
-  const json = localStorage.getItem(key);
-  return json ? JSON.parse(json) : undefined;
+    const json = localStorage.getItem(key);
+    return json ? JSON.parse(json) : undefined;
 };
 const storeForKey = (key, value) => {
-  const json = JSON.stringify(value);
-  localStorage.setItem(key, json);
+    const json = JSON.stringify(value);
+    localStorage.setItem(key, json);
 };
 const bag = {
-  get: () => {
-    return getForKey(DATA);
-  },
-  store: value => {
-    storeForKey(DATA, value);
-  },
-  inputs: {
     get: () => {
-      const line = getForKey(INPUTS);
-      return [...line];
+        return getForKey(DATA);
     },
-    store: (value) => {
-      storeForKey(INPUTS, value.join(''));
+    store: value => {
+        storeForKey(DATA, value);
     },
-  },
-  pick: {
-    get: () => {
-      const pick = getForKey(PICK);
-      return pick !== null ? pick : undefined;
+    inputs: {
+        get: () => {
+            const line = getForKey(INPUTS);
+            return [...line];
+        },
+        store: (value) => {
+            storeForKey(INPUTS, value.join(''));
+        },
     },
-    store: (value) => {
-      storeForKey(PICK, value >= 0 && value < 81 ? value : null);
+    pick: {
+        get: () => {
+            const pick = getForKey(PICK);
+            return pick !== null ? pick : undefined;
+        },
+        store: (value) => {
+            storeForKey(PICK, value >= 0 && value < 81 ? value : null);
+        },
     },
-  },
 };
 
 const CHECK = 'Check ?';
@@ -794,452 +794,452 @@ const ky = createInstance();
 
 // --------------------------------------------------------[ mutable store ]
 const storeDef = {
-  list: [],
-  keys: [],
-  locs: [],
-  loading: false,
-  solved: false,
-  error: undefined,
-  pick: undefined,
-  data: undefined,
+    list: [],
+    keys: [],
+    locs: [],
+    loading: false,
+    solved: false,
+    error: undefined,
+    pick: undefined,
+    data: undefined,
 };
 const { state } = createStore(storeDef);
 // --------------------------------------------------------[ geometry ]
 // NOTE:  by using Sets here, we don't have to worry about clearing geometry...
 const geometry = new Map([
-  ['row', new Map()],
-  ['column', new Map()],
-  ['box', new Map()],
+    ['row', new Map()],
+    ['column', new Map()],
+    ['box', new Map()],
 ]);
 const keyValues = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
 const computeBox = (row, column) => {
-  if (column < 3) {
-    return row < 3 ? 0 : row < 6 ? 3 : 6;
-  }
-  else {
-    if (column < 6) {
-      return row < 3 ? 1 : row < 6 ? 4 : 7;
+    if (column < 3) {
+        return row < 3 ? 0 : row < 6 ? 3 : 6;
     }
     else {
-      return row < 3 ? 2 : row < 6 ? 5 : 8;
+        if (column < 6) {
+            return row < 3 ? 1 : row < 6 ? 4 : 7;
+        }
+        else {
+            return row < 3 ? 2 : row < 6 ? 5 : 8;
+        }
     }
-  }
 };
 const computeLocs = (index, row, column, box) => {
-  const data = new Map([
-    ['row', row],
-    ['column', column],
-    ['box', box],
-  ]);
-  const locs = new Set();
-  data.forEach((value, key) => {
-    geometry
-      .get(key)
-      .get(value)
-      .forEach(indx => {
-      indx !== index && locs.add(indx);
+    const data = new Map([
+        ['row', row],
+        ['column', column],
+        ['box', box],
+    ]);
+    const locs = new Set();
+    data.forEach((value, key) => {
+        geometry
+            .get(key)
+            .get(value)
+            .forEach(indx => {
+            indx !== index && locs.add(indx);
+        });
     });
-  });
-  return Array.from(locs);
+    return Array.from(locs);
 };
 const computeKeys = locs => {
-  const { list } = state;
-  const found = new Set();
-  locs.map(indx => {
-    const { key } = list[indx];
-    if (key != '.') {
-      found.add(key);
-    }
-  });
-  const keys = keyValues.filter(key => !found.has(key));
-  return keys;
+    const { list } = state;
+    const found = new Set();
+    locs.map(indx => {
+        const { key } = list[indx];
+        if (key != '.') {
+            found.add(key);
+        }
+    });
+    const keys = keyValues.filter(key => !found.has(key));
+    return keys;
 };
 const updateGeometry = (index, row, column, box) => {
-  const data = new Map([
-    ['row', row],
-    ['column', column],
-    ['box', box],
-  ]);
-  data.forEach((value, key) => {
-    const map = geometry.get(key);
-    if (map.has(value)) {
-      // looking at the set specification, it should be sufficient to just call add
-      // https://tc39.es/ecma262/#sec-set.prototype.add
-      map.get(value).add(index);
-    }
-    else {
-      map.set(value, new Set([index]));
-    }
-  });
+    const data = new Map([
+        ['row', row],
+        ['column', column],
+        ['box', box],
+    ]);
+    data.forEach((value, key) => {
+        const map = geometry.get(key);
+        if (map.has(value)) {
+            // looking at the set specification, it should be sufficient to just call add
+            // https://tc39.es/ecma262/#sec-set.prototype.add
+            map.get(value).add(index);
+        }
+        else {
+            map.set(value, new Set([index]));
+        }
+    });
 };
 const updateFromInputs = list => {
-  const inputs = bag.inputs.get();
-  inputs.forEach((key, indx) => {
-    const cell = list[indx];
-    const { isClue } = cell;
-    if (!isClue) {
-      cell.key = key;
-    }
-  });
+    const inputs = bag.inputs.get();
+    inputs.forEach((key, indx) => {
+        const cell = list[indx];
+        const { isClue } = cell;
+        if (!isClue) {
+            cell.key = key;
+        }
+    });
 };
 // --------------------------------------------------------[ process ]
 const processData = (next) => {
-  if (next) {
-    const { puzzle, ref } = next;
-    const cells = puzzle ? [...puzzle] : [];
-    const line = ref ? atob(ref) : undefined; // decrypt the solution... [ base64 ]
-    const solution = line ? [...line] : [];
-    const list = cells.map((key, indx) => {
-      const value = solution[indx];
-      const isClue = key === value;
-      const row = Math.floor(indx / 9);
-      const column = indx % 9;
-      const box = computeBox(row, column);
-      updateGeometry(indx, row, column, box);
-      return { key, isClue, value, indx, row, column, box };
-    });
-    // NOTE:  this only happens once on data change...
-    updateFromInputs(list);
-    state.data = next;
-    state.list = list;
-  }
-  else {
-    state.data = undefined;
-    state.list = [];
-  }
+    if (next) {
+        const { puzzle, ref } = next;
+        const cells = puzzle ? [...puzzle] : [];
+        const line = ref ? atob(ref) : undefined; // decrypt the solution... [ base64 ]
+        const solution = line ? [...line] : [];
+        const list = cells.map((key, indx) => {
+            const value = solution[indx];
+            const isClue = key === value;
+            const row = Math.floor(indx / 9);
+            const column = indx % 9;
+            const box = computeBox(row, column);
+            updateGeometry(indx, row, column, box);
+            return { key, isClue, value, indx, row, column, box };
+        });
+        // NOTE:  this only happens once on data change...
+        updateFromInputs(list);
+        state.data = next;
+        state.list = list;
+    }
+    else {
+        state.data = undefined;
+        state.list = [];
+    }
 };
 const processPick = (next) => {
-  if (next !== undefined && next.indx != state.pick) {
-    const { isClue, indx, row, column, box } = next;
-    const locs = computeLocs(indx, row, column, box);
-    const keys = isClue ? [] : computeKeys(locs);
-    state.pick = indx;
-    state.keys = keys;
-    state.locs = locs;
-    // NOTE:  we could auto-pick if there's only one key...
-    // (keys.length === 1) && next.key = keys[0];
-  }
-  else {
-    state.pick = undefined;
-    state.keys = [];
-    state.locs = [];
-  }
-  savePick(state.pick);
+    if (next !== undefined && next.indx != state.pick) {
+        const { isClue, indx, row, column, box } = next;
+        const locs = computeLocs(indx, row, column, box);
+        const keys = isClue ? [] : computeKeys(locs);
+        state.pick = indx;
+        state.keys = keys;
+        state.locs = locs;
+        // NOTE:  we could auto-pick if there's only one key...
+        // (keys.length === 1) && next.key = keys[0];
+    }
+    else {
+        state.pick = undefined;
+        state.keys = [];
+        state.locs = [];
+    }
+    savePick(state.pick);
 };
 // --------------------------------------------------------[ utils ]
 let api = undefined;
 const platformPrefix = {
-  netlify: '/.netlify/functions',
-  vercel: 'https://sudoku-rust-api.vercel.app/api',
+    netlify: '/.netlify/functions',
+    vercel: 'https://sudoku-rust-api.vercel.app/api',
 };
 const getPrefixFor = (platform) => {
-  const keys = Object.keys(platformPrefix);
-  const target = keys.includes(platform) ? platform : 'vercel';
-  return platformPrefix[target];
+    const keys = Object.keys(platformPrefix);
+    const target = keys.includes(platform) ? platform : 'vercel';
+    return platformPrefix[target];
 };
 const initApi = (platform) => {
-  const prefix = getPrefixFor(platform);
-  api = ky.extend({
-    hooks: {
-      beforeRequest: [
-        request => {
-          request.headers.set('X-Requested-With', 'ky');
-          request.headers.set('X-Custom-Header', 'foobar');
+    const prefix = getPrefixFor(platform);
+    api = ky.extend({
+        hooks: {
+            beforeRequest: [
+                request => {
+                    request.headers.set('X-Requested-With', 'ky');
+                    request.headers.set('X-Custom-Header', 'foobar');
+                },
+            ],
         },
-      ],
-    },
-    prefixUrl: prefix,
-    timeout: 10000,
-  });
+        prefixUrl: prefix,
+        timeout: 10000,
+    });
 };
 const saveInputs = (inputs) => {
-  bag.inputs.store(inputs);
+    bag.inputs.store(inputs);
 };
 const savePick = (pick) => {
-  bag.pick.store(pick);
+    bag.pick.store(pick);
 };
 const clearStore = (loading = false) => {
-  state.list = [];
-  state.keys = [];
-  state.locs = [];
-  state.loading = loading;
-  state.solved = false;
-  state.error = undefined;
-  state.pick = undefined;
-  state.data = undefined;
+    state.list = [];
+    state.keys = [];
+    state.locs = [];
+    state.loading = loading;
+    state.solved = false;
+    state.error = undefined;
+    state.pick = undefined;
+    state.data = undefined;
 };
 const updateStore = (data, save = true) => {
-  const { puzzle, ref } = data;
-  if (save) {
-    bag.inputs.store([]);
-    bag.store(data);
-  }
-  processData({ puzzle, ref });
+    const { puzzle, ref } = data;
+    if (save) {
+        bag.inputs.store([]);
+        bag.store(data);
+    }
+    processData({ puzzle, ref });
 };
 // --------------------------------------------------------[ actions ]
 const initApp = (platform) => {
-  initApi(platform);
-  clearStore();
-  // this retrieves the last data we stored in the bag...
-  const data = bag.get();
-  const pick = bag.pick.get();
-  if (data) {
-    updateStore(data, false);
-    if (pick >= 0) {
-      const { list } = state;
-      const cell = list[pick];
-      processPick(cell);
+    initApi(platform);
+    clearStore();
+    // this retrieves the last data we stored in the bag...
+    const data = bag.get();
+    const pick = bag.pick.get();
+    if (data) {
+        updateStore(data, false);
+        if (pick >= 0) {
+            const { list } = state;
+            const cell = list[pick];
+            processPick(cell);
+        }
     }
-  }
 };
 const refresh = async () => {
-  clearStore(true);
-  saveInputs([]);
-  savePick(state.pick);
-  try {
-    // fetch a new puzzle from the api...
-    const data = await api.get('puzzle').json();
-    updateStore(data);
-  }
-  catch (err) {
-    // handle error...
-    const { message } = err;
-    console.log('-- ', message);
-    console.log(err);
-    state.error = message;
-  }
-  finally {
-    // always executed
-    state.loading = false;
-  }
+    clearStore(true);
+    saveInputs([]);
+    savePick(state.pick);
+    try {
+        // fetch a new puzzle from the api...
+        const data = await api.get('puzzle').json();
+        updateStore(data);
+    }
+    catch (err) {
+        // handle error...
+        const { message } = err;
+        console.log('-- ', message);
+        console.log(err);
+        state.error = message;
+    }
+    finally {
+        // always executed
+        state.loading = false;
+    }
 };
 const select = (cell) => {
-  processPick(cell);
+    processPick(cell);
 };
 const redraw = (list) => {
-  state.list = [...list];
-  list.length = 0;
+    state.list = [...list];
+    list.length = 0;
 };
 const check = () => {
-  const { list } = state;
-  const inputs = [];
-  let errors = 0;
-  let found = 0;
-  let clues = 0;
-  list.forEach(cell => {
-    const { key, value, isClue } = cell;
-    if (!isClue) {
-      if (key !== '.') {
-        if (key !== value) {
-          errors = errors + 1;
-          cell.key = '.';
+    const { list } = state;
+    const inputs = [];
+    let errors = 0;
+    let found = 0;
+    let clues = 0;
+    list.forEach(cell => {
+        const { key, value, isClue } = cell;
+        if (!isClue) {
+            if (key !== '.') {
+                if (key !== value) {
+                    errors = errors + 1;
+                    cell.key = '.';
+                }
+                else {
+                    found = found + 1;
+                }
+            }
         }
         else {
-          found = found + 1;
+            clues = clues + 1;
         }
-      }
+        inputs.push(cell.key);
+    });
+    const total = clues + found;
+    found ? saveInputs(inputs) : saveInputs([]);
+    if (errors > 0) {
+        redraw(list);
     }
     else {
-      clues = clues + 1;
-    }
-    inputs.push(cell.key);
-  });
-  const total = clues + found;
-  found ? saveInputs(inputs) : saveInputs([]);
-  if (errors > 0) {
-    redraw(list);
-  }
-  else {
-    if (total === 81) {
-      state.solved = true;
+        if (total === 81) {
+            state.solved = true;
+        }
     }
-  }
 };
 const input = (key) => {
-  const { pick, list } = state;
-  const cell = list[pick];
-  cell.key = key;
-  redraw(list);
+    const { pick, list } = state;
+    const cell = list[pick];
+    cell.key = key;
+    redraw(list);
 };
 const actions = {
-  initApp,
-  refresh,
-  select,
-  check,
-  input,
+    initApp,
+    refresh,
+    select,
+    check,
+    input,
 };
 
 // WARNING:  generated file...
 const TW_VERSION = '3.3.5';
 
 const tw = (...classes) => {
-  return classes.filter(Boolean).join(' ');
+    return classes.filter(Boolean).join(' ');
 };
 
 const Spinner = props => {
-  const hex = props.hex || 'currentColor';
-  const klass = props.class || '';
-  const label = props.label || 'loading...';
-  const size = props.size || 24;
-  return (h("svg", { class: tw(klass, 'animate-spin'), width: size, height: size, fill: "none", viewBox: "0 0 24 24", role: "img", "aria-label": "title" },
-    h("title", null, label),
-    h("g", null,
-      h("circle", { class: "opacity-25", cx: "12", cy: "12", r: "10", stroke: hex, "stroke-width": "4" }),
-      h("path", { class: "opacity-75", fill: hex, d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })),
-    h("path", { d: "M0 0h24v24H0z", fill: "none" })));
+    const hex = props.hex || 'currentColor';
+    const klass = props.class || '';
+    const label = props.label || 'loading...';
+    const size = props.size || 24;
+    return (h("svg", { class: tw(klass, 'animate-spin'), width: size, height: size, fill: "none", viewBox: "0 0 24 24", role: "img", "aria-label": "title" },
+        h("title", null, label),
+        h("g", null,
+            h("circle", { class: "opacity-25", cx: "12", cy: "12", r: "10", stroke: hex, "stroke-width": "4" }),
+            h("path", { class: "opacity-75", fill: hex, d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })),
+        h("path", { d: "M0 0h24v24H0z", fill: "none" })));
 };
 
 const Alert = props => {
-  const { message, salute, spinner = false } = props;
-  return (h("div", { class: "mt-5 flex h-24px flex-row items-center" },
-    spinner ? h(Spinner, { class: "mr-2" }) : h(Alien, { class: "mr-2" }),
-    salute ? h("label", { class: "mr-1 font-bold" },
-      salute,
-      ":") : '',
-    h("label", { class: "italic" }, message)));
+    const { message, salute, spinner = false } = props;
+    return (h("div", { class: "mt-5 flex h-24px flex-row items-center" },
+        spinner ? h(Spinner, { class: "mr-2" }) : h(Alien, { class: "mr-2" }),
+        salute ? h("label", { class: "mr-1 font-bold" },
+            salute,
+            ":") : '',
+        h("label", { class: "italic" }, message)));
 };
 
 const Alerts = _props => {
-  const { solved, loading, error } = state;
-  const play = !loading && !error && !solved;
-  return (h("div", { class: "flex flex-col" },
-    play ? h(Alert, { message: "Welcome, are you ready to play?..." }) : '',
-    loading ? h(Alert, { message: "Loading...", spinner: true }) : '',
-    error ? h(Alert, { message: error, salute: "ERROR" }) : '',
-    solved ? h(Alert, { message: "You solved the puzzle!!" }) : ''));
+    const { solved, loading, error } = state;
+    const play = !loading && !error && !solved;
+    return (h("div", { class: "flex flex-col" },
+        play ? h(Alert, { message: "Welcome, are you ready to play?..." }) : '',
+        loading ? h(Alert, { message: "Loading...", spinner: true }) : '',
+        error ? h(Alert, { message: error, salute: "ERROR" }) : '',
+        solved ? h(Alert, { message: "You solved the puzzle!!" }) : ''));
 };
 
 const Fingerprint = props => {
-  const hex = props.hex || 'currentColor';
-  const klass = props.class;
-  const label = props.label || 'fingerprint';
-  const size = props.size || 24;
-  return (h("svg", { class: klass, width: size, height: size, viewBox: "0 0 24 24", role: "img", "aria-label": "title" },
-    h("title", null, label),
-    h("g", { fill: hex },
-      h("path", { d: "M17.81,4.47C17.73,4.47 17.65,4.45 17.58,4.41C15.66,3.42 14,3\n      12,3C10.03,3 8.15,3.47 6.44,4.41C6.2,4.54 5.9,4.45 5.76,4.21C5.63,3.97\n      5.72,3.66 5.96,3.53C7.82,2.5 9.86,2 12,2C14.14,2 16,2.47\n      18.04,3.5C18.29,3.65 18.38,3.95 18.25,4.19C18.16,4.37 18,4.47\n      17.81,4.47M3.5,9.72C3.4,9.72 3.3,9.69 3.21,9.63C3,9.47 2.93,9.16\n      3.09,8.93C4.08,7.53 5.34,6.43 6.84,5.66C10,4.04 14,4.03\n      17.15,5.65C18.65,6.42 19.91,7.5 20.9,8.9C21.06,9.12 21,9.44\n      20.78,9.6C20.55,9.76 20.24,9.71 20.08,9.5C19.18,8.22 18.04,7.23\n      16.69,6.54C13.82,5.07 10.15,5.07 7.29,6.55C5.93,7.25 4.79,8.25\n      3.89,9.5C3.81,9.65 3.66,9.72 3.5,9.72M9.75,21.79C9.62,21.79 9.5,21.74\n      9.4,21.64C8.53,20.77 8.06,20.21 7.39,19C6.7,17.77 6.34,16.27\n      6.34,14.66C6.34,11.69 8.88,9.27 12,9.27C15.12,9.27 17.66,11.69\n      17.66,14.66A0.5,0.5 0 0,1 17.16,15.16A0.5,0.5 0 0,1\n      16.66,14.66C16.66,12.24 14.57,10.27 12,10.27C9.43,10.27 7.34,12.24\n      7.34,14.66C7.34,16.1 7.66,17.43 8.27,18.5C8.91,19.66 9.35,20.15\n      10.12,20.93C10.31,21.13 10.31,21.44 10.12,21.64C10,21.74 9.88,21.79\n      9.75,21.79M16.92,19.94C15.73,19.94 14.68,19.64 13.82,19.05C12.33,18.04\n      11.44,16.4 11.44,14.66A0.5,0.5 0 0,1 11.94,14.16A0.5,0.5 0 0,1\n      12.44,14.66C12.44,16.07 13.16,17.4 14.38,18.22C15.09,18.7 15.92,18.93\n      16.92,18.93C17.16,18.93 17.56,18.9 17.96,18.83C18.23,18.78 18.5,18.96\n      18.54,19.24C18.59,19.5 18.41,19.77 18.13,19.82C17.56,19.93 17.06,19.94\n      16.92,19.94M14.91,22C14.87,22 14.82,22 14.78,22C13.19,21.54 12.15,20.95\n      11.06,19.88C9.66,18.5 8.89,16.64 8.89,14.66C8.89,13.04 10.27,11.72\n      11.97,11.72C13.67,11.72 15.05,13.04 15.05,14.66C15.05,15.73 16,16.6\n      17.13,16.6C18.28,16.6 19.21,15.73 19.21,14.66C19.21,10.89 15.96,7.83\n      11.96,7.83C9.12,7.83 6.5,9.41 5.35,11.86C4.96,12.67 4.76,13.62\n      4.76,14.66C4.76,15.44 4.83,16.67 5.43,18.27C5.53,18.53 5.4,18.82\n      5.14,18.91C4.88,19 4.59,18.87 4.5,18.62C4,17.31 3.77,16\n      3.77,14.66C3.77,13.46 4,12.37 4.45,11.42C5.78,8.63 8.73,6.82\n      11.96,6.82C16.5,6.82 20.21,10.33 20.21,14.65C20.21,16.27 18.83,17.59\n      17.13,17.59C15.43,17.59 14.05,16.27 14.05,14.65C14.05,13.58 13.12,12.71\n      11.97,12.71C10.82,12.71 9.89,13.58 9.89,14.65C9.89,16.36 10.55,17.96\n      11.76,19.16C12.71,20.1 13.62,20.62 15.03,21C15.3,21.08 15.45,21.36\n      15.38,21.62C15.33,21.85 15.12,22 14.91,22Z" })),
-    h("path", { d: "M0 0h24v24H0z", fill: "none" })));
+    const hex = props.hex || 'currentColor';
+    const klass = props.class;
+    const label = props.label || 'fingerprint';
+    const size = props.size || 24;
+    return (h("svg", { class: klass, width: size, height: size, viewBox: "0 0 24 24", role: "img", "aria-label": "title" },
+        h("title", null, label),
+        h("g", { fill: hex },
+            h("path", { d: "M17.81,4.47C17.73,4.47 17.65,4.45 17.58,4.41C15.66,3.42 14,3\n      12,3C10.03,3 8.15,3.47 6.44,4.41C6.2,4.54 5.9,4.45 5.76,4.21C5.63,3.97\n      5.72,3.66 5.96,3.53C7.82,2.5 9.86,2 12,2C14.14,2 16,2.47\n      18.04,3.5C18.29,3.65 18.38,3.95 18.25,4.19C18.16,4.37 18,4.47\n      17.81,4.47M3.5,9.72C3.4,9.72 3.3,9.69 3.21,9.63C3,9.47 2.93,9.16\n      3.09,8.93C4.08,7.53 5.34,6.43 6.84,5.66C10,4.04 14,4.03\n      17.15,5.65C18.65,6.42 19.91,7.5 20.9,8.9C21.06,9.12 21,9.44\n      20.78,9.6C20.55,9.76 20.24,9.71 20.08,9.5C19.18,8.22 18.04,7.23\n      16.69,6.54C13.82,5.07 10.15,5.07 7.29,6.55C5.93,7.25 4.79,8.25\n      3.89,9.5C3.81,9.65 3.66,9.72 3.5,9.72M9.75,21.79C9.62,21.79 9.5,21.74\n      9.4,21.64C8.53,20.77 8.06,20.21 7.39,19C6.7,17.77 6.34,16.27\n      6.34,14.66C6.34,11.69 8.88,9.27 12,9.27C15.12,9.27 17.66,11.69\n      17.66,14.66A0.5,0.5 0 0,1 17.16,15.16A0.5,0.5 0 0,1\n      16.66,14.66C16.66,12.24 14.57,10.27 12,10.27C9.43,10.27 7.34,12.24\n      7.34,14.66C7.34,16.1 7.66,17.43 8.27,18.5C8.91,19.66 9.35,20.15\n      10.12,20.93C10.31,21.13 10.31,21.44 10.12,21.64C10,21.74 9.88,21.79\n      9.75,21.79M16.92,19.94C15.73,19.94 14.68,19.64 13.82,19.05C12.33,18.04\n      11.44,16.4 11.44,14.66A0.5,0.5 0 0,1 11.94,14.16A0.5,0.5 0 0,1\n      12.44,14.66C12.44,16.07 13.16,17.4 14.38,18.22C15.09,18.7 15.92,18.93\n      16.92,18.93C17.16,18.93 17.56,18.9 17.96,18.83C18.23,18.78 18.5,18.96\n      18.54,19.24C18.59,19.5 18.41,19.77 18.13,19.82C17.56,19.93 17.06,19.94\n      16.92,19.94M14.91,22C14.87,22 14.82,22 14.78,22C13.19,21.54 12.15,20.95\n      11.06,19.88C9.66,18.5 8.89,16.64 8.89,14.66C8.89,13.04 10.27,11.72\n      11.97,11.72C13.67,11.72 15.05,13.04 15.05,14.66C15.05,15.73 16,16.6\n      17.13,16.6C18.28,16.6 19.21,15.73 19.21,14.66C19.21,10.89 15.96,7.83\n      11.96,7.83C9.12,7.83 6.5,9.41 5.35,11.86C4.96,12.67 4.76,13.62\n      4.76,14.66C4.76,15.44 4.83,16.67 5.43,18.27C5.53,18.53 5.4,18.82\n      5.14,18.91C4.88,19 4.59,18.87 4.5,18.62C4,17.31 3.77,16\n      3.77,14.66C3.77,13.46 4,12.37 4.45,11.42C5.78,8.63 8.73,6.82\n      11.96,6.82C16.5,6.82 20.21,10.33 20.21,14.65C20.21,16.27 18.83,17.59\n      17.13,17.59C15.43,17.59 14.05,16.27 14.05,14.65C14.05,13.58 13.12,12.71\n      11.97,12.71C10.82,12.71 9.89,13.58 9.89,14.65C9.89,16.36 10.55,17.96\n      11.76,19.16C12.71,20.1 13.62,20.62 15.03,21C15.3,21.08 15.45,21.36\n      15.38,21.62C15.33,21.85 15.12,22 14.91,22Z" })),
+        h("path", { d: "M0 0h24v24H0z", fill: "none" })));
 };
 
 const url = 'https://eswat2.dev';
 const who = 'eswat2';
 const Eswat2Io = _props => {
-  return (h("a", { class: "absolute right-0 top-0 text-clrs-gray hover:text-clrs-navy", href: url, "aria-label": who, target: "blank", title: who },
-    h(Fingerprint, { label: who })));
+    return (h("a", { class: "absolute right-0 top-0 text-clrs-gray hover:text-clrs-navy", href: url, "aria-label": who, target: "blank", title: who },
+        h(Fingerprint, { label: who })));
 };
 
 const Header = (_props, children) => {
-  return (h("h1", { class: tw('text-center uppercase text-clrs-red', 'mb-11 ml-0 mr-0 mt-11', 'text-6xl font-thin') }, children));
+    return (h("h1", { class: tw('text-center uppercase text-clrs-red', 'mb-11 ml-0 mr-0 mt-11', 'text-6xl font-thin') }, children));
 };
 
 const Button = props => {
-  const { label, callback, matched = false } = props;
-  return (h("button", { class: tw('rounded-md border border-solid border-clrs-slate4 font-bold', label === CHECK
-      ? 'mr-2 bg-clrs-yellow px-3 py-2 text-clrs-navy'
-      : label === NEW_PUZZLE
-        ? 'mr-2 bg-clrs-navy px-3 py-2 text-white'
-        : label === DELETE
-          ? 'mr-1 bg-clrs-red px-2 py-1 text-white'
-          : matched
-            ? 'mr-1 bg-clrs-slate4 px-2 py-1 text-white'
-            : 'mr-1 bg-gray-50 px-2 py-1 text-clrs-navy'), onClick: callback }, label));
+    const { label, callback, matched = false } = props;
+    return (h("button", { class: tw('rounded-md border border-solid border-clrs-slate4 font-bold', label === CHECK
+            ? 'mr-2 bg-clrs-yellow px-3 py-2 text-clrs-navy'
+            : label === NEW_PUZZLE
+                ? 'mr-2 bg-clrs-navy px-3 py-2 text-white'
+                : label === DELETE
+                    ? 'mr-1 bg-clrs-red px-2 py-1 text-white'
+                    : matched
+                        ? 'mr-1 bg-clrs-slate4 px-2 py-1 text-white'
+                        : 'mr-1 bg-gray-50 px-2 py-1 text-clrs-navy'), onClick: callback }, label));
 };
 
 const Keys = _props => {
-  const { keys, list, pick, solved } = state;
-  const genHandler = (key) => {
-    return () => {
-      actions.input(key);
+    const { keys, list, pick, solved } = state;
+    const genHandler = (key) => {
+        return () => {
+            actions.input(key);
+        };
     };
-  };
-  const values = solved ? [] : keys;
-  const cell = pick != undefined ? list[pick] : undefined;
-  return (h("div", { class: "mt-2 flex flex-row justify-end" },
-    !solved && cell && !cell.isClue && cell.key != '.' ? (h(Button, { label: DELETE, callback: genHandler('.') })) : (''),
-    values.map((key) => {
-      return (h(Button, { label: key, callback: genHandler(key), matched: cell.key === key }));
-    })));
+    const values = solved ? [] : keys;
+    const cell = pick != undefined ? list[pick] : undefined;
+    return (h("div", { class: "mt-2 flex flex-row justify-end" },
+        !solved && cell && !cell.isClue && cell.key != '.' ? (h(Button, { label: DELETE, callback: genHandler('.') })) : (''),
+        values.map((key) => {
+            return (h(Button, { label: key, callback: genHandler(key), matched: cell.key === key }));
+        })));
 };
 
 // NOTE: building indx mapping for the border highlighting...
 const borderRight = [
-  2, 5, 11, 14, 20, 23, 29, 32, 38, 41, 47, 50, 56, 59, 65, 68, 74, 77,
+    2, 5, 11, 14, 20, 23, 29, 32, 38, 41, 47, 50, 56, 59, 65, 68, 74, 77,
 ];
 const borderLeft = borderRight.map(key => key + 1);
 const borderBottom = [
-  18, 19, 20, 21, 22, 23, 24, 25, 26, 45, 46, 47, 48, 49, 50, 51, 52, 53,
+    18, 19, 20, 21, 22, 23, 24, 25, 26, 45, 46, 47, 48, 49, 50, 51, 52, 53,
 ];
 const borderTop = borderBottom.map(key => key + 9);
 // Functional components return JSX...
 const Cell = props => {
-  const { cell, focus, selected, solved } = props;
-  const { key, isClue, indx } = cell;
-  const clue = key != '.' ? key : '';
-  const genHandler = (cell, solved) => {
-    return () => {
-      if (!solved) {
-        actions.select(cell);
-      }
+    const { cell, focus, selected, solved } = props;
+    const { key, isClue, indx } = cell;
+    const clue = key != '.' ? key : '';
+    const genHandler = (cell, solved) => {
+        return () => {
+            if (!solved) {
+                actions.select(cell);
+            }
+        };
     };
-  };
-  return (h("label", { class: tw(`cell-${indx}`, borderRight.includes(indx) ? 'border-xbr-clrs-navy' : '', borderLeft.includes(indx) ? 'border-xbl-clrs-navy' : '', borderBottom.includes(indx) ? 'border-xbb-clrs-navy' : '', borderTop.includes(indx) ? 'border-xbt-clrs-navy' : '', 'h-8 w-8 border border-solid text-center leading-8', selected
-      ? 'border-clrs-red bg-clrs-red-a50 text-clrs-red'
-      : focus
-        ? 'border-clrs-gray bg-clrs-green-a50 font-bold'
-        : isClue
-          ? 'border-clrs-gray bg-clrs-silver'
-          : clue !== ''
-            ? 'border-clrs-gray text-clrs-red'
-            : 'border-clrs-gray'), onClick: genHandler(cell, solved) }, clue));
+    return (h("label", { class: tw(`cell-${indx}`, borderRight.includes(indx) ? 'border-xbr-clrs-navy' : '', borderLeft.includes(indx) ? 'border-xbl-clrs-navy' : '', borderBottom.includes(indx) ? 'border-xbb-clrs-navy' : '', borderTop.includes(indx) ? 'border-xbt-clrs-navy' : '', 'h-8 w-8 border border-solid text-center leading-8', selected
+            ? 'border-clrs-red bg-clrs-red-a50 text-clrs-red'
+            : focus
+                ? 'border-clrs-gray bg-clrs-green-a50 font-bold'
+                : isClue
+                    ? 'border-clrs-gray bg-clrs-silver'
+                    : clue !== ''
+                        ? 'border-clrs-gray text-clrs-red'
+                        : 'border-clrs-gray'), onClick: genHandler(cell, solved) }, clue));
 };
 
 const SudokuBoard = _props => {
-  const { list, pick, locs, solved } = state;
-  return (h("div", { class: tw('flex flex-row flex-wrap', 'border border-solid border-clrs-navy', 'h-76p5 w-76p5 text-lg') }, list.map((cell, index) => {
-    const selected = solved ? false : index === pick;
-    const focus = solved ? false : locs.includes(index);
-    return (h(Cell, { cell: cell, focus: focus, selected: selected, solved: solved }));
-  })));
+    const { list, pick, locs, solved } = state;
+    return (h("div", { class: tw('flex flex-row flex-wrap', 'border border-solid border-clrs-navy', 'h-76p5 w-76p5 text-lg') }, list.map((cell, index) => {
+        const selected = solved ? false : index === pick;
+        const focus = solved ? false : locs.includes(index);
+        return (h(Cell, { cell: cell, focus: focus, selected: selected, solved: solved }));
+    })));
 };
 
 const TwLabel = _props => {
-  return (h("label", { class: "ml-auto align-top text-xs italic text-clrs-slate4" },
-    "Tailwind ",
-    TW_VERSION));
+    return (h("label", { class: "ml-auto align-top text-xs italic text-clrs-slate4" },
+        "Tailwind ",
+        TW_VERSION));
 };
 
 const handleRefresh = (actions) => {
-  return () => {
-    actions.refresh();
-  };
+    return () => {
+        actions.refresh();
+    };
 };
 const handleCheck = (actions) => {
-  return () => {
-    actions.check();
-  };
+    return () => {
+        actions.check();
+    };
 };
 const ToolBar = _props => {
-  const { list, solved } = state;
-  return (h("div", { class: "flex flex-row" },
-    h(Button, { label: NEW_PUZZLE, callback: handleRefresh(actions) }),
-    list.length === 81 && !solved ? (h(Button, { label: CHECK, callback: handleCheck(actions) })) : (''),
-    h(TwLabel, null)));
+    const { list, solved } = state;
+    return (h("div", { class: "flex flex-row" },
+        h(Button, { label: NEW_PUZZLE, callback: handleRefresh(actions) }),
+        list.length === 81 && !solved ? (h(Button, { label: CHECK, callback: handleCheck(actions) })) : (''),
+        h(TwLabel, null)));
 };
 
 const protoSudokuCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}.ds1-main{margin:1.5rem;display:flex;flex-direction:column;font-family:ui-sans-serif,\n    system-ui,\n    -apple-system,\n    BlinkMacSystemFont,\n    'Segoe UI',\n    Roboto,\n    'Helvetica Neue',\n    Arial,\n    'Noto Sans',\n    sans-serif,\n    'Apple Color Emoji',\n    'Segoe UI Emoji',\n    'Segoe UI Symbol',\n    'Noto Color Emoji';color:var(--clrs-navy, #001f3f);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.absolute{position:absolute}.relative{position:relative}.right-0{right:0px}.top-0{top:0px}.mb-11{margin-bottom:2.75rem}.ml-0{margin-left:0px}.ml-auto{margin-left:auto}.mr-0{margin-right:0px}.mr-1{margin-right:0.25rem}.mr-2{margin-right:0.5rem}.mt-11{margin-top:2.75rem}.mt-2{margin-top:0.5rem}.mt-5{margin-top:1.25rem}.flex{display:flex}.h-24px{height:24px}.h-76p5{height:19.125rem}.h-8{height:2rem}.w-76p5{width:19.125rem}.w-8{width:2rem}.max-w-min{max-width:-moz-min-content;max-width:min-content}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-end{justify-content:flex-end}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-solid{border-style:solid}.border-clrs-gray{border-color:var(--clrs-gray, #aaaaaa)}.border-clrs-navy{border-color:var(--clrs-navy, #001f3f)}.border-clrs-red{border-color:var(--clrs-red, #ff4136)}.border-clrs-slate4{border-color:var(--clrs-slate4, #4e5964)}.bg-clrs-green-a50{background-color:var(--clrs-green-a50, #2ecc4050)}.bg-clrs-navy{background-color:var(--clrs-navy, #001f3f)}.bg-clrs-red{background-color:var(--clrs-red, #ff4136)}.bg-clrs-red-a50{background-color:var(--clrs-red-a50, #ff413650)}.bg-clrs-silver{background-color:var(--clrs-silver, #dddddd)}.bg-clrs-slate4{background-color:var(--clrs-slate4, #4e5964)}.bg-clrs-yellow{background-color:var(--clrs-yellow, #ffdc00)}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity))}.p-0{padding:0px}.p-0\\.5{padding:0.125rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.px-3{padding-left:0.75rem;padding-right:0.75rem}.py-1{padding-top:0.25rem;padding-bottom:0.25rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-center{text-align:center}.align-top{vertical-align:top}.text-6xl{font-size:3.75rem;line-height:1}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xs{font-size:0.75rem;line-height:1rem}.font-bold{font-weight:700}.font-thin{font-weight:100}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-8{line-height:2rem}.text-clrs-gray{color:var(--clrs-gray, #aaaaaa)}.text-clrs-navy{color:var(--clrs-navy, #001f3f)}.text-clrs-red{color:var(--clrs-red, #ff4136)}.text-clrs-slate4{color:var(--clrs-slate4, #4e5964)}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.opacity-25{opacity:0.25}.opacity-75{opacity:0.75}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),\n    0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),\n    var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.border-xbb-clrs-navy{border-bottom:1px solid var(--clrs-navy, #001f3f) !important}.border-xbt-clrs-navy{border-top:1px solid var(--clrs-navy, #001f3f) !important}.border-xbl-clrs-navy{border-left:1px solid var(--clrs-navy, #001f3f) !important}.border-xbr-clrs-navy{border-right:1px solid var(--clrs-navy, #001f3f) !important}.hover\\:text-clrs-navy:hover{color:var(--clrs-navy, #001f3f)}";
 
 const ProtoSudoku = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.tag = 'proto-sudoku';
-    this.platform = 'vercel';
-  }
-  componentDidLoad() {
-    actions.initApp(this.platform);
-  }
-  render() {
-    return (h("div", { id: "app", class: "ds1-main relative max-w-min p-0.5" }, h(Eswat2Io, null), h(Header, null, "Sudoku"), h(SudokuBoard, null), h(Keys, null), h("hr", { class: "ml-0 mr-0" }), h(ToolBar, null), h(Alerts, null)));
-  }
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.tag = 'proto-sudoku';
+        this.platform = 'vercel';
+    }
+    componentDidLoad() {
+        actions.initApp(this.platform);
+    }
+    render() {
+        return (h("div", { id: "app", class: "ds1-main relative max-w-min p-0.5" }, h(Eswat2Io, null), h(Header, null, "Sudoku"), h(SudokuBoard, null), h(Keys, null), h("hr", { class: "ml-0 mr-0" }), h(ToolBar, null), h(Alerts, null)));
+    }
 };
 ProtoSudoku.style = protoSudokuCss;