Merge remote-tracking branch 'upstream/development' into feat-atable-…

…gradient-cell-change
agritheory · Jan 3, 2025 · 74f2707 · 74f2707
2 parents 211e767 + f3bd786
commit 74f2707
Show file tree

Hide file tree

Showing 142 changed files with 3,718 additions and 740 deletions.
diff --git a/aform/CHANGELOG.json b/aform/CHANGELOG.json
@@ -1,6 +1,72 @@
 {
   "name": "@stonecrop/aform",
   "entries": [
+    {
+      "version": "0.3.7",
+      "tag": "@stonecrop/aform_v0.3.7",
+      "date": "Fri, 03 Jan 2025 06:27:07 GMT",
+      "comments": {}
+    },
+    {
+      "version": "0.3.6",
+      "tag": "@stonecrop/aform_v0.3.6",
+      "date": "Fri, 27 Dec 2024 09:24:01 GMT",
+      "comments": {}
+    },
+    {
+      "version": "0.3.5",
+      "tag": "@stonecrop/aform_v0.3.5",
+      "date": "Tue, 24 Dec 2024 11:42:53 GMT",
+      "comments": {
+        "patch": [
+          {
+            "comment": "fix broken table stories"
+          }
+        ]
+      }
+    },
+    {
+      "version": "0.3.4",
+      "tag": "@stonecrop/aform_v0.3.4",
+      "date": "Wed, 18 Dec 2024 09:54:31 GMT",
+      "comments": {}
+    },
+    {
+      "version": "0.3.3",
+      "tag": "@stonecrop/aform_v0.3.3",
+      "date": "Tue, 17 Dec 2024 13:42:30 GMT",
+      "comments": {
+        "none": [
+          {
+            "comment": "small style update to Adate"
+          }
+        ]
+      }
+    },
+    {
+      "version": "0.3.2",
+      "tag": "@stonecrop/aform_v0.3.2",
+      "date": "Tue, 17 Dec 2024 10:07:54 GMT",
+      "comments": {
+        "patch": [
+          {
+            "comment": "format adate emit response to fit native datepicker"
+          }
+        ]
+      }
+    },
+    {
+      "version": "0.3.1",
+      "tag": "@stonecrop/aform_v0.3.1",
+      "date": "Tue, 17 Dec 2024 08:28:48 GMT",
+      "comments": {
+        "patch": [
+          {
+            "comment": "update deps"
+          }
+        ]
+      }
+    },
     {
       "version": "0.3.0",
       "tag": "@stonecrop/aform_v0.3.0",

diff --git a/aform/CHANGELOG.md b/aform/CHANGELOG.md
@@ -1,6 +1,49 @@
 # Change Log - @stonecrop/aform
 
-This log was last generated on Mon, 16 Dec 2024 07:40:48 GMT and should not be manually modified.
+This log was last generated on Fri, 03 Jan 2025 06:27:07 GMT and should not be manually modified.
+
+## 0.3.7
+Fri, 03 Jan 2025 06:27:07 GMT
+
+_Version update only_
+
+## 0.3.6
+Fri, 27 Dec 2024 09:24:01 GMT
+
+_Version update only_
+
+## 0.3.5
+Tue, 24 Dec 2024 11:42:53 GMT
+
+### Patches
+
+- fix broken table stories
+
+## 0.3.4
+Wed, 18 Dec 2024 09:54:31 GMT
+
+_Version update only_
+
+## 0.3.3
+Tue, 17 Dec 2024 13:42:30 GMT
+
+### Updates
+
+- small style update to Adate
+
+## 0.3.2
+Tue, 17 Dec 2024 10:07:54 GMT
+
+### Patches
+
+- format adate emit response to fit native datepicker
+
+## 0.3.1
+Tue, 17 Dec 2024 08:28:48 GMT
+
+### Patches
+
+- update deps
 
 ## 0.3.0
 Mon, 16 Dec 2024 07:40:48 GMT

diff --git a/aform/package.json b/aform/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@stonecrop/aform",
-	"version": "0.3.0",
+	"version": "0.3.7",
 	"license": "MIT",
 	"type": "module",
 	"author": {
@@ -44,7 +44,7 @@
 	"dependencies": {
 		"@stonecrop/themes": "workspace:*",
 		"@stonecrop/utilities": "workspace:*",
-		"@vueuse/core": "^11.1.0",
+		"@vueuse/core": "^12.0.0",
 		"vue": "^3.5.11"
 	},
 	"devDependencies": {

diff --git a/aform/src/components/form/ACheckbox.vue b/aform/src/components/form/ACheckbox.vue
@@ -19,7 +19,14 @@ import { InputHTMLAttributes } from 'vue'
 
 import { ComponentProps } from '../../types'
 
-const { label, required, readonly, uuid, validation = { errorMessage: '&nbsp;' } } = defineProps<ComponentProps>()
+const {
+	schema, // don't remove to allow masking to work
+	label,
+	required,
+	readonly,
+	uuid,
+	validation = { errorMessage: '&nbsp;' },
+} = defineProps<ComponentProps>()
 const checkbox = defineModel<InputHTMLAttributes['checked']>()
 </script>
 

diff --git a/aform/src/components/form/ADate.vue b/aform/src/components/form/ADate.vue
@@ -1,12 +1,12 @@
 <template>
 	<div>
 		<input
+			v-model="inputDate"
 			ref="date"
 			type="date"
 			:id="uuid"
 			:disabled="readonly"
 			:required="required"
-			:value="inputDate"
 			@click="showPicker" />
 		<label :for="uuid">{{ label }}</label>
 		<p v-show="validation.errorMessage" v-html="validation.errorMessage"></p>
@@ -19,14 +19,18 @@ import { useTemplateRef } from 'vue'
 import { ComponentProps } from '../../types'
 
 const {
+	schema, // don't remove to allow masking to work
 	label = 'Date',
 	required,
 	readonly,
 	uuid,
 	validation = { errorMessage: '&nbsp;' },
 } = defineProps<ComponentProps>()
 
-const inputDate = defineModel<string | number | Date>()
+const inputDate = defineModel<string | number | Date>({
+	// format the date to be compatible with the native input datepicker
+	set: value => new Date(value).toISOString().split('T')[0],
+})
 const dateRef = useTemplateRef<HTMLInputElement>('date')
 
 const showPicker = () => {
@@ -44,6 +48,8 @@ const showPicker = () => {
 <style scoped>
 div {
 	min-width: 40ch;
+	width: 100%;
+	box-sizing: border-box;
 	border: 1px solid transparent;
 	padding: 0rem;
 	margin: 0rem;
@@ -52,6 +58,7 @@ div {
 
 input {
 	width: calc(100% - 1ch);
+	box-sizing: border-box;
 	outline: 1px solid transparent;
 	border: 1px solid var(--sc-input-border-color);
 	padding: 1ch 0.5ch 0.5ch 1ch;
@@ -69,12 +76,14 @@ label {
 	margin: 0rem;
 	border: 1px solid transparent;
 	margin-bottom: 0.25rem;
+	box-sizing: border-box;
 }
 
 p {
 	width: 100%;
 	color: red;
 	font-size: 85%;
+	box-sizing: border-box;
 }
 
 label {
@@ -84,6 +93,7 @@ label {
 	background: white;
 	margin: calc(-1.5rem - calc(2.15rem / 2)) 0 0 1ch;
 	padding: 0 0.25ch 0 0.25ch;
+	box-sizing: border-box;
 }
 
 input:focus {

diff --git a/aform/src/components/form/ADatePicker.vue b/aform/src/components/form/ADatePicker.vue
@@ -1,38 +1,40 @@
 <template>
 	<div class="adatepicker" tabindex="0" ref="datepicker">
 		<table>
-			<tr>
-				<td id="previous-month-btn" @click="previousMonth" :tabindex="-1">&lt;</td>
-				<th colspan="5" :tabindex="-1">{{ monthAndYear }}</th>
-				<td id="next-month-btn" @click="nextMonth" :tabindex="-1">&gt;</td>
-			</tr>
-			<tr class="days-header">
-				<td>M</td>
-				<td>T</td>
-				<td>W</td>
-				<td>T</td>
-				<td>F</td>
-				<td>S</td>
-				<td>S</td>
-			</tr>
-			<tr v-for="rowNo in numberOfRows" :key="rowNo">
-				<!-- the 'ref' key is currently only used for test references -->
-				<td
-					v-for="colNo in numberOfColumns"
-					ref="celldate"
-					:key="getCurrentCell(rowNo, colNo)"
-					:contenteditable="false"
-					:spellcheck="false"
-					:tabindex="0"
-					@click.prevent.stop="selectDate(getCurrentCell(rowNo, colNo))"
-					@keydown.enter="selectDate(getCurrentCell(rowNo, colNo))"
-					:class="{
-						todaysDate: isTodaysDate(getCurrentDate(rowNo, colNo)),
-						selectedDate: isSelectedDate(getCurrentDate(rowNo, colNo)),
-					}">
-					{{ new Date(getCurrentDate(rowNo, colNo)).getDate() }}
-				</td>
-			</tr>
+			<tbody>
+				<tr>
+					<td id="previous-month-btn" @click="previousMonth" :tabindex="-1">&lt;</td>
+					<th colspan="5" :tabindex="-1">{{ monthAndYear }}</th>
+					<td id="next-month-btn" @click="nextMonth" :tabindex="-1">&gt;</td>
+				</tr>
+				<tr class="days-header">
+					<td>M</td>
+					<td>T</td>
+					<td>W</td>
+					<td>T</td>
+					<td>F</td>
+					<td>S</td>
+					<td>S</td>
+				</tr>
+				<tr v-for="rowNo in numberOfRows" :key="rowNo">
+					<!-- the 'ref' key is currently only used for test references -->
+					<td
+						v-for="colNo in numberOfColumns"
+						ref="celldate"
+						:key="getCurrentCell(rowNo, colNo)"
+						:contenteditable="false"
+						:spellcheck="false"
+						:tabindex="0"
+						@click.prevent.stop="selectDate(getCurrentCell(rowNo, colNo))"
+						@keydown.enter="selectDate(getCurrentCell(rowNo, colNo))"
+						:class="{
+							todaysDate: isTodaysDate(getCurrentDate(rowNo, colNo)),
+							selectedDate: isSelectedDate(getCurrentDate(rowNo, colNo)),
+						}">
+						{{ new Date(getCurrentDate(rowNo, colNo)).getDate() }}
+					</td>
+				</tr>
+			</tbody>
 		</table>
 	</div>
 </template>
@@ -153,6 +155,8 @@ useKeyboardNav([
 		},
 	},
 ])
+
+defineExpose({ currentMonth, currentYear, selectedDate })
 </script>
 
 <style scoped>

diff --git a/aform/src/components/form/AFieldset.vue b/aform/src/components/form/AFieldset.vue
@@ -34,6 +34,8 @@ const toggleCollapse = (event: Event) => {
 		collapsed.value = !collapsed.value
 	}
 }
+
+defineExpose({ collapsed })
 </script>
 
 <style scoped>

diff --git a/aform/src/components/form/ANumericInput.vue b/aform/src/components/form/ANumericInput.vue
@@ -15,6 +15,13 @@
 <script setup lang="ts">
 import { ComponentProps } from '../../types'
 
-const { label, required, readonly, uuid, validation = { errorMessage: '&nbsp;' } } = defineProps<ComponentProps>()
+const {
+	schema, // don't remove to allow masking to work
+	label,
+	required,
+	readonly,
+	uuid,
+	validation = { errorMessage: '&nbsp;' },
+} = defineProps<ComponentProps>()
 const inputNumber = defineModel<number>()
 </script>
diff --git a/aform/src/components/form/ATextInput.vue b/aform/src/components/form/ATextInput.vue
@@ -19,7 +19,15 @@ import { /* inject, */ ref } from 'vue'
 import { useStringMask as vMask } from '../../directives/mask'
 import { ComponentProps } from '../../types'
 
-const { label, mask, required, readonly, uuid, validation = { errorMessage: '&nbsp;' } } = defineProps<ComponentProps>()
+const {
+	schema, // don't remove to allow masking to work
+	label,
+	mask,
+	required,
+	readonly,
+	uuid,
+	validation = { errorMessage: '&nbsp;' },
+} = defineProps<ComponentProps>()
 
 // TODO: setup maskFilled as a computed property
 const maskFilled = ref(true)