@asd20/ui-next 2.24.4 → 2.25.1

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [2.25.1](https://github.com/academydistrict20/asd20-ui-next/compare/ui-next-v2.25.0...ui-next-v2.25.1) (2026-09-23)
+
+
+### Bug Fixes
+
+* add public form activation to sidebar links ([2f82e94](https://github.com/academydistrict20/asd20-ui-next/commit/2f82e94d2249df42f695f9cfe4fbbd4e254c46b7))
+
+# [2.25.0](https://github.com/academydistrict20/asd20-ui-next/compare/ui-next-v2.24.4...ui-next-v2.25.0) (2026-09-21)
+
+
+### Features
+
+* support public form date limits and fallback guidance ([4ef8551](https://github.com/academydistrict20/asd20-ui-next/commit/4ef8551aaa98cf66f48395a9bf98d68f107a0486))
+
 ## [2.24.4](https://github.com/academydistrict20/asd20-ui-next/compare/ui-next-v2.24.3...ui-next-v2.24.4) (2026-09-17)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@asd20/ui-next",
-  "version": "2.24.4",
+  "version": "2.25.1",
   "private": false,
   "description": "ASD20 UI component library for Vue 3.",
   "license": "MIT",

package/src/components/molecules/Asd20ListItem/index.vue

@@ -3,6 +3,8 @@
     :is="tag"
     :[hrefAttr]="hrefValue"
     :[targetAttr]="targetValue"
+    :type="tag === 'button' ? 'button' : undefined"
+    :data-public-form="normalizedPublicFormId || undefined"
     class="asd20-list-item"
     :class="classes"
     @click="onClick"
@@ -168,6 +170,7 @@ export default {
     alignTop: { type: Boolean, default: false },
     to: { type: [String, Object], default: '' },
     link: { type: String, default: '' },
+    publicFormId: { type: String, default: '' },
     sourceTitle: { type: String, default: '' },
     logoUrl: { type: String, default: '' },
     attribution: { type: Boolean, default: false },
@@ -186,6 +189,9 @@ export default {
       }
     },
     tag() {
+      if (this.actionable && this.normalizedPublicFormId) {
+        return 'button'
+      }
       if (this.actionable && this.usesRouterNavigation) {
         return 'button'
       }
@@ -201,8 +207,14 @@ export default {
       return this.tag === 'a' ? 'href' : null
     },
     hrefValue() {
+      if (this.normalizedPublicFormId) return ''
       return this.link || this.to
     },
+    normalizedPublicFormId() {
+      if (!this.actionable) return ''
+      const formId = String(this.publicFormId || '').trim()
+      return /^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(formId) ? formId : ''
+    },
     usesRouterNavigation() {
       const router = resolveRouter(this)
       if (!router || !this.to) return false
@@ -230,7 +242,12 @@ export default {
     onClick(e) {
       const router = resolveRouter(this)
 
-      if (this.usesRouterNavigation && router && typeof router.push === 'function') {
+      if (
+        !this.normalizedPublicFormId &&
+        this.usesRouterNavigation &&
+        router &&
+        typeof router.push === 'function'
+      ) {
         e.preventDefault()
         router.push(this.to)
       }

package/src/components/molecules/Asd20PublicFormField/index.vue

@@ -25,6 +25,7 @@
       :required="field.required"
       :minlength="field.minLength"
       :maxlength="field.maxLength"
+      :max="dateMaximum"
       :show-character-count="showCharacterCount"
       :show-pristine-validation-errors="showPristineValidationErrors"
       :autocomplete="field.autocomplete || undefined"
@@ -123,6 +124,19 @@ import Asd20Checkbox from '../../atoms/Asd20Checkbox'
 import Asd20TextAreaInput from '../Asd20TextAreaInput'
 import Asd20TextInput from '../Asd20TextInput'
 
+function districtToday() {
+  const parts = new Intl.DateTimeFormat('en-US', {
+    timeZone: 'America/Denver',
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+  }).formatToParts(new Date())
+  const values = Object.fromEntries(
+    parts.map(({ type, value }) => [type, value])
+  )
+  return `${values.year}-${values.month}-${values.day}`
+}
+
 export default {
   name: 'Asd20PublicFormField',
   components: { Asd20Checkbox, Asd20TextAreaInput, Asd20TextInput },
@@ -141,6 +155,11 @@ export default {
     }
   },
   computed: {
+    dateMaximum() {
+      return this.field.type === 'date' && this.field.maxDate === 'today'
+        ? districtToday()
+        : undefined
+    },
     displayLabel() {
       return this.field.required
         ? `${this.field.label} (required)`

package/src/components/organisms/Asd20PublicFormModal/index.vue

@@ -102,7 +102,10 @@
           class="asd20-public-form-modal__fallback"
         >
           <p>
-            If you cannot submit this form, use one of these contact options:
+            {{
+              formDefinition.fallbackContact.instructions ||
+                'If you cannot submit this form, use one of these contact options:'
+            }}
           </p>
           <a
             v-if="formDefinition.fallbackContact.email"

package/src/helpers/mapLinksToListItems.js

@@ -14,6 +14,7 @@ export default function mapLinksToListItems(links) {
         alignTop: false,
         tags: [],
         link: l.url || '',
+        publicFormId: l.publicFormId || '',
         thumbnail: l.imageUrl,
         to: l.to || l.path,
       }

package/src/helpers/publicFormDefinition.js

@@ -34,6 +34,12 @@ function optionalLength(value, label) {
   return value
 }
 
+function optionalMaxDate(value, type) {
+  if (value == null) return undefined
+  if (type === 'date' && value === 'today') return 'today'
+  throw new Error('Maximum date is invalid.')
+}
+
 function normalizeOptions(field) {
   if (!['select', 'radio'].includes(field.type)) return undefined
   if (
@@ -81,6 +87,7 @@ function normalizeField(field) {
     required: field.required === true,
     minLength: optionalLength(field.minLength, 'Minimum length'),
     maxLength: optionalLength(field.maxLength, 'Maximum length'),
+    maxDate: optionalMaxDate(field.maxDate, type),
     autocomplete: boundedText(field.autocomplete, 'Autocomplete value', 100),
     options: undefined,
   }
@@ -134,9 +141,14 @@ export function normalizePublicFormDefinition(definition) {
     }
     const email = boundedText(fallbackContact.email, 'Fallback email', 320)
     const phone = boundedText(fallbackContact.phone, 'Fallback phone', 50)
+    const instructions = boundedText(
+      fallbackContact.instructions,
+      'Fallback instructions',
+      1000
+    )
     if (email && !EMAIL_PATTERN.test(email))
       throw new Error('The public form fallback email is invalid.')
-    normalizedFallback = { email, phone }
+    normalizedFallback = { email, phone, instructions }
   }
 
   const id = boundedText(definition.id, 'Form ID', 100, true)
@@ -183,6 +195,19 @@ function validDate(value) {
   )
 }
 
+function districtToday() {
+  const parts = new Intl.DateTimeFormat('en-US', {
+    timeZone: 'America/Denver',
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+  }).formatToParts(new Date())
+  const values = Object.fromEntries(
+    parts.map(({ type, value }) => [type, value])
+  )
+  return `${values.year}-${values.month}-${values.day}`
+}
+
 export function validatePublicFormValues(definition, sourceValues = {}) {
   const errors = {}
   const values = {}
@@ -220,6 +245,14 @@ export function validatePublicFormValues(definition, sourceValues = {}) {
       if (value && field.type === 'date' && !validDate(value)) {
         fieldErrors.push(`Enter a valid ${field.label.toLowerCase()}.`)
       }
+      if (
+        value &&
+        field.type === 'date' &&
+        field.maxDate === 'today' &&
+        value > districtToday()
+      ) {
+        fieldErrors.push(`${field.label} cannot be in the future.`)
+      }
       if (value && ['select', 'radio'].includes(field.type)) {
         const allowedValues = new Set(
           (field.options || []).map(option => option.value)