fix styling (user select); fix Date zero on ff; compile to one file

package-lock.json

@@ -8,6 +8,13 @@
       "name": "slots",
       "version": "0.0.0",
       "dependencies": {
+        "lodash.chunk": "^4.2.0",
+        "lodash.compact": "^3.0.1",
+        "lodash.flatten": "^4.4.0",
+        "lodash.frompairs": "^4.0.1",
+        "lodash.includes": "^4.3.0",
+        "lodash.reject": "^4.6.0",
+        "lodash.topairs": "^4.3.0",
         "primus": "^8.0.7",
         "pro-router": "^4.3.2",
         "uws": "^200.0.0"
@@ -15,7 +22,8 @@
       "devDependencies": {
         "imba": "^2.0.0-alpha.226",
         "vite": "^3.2.5",
-        "vite-plugin-imba": "^0.10.1"
+        "vite-plugin-imba": "^0.10.1",
+        "vite-plugin-singlefile": "^0.13.2"
       }
     },
     "node_modules/@adobe/css-tools": {
@@ -2266,6 +2274,41 @@
       "dev": true,
       "peer": true
     },
+    "node_modules/lodash.chunk": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.chunk/-/lodash.chunk-4.2.0.tgz",
+      "integrity": "sha512-ZzydJKfUHJwHa+hF5X66zLFCBrWn5GeF28OHEr4WVWtNDXlQ/IjWKPBiikqKo2ne0+v6JgCgJ0GzJp8k8bHC7w=="
+    },
+    "node_modules/lodash.compact": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.compact/-/lodash.compact-3.0.1.tgz",
+      "integrity": "sha512-2ozeiPi+5eBXW1CLtzjk8XQFhQOEMwwfxblqeq6EGyTxZJ1bPATqilY0e6g2SLQpP4KuMeuioBhEnWz5Pr7ICQ=="
+    },
+    "node_modules/lodash.flatten": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
+      "integrity": "sha512-C5N2Z3DgnnKr0LOpv/hKCgKdb7ZZwafIrsesve6lmzvZIRZRGaZ/l6Q8+2W7NaT+ZwO3fFlSCzCzrDCFdJfZ4g=="
+    },
+    "node_modules/lodash.frompairs": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.frompairs/-/lodash.frompairs-4.0.1.tgz",
+      "integrity": "sha512-dvqe2I+cO5MzXCMhUnfYFa9MD+/760yx2aTAN1lqEcEkf896TxgrX373igVdqSJj6tQd0jnSLE1UMuKufqqxFw=="
+    },
+    "node_modules/lodash.includes": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.includes/-/lodash.includes-4.3.0.tgz",
+      "integrity": "sha512-W3Bx6mdkRTGtlJISOvVD/lbqjTlPPUDTMnlXZFnVwi9NKJ6tiAk6LVdlhZMm17VZisqhKcgzpO5Wz91PCt5b0w=="
+    },
+    "node_modules/lodash.reject": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
+      "integrity": "sha512-qkTuvgEzYdyhiJBx42YPzPo71R1aEr0z79kAv7Ixg8wPFEjgRgJdUsGMG3Hf3OYSF/kHI79XhNlt+5Ar6OzwxQ=="
+    },
+    "node_modules/lodash.topairs": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.topairs/-/lodash.topairs-4.3.0.tgz",
+      "integrity": "sha512-qrRMbykBSEGdOgQLJJqVSdPWMD7Q+GJJ5jMRfQYb+LTLsw3tYVIabnCzRqTJb2WTo17PG5gNzXuFaZgYH/9SAQ=="
+    },
     "node_modules/loupe": {
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.6.tgz",
@@ -2309,7 +2352,6 @@
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
       "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
       "dev": true,
-      "peer": true,
       "dependencies": {
         "braces": "^3.0.2",
         "picomatch": "^2.3.1"
@@ -3180,6 +3222,22 @@
         "node": ">=6"
       }
     },
+    "node_modules/vite-plugin-singlefile": {
+      "version": "0.13.2",
+      "resolved": "https://registry.npmjs.org/vite-plugin-singlefile/-/vite-plugin-singlefile-0.13.2.tgz",
+      "integrity": "sha512-HAvrU9mxasNMn/YF0Hb9NjsWDstCWe4iLQ6IR5ppOiNMvXjcyqU3C9SDQ32xnonx3Y04JUGjD2bGiT6q0S9T8w==",
+      "dev": true,
+      "dependencies": {
+        "micromatch": "^4.0.5"
+      },
+      "engines": {
+        "node": "^14.18.0 || >=16.0.0"
+      },
+      "peerDependencies": {
+        "rollup": ">=2.79.0",
+        "vite": ">=3.2.0"
+      }
+    },
     "node_modules/vitest": {
       "version": "0.27.0",
       "resolved": "https://registry.npmjs.org/vitest/-/vitest-0.27.0.tgz",
@@ -4941,6 +4999,41 @@
       "dev": true,
       "peer": true
     },
+    "lodash.chunk": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.chunk/-/lodash.chunk-4.2.0.tgz",
+      "integrity": "sha512-ZzydJKfUHJwHa+hF5X66zLFCBrWn5GeF28OHEr4WVWtNDXlQ/IjWKPBiikqKo2ne0+v6JgCgJ0GzJp8k8bHC7w=="
+    },
+    "lodash.compact": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.compact/-/lodash.compact-3.0.1.tgz",
+      "integrity": "sha512-2ozeiPi+5eBXW1CLtzjk8XQFhQOEMwwfxblqeq6EGyTxZJ1bPATqilY0e6g2SLQpP4KuMeuioBhEnWz5Pr7ICQ=="
+    },
+    "lodash.flatten": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
+      "integrity": "sha512-C5N2Z3DgnnKr0LOpv/hKCgKdb7ZZwafIrsesve6lmzvZIRZRGaZ/l6Q8+2W7NaT+ZwO3fFlSCzCzrDCFdJfZ4g=="
+    },
+    "lodash.frompairs": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.frompairs/-/lodash.frompairs-4.0.1.tgz",
+      "integrity": "sha512-dvqe2I+cO5MzXCMhUnfYFa9MD+/760yx2aTAN1lqEcEkf896TxgrX373igVdqSJj6tQd0jnSLE1UMuKufqqxFw=="
+    },
+    "lodash.includes": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.includes/-/lodash.includes-4.3.0.tgz",
+      "integrity": "sha512-W3Bx6mdkRTGtlJISOvVD/lbqjTlPPUDTMnlXZFnVwi9NKJ6tiAk6LVdlhZMm17VZisqhKcgzpO5Wz91PCt5b0w=="
+    },
+    "lodash.reject": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
+      "integrity": "sha512-qkTuvgEzYdyhiJBx42YPzPo71R1aEr0z79kAv7Ixg8wPFEjgRgJdUsGMG3Hf3OYSF/kHI79XhNlt+5Ar6OzwxQ=="
+    },
+    "lodash.topairs": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.topairs/-/lodash.topairs-4.3.0.tgz",
+      "integrity": "sha512-qrRMbykBSEGdOgQLJJqVSdPWMD7Q+GJJ5jMRfQYb+LTLsw3tYVIabnCzRqTJb2WTo17PG5gNzXuFaZgYH/9SAQ=="
+    },
     "loupe": {
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.6.tgz",
@@ -4978,7 +5071,6 @@
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz",
       "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==",
       "dev": true,
-      "peer": true,
       "requires": {
         "braces": "^3.0.2",
         "picomatch": "^2.3.1"
@@ -5623,6 +5715,15 @@
         }
       }
     },
+    "vite-plugin-singlefile": {
+      "version": "0.13.2",
+      "resolved": "https://registry.npmjs.org/vite-plugin-singlefile/-/vite-plugin-singlefile-0.13.2.tgz",
+      "integrity": "sha512-HAvrU9mxasNMn/YF0Hb9NjsWDstCWe4iLQ6IR5ppOiNMvXjcyqU3C9SDQ32xnonx3Y04JUGjD2bGiT6q0S9T8w==",
+      "dev": true,
+      "requires": {
+        "micromatch": "^4.0.5"
+      }
+    },
     "vitest": {
       "version": "0.27.0",
       "resolved": "https://registry.npmjs.org/vitest/-/vitest-0.27.0.tgz",

package.json

@@ -11,9 +11,17 @@
   "devDependencies": {
     "imba": "^2.0.0-alpha.226",
     "vite": "^3.2.5",
-    "vite-plugin-imba": "^0.10.1"
+    "vite-plugin-imba": "^0.10.1",
+    "vite-plugin-singlefile": "^0.13.2"
   },
   "dependencies": {
+    "lodash.chunk": "^4.2.0",
+    "lodash.compact": "^3.0.1",
+    "lodash.flatten": "^4.4.0",
+    "lodash.frompairs": "^4.0.1",
+    "lodash.includes": "^4.3.0",
+    "lodash.reject": "^4.6.0",
+    "lodash.topairs": "^4.3.0",
     "primus": "^8.0.7",
     "pro-router": "^4.3.2",
     "uws": "^200.0.0"

src/main.imba

@@ -1,50 +0,0 @@
-global css @root ff:Arial c:white/87 bg:black/85
-global css a c:indigo5 c@hover:indigo6
-global css body m:0 d:flex ja:center h:100vh
-
-tag app-counter
-	count = 0
-	<self @click=count++> "Count is {count}"
-
-		# css without a selector applies to the enclosing element
-		css d:inline-block user-select:none cursor:pointer fs:6 bg:gray9
-			p:2.5 5 m:6 bd:1px solid transparent rd:4 tween:border-color 250ms
-			bc@hover:indigo5
-
-tag app
-
-	# inline styles with square brackets
-	<self[max-width:1280px m:0 auto p:2rem ta:center]>
-
-		# this css applies to nested svg elements and not parents
-		css img h:23 p:1.5em
-			transition:transform 250ms, filter 250ms
-			@hover transform:scale(1.1)
-				filter:drop-shadow(0 0 4em red5)
-
-		<a href="https://imba.io" target="_blank">
-			<img.wing src="https://raw.githubusercontent.com/imba/branding-imba/master/yellow-wing-logo/imba.svg">
-		<a href="https://vitejs.dev" target="_blank">
-			<img src="https://raw.githubusercontent.com/imba/branding-imba/master/misc/vite.svg">
-				css filter@hover:drop-shadow(0 0 4em white7)
-		<a href="https://imba.io" target="_blank">
-			<[d:inline-block transform:rotateY(180deg)]>
-				<img.wing src="https://raw.githubusercontent.com/imba/branding-imba/master/yellow-wing-logo/imba.svg">
-
-		<h1[c:yellow4 fs:3.2em lh:1.1]> "Imba + Vite"
-
-		<app-counter>
-
-		css p c:warm1 ws:pre
-		css a td:none
-		<p>
-			"Check out our documentation at "
-			<a href="https://imba.io" target="_blank"> "Imba.io"
-			"."
-		<p>
-			"Take the free Imba course on "
-			<a href="https://scrimba.com/learn/imba/intro-co3bc40f5b6a7b0cffda32113" target="_blank">
-				"Scrimba.com"
-			"."
-
-imba.mount <app>

src/router.imba

@@ -1,6 +1,12 @@
 import "pro-router/standalone"
 import "./lib/router_tag.imba"
-import { compact, fromPairs, chunk, includes, reject, toPairs, flatten } from 'lodash'
+import compact from 'lodash.compact'
+import fromPairs from 'lodash.frompairs'
+import chunk from 'lodash.chunk'
+import includes from 'lodash.includes'
+import reject from 'lodash.reject'
+import toPairs from 'lodash.topairs'
+import flatten from 'lodash.flatten'
 
 global.H =
 	compact: compact

src/ui/plus-minus.imba

@@ -7,19 +7,19 @@ tag plus-minus
 	css m:10px
 		> miw:50px h:50px p:19px 5px 0 ta:center fs:180%
 
-	<self.bordered-complex @wheel.prevent=(e.deltaY < 0 ? incr! : decr!)>
+	<self.clickable.bordered-complex @wheel.prevent=(e.deltaY < 0 ? incr! : decr!)>
-		<plus-minus-plus.first incr=incr>
+		<.first @click=incr><div> '+'
 		if value
 			<div> decorate ? decorate(value) : value
-		<plus-minus-minus.last decr=decr>
+		<.last @click=decr><div> '-'
 
 tag plus-minus-plus
 	prop incr
-	<self.clickable@click=incr> '+'
+	<self@click=incr> '+'
 
 tag plus-minus-minus
 	prop decr
-	<self.clickable@click=decr> '-'
+	<self@click=decr> '-'
 
 tag plus-minus-v < plus-minus
 	css d:flex fld:row-reverse fs:x-small

src/ui/slot-size-input.imba

@@ -1,7 +1,7 @@
 import './plus-minus.imba'
 
 let h =
-	zero: do new Date("1.01.1970")
+	zero: do new Date("1970-01-01T00:00")
 	max_size: do #ms ||= R.getters.size "3_0_0", 1 # 3 days
 
 	validate: do |s|
@@ -40,12 +40,14 @@ export default h
 
 R.setters.size = do |v| let s = "{h.days(v)}_{v.getHours!}_{v.getMinutes!}"; s if s!= "0_0_30"
 R.getters.size = do |v, skip_validation|
-	let size = v ? v.split('_') : [0, 0, 30]
+	v ||= "0_0_30"
+	let size = v.split('_')
 	let date = h.set_time(*size)
 	skip_validation ? date : h.validate(date)
 
 tag slot-size-input
 	<self[d:hflex jac:center]>
+		console.log(R.param('size'))
 		if h.days! > 0
 			<plus-minus value=h.days! decorate=h.format_d decr=h.decr_day incr=h.incr_day>
 		<plus-minus value=R.param('size').getHours!.toString! decorate=h.format_h decr=h.decr_h incr=h.incr_h>

vite.config.js

@@ -1,7 +1,8 @@
 import { imba } from 'vite-plugin-imba';
 import { defineConfig } from 'vite';
+import { viteSingleFile } from "vite-plugin-singlefile"
 
 export default defineConfig({
 	base: '',
-	plugins: [imba()],
+	plugins: [imba(), viteSingleFile({removeViteModuleLoader: true})],
 });