@asd20/ui 3.4.2 → 3.4.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@asd20/ui",
-  "version": "3.4.2",
+  "version": "3.4.4",
   "private": false,
   "license": "MIT",
   "sideEffects": [

package/src/components/templates/Asd20DistrictHomeTemplate/index.vue

@@ -219,7 +219,7 @@ export default {
   flex-direction: column;
   flex-grow: 1;
   flex-shrink: 0;
-  overflow-y: auto;
+  overflow: hidden;
   margin-top: space(2.25);
   nav {
     .asd20-picker {

package/src/components/templates/Asd20DistrictVideoTemplate/index.vue

@@ -246,7 +246,7 @@ export default {
   flex-direction: column;
   flex-grow: 1;
   flex-shrink: 0;
-  overflow-y: auto;
+  overflow: hidden;
   margin-top: space(2.25);
 
   .asd20-video-header {

package/src/components/templates/Asd20ProfileTemplate/index.vue

@@ -563,20 +563,6 @@ export default {
   .asd20-notification-group--floating {
     position: absolute;
     top: space(2.0375);
-    // .bell {
-    //   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.125) !important;
-    //   svg {
-    //     fill: var(--color__accent) !important;
-    //   }
-    //   span {
-    //     background: var(--color__accent) !important;
-    //     top: inherit !important;
-    //     right: inherit !important;
-    //     width: 1.2rem !important;
-    //     height: 1.2rem !important;
-    //     font-size: 0.75rem !important;
-    //   }
-    // }
   }
 }
 

package/src/components/templates/Asd20SchoolHomeTemplate/index.vue

@@ -1,20 +1,19 @@
 <template>
   <div class="asd20-school-home-template">
     <!-- Skip Nav -->
-    <asd20-skip-to></asd20-skip-to>
+    <asd20-skip-to/>
 
     <!-- Site Navigation -->
     <asd20-site-navigation
       :navigation="navigation"
       :action-items="actionItems"
-      @update:menuOpen="$emit('update:menuOpen', $event)"
       :menu-open="menuOpen"
-      @update:searchOpen="$emit('update:searchOpen', $event)"
       :search-open="searchOpen"
-      :organization="organization"
       :organization-options="organizationOptions"
-    >
-    </asd20-site-navigation>
+      :organization="organization"
+      @update:menuOpen="$emit('update:menuOpen', $event)"
+      @update:searchOpen="$emit('update:searchOpen', $event)"
+    />
 
     <!-- Banner Notifications -->
     <client-only>
@@ -23,13 +22,13 @@
         group-type="banner"
         @dismiss="$emit('dismiss-notification', $event)"
         @toggle-all="$emit('toggle-all')"
-      ></asd20-notification-group>
+      />
     </client-only>
 
     <!-- Page Header -->
     <asd20-school-homepage-header
-      id="page-header"
       v-if="pageHeaderContent"
+      id="page-header"
       v-bind="pageHeaderContent"
       fullscreen
     >
@@ -41,7 +40,7 @@
               :organization-options="organizationOptions"
               :organization="organization"
               logo-size="lg"
-            ></asd20-organization-picker>
+            />
             <a
               v-if="websiteLogoProps && showLogo"
               :href="websiteLogoProps.logoLink ? websiteLogoProps.logoLink : ''"
@@ -57,7 +56,7 @@
                 :aria-label="
                   websiteLogoProps.logoAlt ? websiteLogoProps.logoAlt : ''
                 "
-              />
+              >
             </a>
             <a
               v-if="websiteLogoProps2 && showLogo"
@@ -75,7 +74,7 @@
                 :alt="
                   websiteLogoProps2.logoAlt ? websiteLogoProps2.logoAlt : ''
                 "
-              />
+              >
             </a>
           </div>
         </client-only>
@@ -128,7 +127,7 @@
               group-type="floating"
               @dismiss="$emit('dismiss-notification', $event)"
               @toggle-all="$emit('toggle-all')"
-            ></asd20-notification-group>
+            />
           </client-only>
         </div>
       </template>
@@ -140,30 +139,29 @@
     </asd20-quicklinks-menu>
 
     <!-- Page Content -->
-    <asd20-page-content> </asd20-page-content>
 
     <!-- Feeds -->
     <asd20-feeds-section
       :announcements="announcements"
       :announcements-feed-props="announcementsFeedProps"
-      @announcements-in-view="$emit('announcements-in-view')"
       :stories="stories"
       :stories-feed-props="storiesFeedProps"
-      @stories-in-view="$emit('stories-in-view')"
-      :events="events"
-      :events-feed-props="eventsFeedProps"
-      @events-in-view="$emit('events-in-view')"
       :organization="organization"
+      :events-feed-props="eventsFeedProps"
+      :events="events"
       :organization-options="organizationOptions"
-    ></asd20-feeds-section>
+      @announcements-in-view="$emit('announcements-in-view')"
+      @stories-in-view="$emit('stories-in-view')"
+      @events-in-view="$emit('events-in-view')"
+    />
 
     <!-- Footer -->
     <asd20-page-footer
       :organization="organization"
-      :socialLinks="socialLinks"
-      :disclosureLinks="disclosureLinks"
-      :websiteLogoProps="websiteLogoProps"
-      :websiteLogoProps2="websiteLogoProps2"
+      :social-links="socialLinks"
+      :disclosure-links="disclosureLinks"
+      :website-logo-props="websiteLogoProps"
+      :website-logo-props2="websiteLogoProps2"
     >
       <slot name="page-footer" />
     </asd20-page-footer>
@@ -183,7 +181,7 @@ import Asd20SchoolHomepageHeader from '../../../components/organisms/Asd20School
 import Asd20PageFooter from '../../../components/organisms/Asd20PageFooter'
 import Asd20SiteNavigation from '../../../components/organisms/Asd20SiteNavigation'
 import Asd20QuicklinksMenu from '../../../components/organisms/Asd20QuicklinksMenu'
-import Asd20PageContent from '../../../components/organisms/Asd20PageContent'
+// import Asd20PageContent from '../../../components/organisms/Asd20PageContent'
 import Asd20NotificationGroup from '../../../components/organisms/Asd20NotificationGroup'
 import Asd20FeedsSection from '../../../components/organisms/Asd20FeedsSection'
 import Asd20OrganizationPicker from '../../../components/organisms/Asd20OrganizationPicker'
@@ -196,14 +194,9 @@ import _get from 'lodash/get'
 export default {
   name: 'Asd20SchoolHomeTemplate',
 
-  mixins: [pageTemplateMixin],
-
-  directives: { scrollTrack },
-
   components: {
     Asd20SkipTo,
     Asd20SchoolHomepageHeader,
-    Asd20PageContent,
     Asd20PageFooter,
     Asd20SiteNavigation,
     Asd20QuicklinksMenu,
@@ -213,6 +206,8 @@ export default {
     Asd20LanguageTranslation,
     Asd20BlockSchedule,
   },
+  directives: { scrollTrack },
+  mixins: [pageTemplateMixin],
   props: {
     languageCode: { type: String, default: 'en' },
   },
@@ -257,15 +252,30 @@ export default {
     },
     blockEvent() {
       if (!this.events || this.events.length === 0) return null
+
+      const isSameLocalDay = (a, b) =>
+        a.getFullYear() === b.getFullYear() &&
+        a.getMonth() === b.getMonth() &&
+        a.getDate() === b.getDate()
+
+      const today = new Date()
+
       return (
         this.events.find(
           e =>
             Array.isArray(e.calendarKeywords) &&
-            e.calendarKeywords.includes('Block Schedule')
+            e.calendarKeywords.includes('Block Schedule') &&
+            isSameLocalDay(new Date(e.start), today)
         ) || null
       )
     },
   },
+  watch: {
+    // If the organization changes (picker, route change, etc.), refetch.
+    'organization.id': function () {
+      this.$emit('events-in-view')
+    },
+  },
   mounted() {
     this.showLogo = window.innerWidth >= 1350
     window.addEventListener('resize', this.handleResize)
@@ -274,12 +284,6 @@ export default {
       this.$emit('events-in-view')
     }
   },
-  watch: {
-    // If the organization changes (picker, route change, etc.), refetch.
-    'organization.id': function () {
-      this.$emit('events-in-view')
-    },
-  },
   methods: {
     handleResize() {
       this.showLogo = window.innerWidth >= 1350
@@ -303,7 +307,7 @@ export default {
   flex-direction: column;
   flex-grow: 1;
   flex-shrink: 0;
-  overflow-y: auto;
+  overflow: hidden;
   margin-top: space(2.25);
   .weather-link {
     text-decoration: none;

package/src/components/templates/Asd20SchoolHomeVideoTemplate/index.vue

@@ -7,14 +7,13 @@
     <asd20-site-navigation
       :navigation="navigation"
       :action-items="actionItems"
-      @update:menuOpen="$emit('update:menuOpen', $event)"
       :menu-open="menuOpen"
-      @update:searchOpen="$emit('update:searchOpen', $event)"
       :search-open="searchOpen"
       :organization="organization"
       :organization-options="organizationOptions"
-    >
-    </asd20-site-navigation>
+      @update:menuOpen="$emit('update:menuOpen', $event)"
+      @update:searchOpen="$emit('update:searchOpen', $event)"
+    />
 
     <!-- Banner Notifications -->
     <client-only>
@@ -23,7 +22,7 @@
         group-type="banner"
         @dismiss="$emit('dismiss-notification', $event)"
         @toggle-all="$emit('toggle-all')"
-      ></asd20-notification-group>
+      />
     </client-only>
 
     <!-- Page Header -->
@@ -41,7 +40,7 @@
               :organization-options="organizationOptions"
               :organization="organization"
               logo-size="lg"
-            ></asd20-organization-picker>
+            />
             <a
               v-if="websiteLogoProps"
               :href="websiteLogoProps.logoLink ? websiteLogoProps.logoLink : ''"
@@ -54,7 +53,7 @@
                     : ''
                 "
                 :alt="websiteLogoProps.logoAlt ? websiteLogoProps.logoAlt : ''"
-              />
+              >
             </a>
             <a
               v-if="websiteLogoProps2"
@@ -72,7 +71,7 @@
                 :alt="
                   websiteLogoProps2.logoAlt ? websiteLogoProps2.logoAlt : ''
                 "
-              />
+              >
             </a>
           </div>
         </client-only>
@@ -128,7 +127,7 @@
               group-type="floating"
               @dismiss="$emit('dismiss-notification', $event)"
               @toggle-all="$emit('toggle-all')"
-            ></asd20-notification-group>
+            />
           </client-only>
         </div>
       </template>
@@ -140,30 +139,29 @@
     </asd20-quicklinks-menu>
 
     <!-- Page Content -->
-    <asd20-page-content> </asd20-page-content>
 
     <!-- Feeds -->
     <asd20-feeds-section
       :announcements="announcements"
       :announcements-feed-props="announcementsFeedProps"
-      @announcements-in-view="$emit('announcements-in-view')"
       :stories="stories"
       :stories-feed-props="storiesFeedProps"
-      @stories-in-view="$emit('stories-in-view')"
       :events="events"
       :events-feed-props="eventsFeedProps"
-      @events-in-view="$emit('events-in-view')"
       :organization="organization"
       :organization-options="organizationOptions"
-    ></asd20-feeds-section>
+      @announcements-in-view="$emit('announcements-in-view')"
+      @stories-in-view="$emit('stories-in-view')"
+      @events-in-view="$emit('events-in-view')"
+    />
 
     <!-- Footer -->
     <asd20-page-footer
       :organization="organization"
-      :socialLinks="socialLinks"
-      :disclosureLinks="disclosureLinks"
-      :websiteLogoProps="websiteLogoProps"
-      :websiteLogoProps2="websiteLogoProps2"
+      :social-links="socialLinks"
+      :disclosure-links="disclosureLinks"
+      :website-logo-props="websiteLogoProps"
+      :website-logo-props2="websiteLogoProps2"
     >
       <slot name="page-footer" />
     </asd20-page-footer>
@@ -183,7 +181,7 @@ import Asd20SchoolHomepageVideoHeader from '../../../components/organisms/Asd20S
 import Asd20PageFooter from '../../../components/organisms/Asd20PageFooter'
 import Asd20SiteNavigation from '../../../components/organisms/Asd20SiteNavigation'
 import Asd20QuicklinksMenu from '../../../components/organisms/Asd20QuicklinksMenu'
-import Asd20PageContent from '../../../components/organisms/Asd20PageContent'
+// import Asd20PageContent from '../../../components/organisms/Asd20PageContent'
 import Asd20NotificationGroup from '../../../components/organisms/Asd20NotificationGroup'
 import Asd20FeedsSection from '../../../components/organisms/Asd20FeedsSection'
 import Asd20OrganizationPicker from '../../../components/organisms/Asd20OrganizationPicker'
@@ -191,19 +189,13 @@ import Asd20LanguageTranslation from '../../molecules/Asd20LanguageTranslation'
 import Asd20BlockSchedule from '../../molecules/Asd20BlockSchedule'
 
 // Helpers
-import _get from 'lodash/get'
 
 export default {
   name: 'Asd20SchoolHomeVideoTemplate',
 
-  mixins: [pageTemplateMixin],
-
-  directives: { scrollTrack },
-
   components: {
     Asd20SkipTo,
     Asd20SchoolHomepageVideoHeader,
-    Asd20PageContent,
     Asd20PageFooter,
     Asd20SiteNavigation,
     Asd20QuicklinksMenu,
@@ -213,33 +205,46 @@ export default {
     Asd20LanguageTranslation,
     Asd20BlockSchedule,
   },
+
+  mixins: [pageTemplateMixin],
+
+  directives: { scrollTrack },
   props: {
     languageCode: { type: String, default: 'en' },
   },
-  mounted() {
-    // If nothing is loaded yet, ask parent to load events now.
-    if (!this.events || this.events.length === 0) {
-      this.$emit('events-in-view')
-    }
-  },
-  watch: {
-    // If the organization changes (picker, route change, etc.), refetch.
-    'organization.id': function () {
-      this.$emit('events-in-view')
-    },
-  },
   computed: {
     blockEvent() {
       if (!this.events || this.events.length === 0) return null
+
+      const isSameLocalDay = (a, b) =>
+        a.getFullYear() === b.getFullYear() &&
+        a.getMonth() === b.getMonth() &&
+        a.getDate() === b.getDate()
+
+      const today = new Date()
+
       return (
         this.events.find(
           e =>
             Array.isArray(e.calendarKeywords) &&
-            e.calendarKeywords.includes('Block Schedule')
+            e.calendarKeywords.includes('Block Schedule') &&
+            isSameLocalDay(new Date(e.start), today)
         ) || null
       )
     },
   },
+  watch: {
+    // If the organization changes (picker, route change, etc.), refetch.
+    'organization.id': function () {
+      this.$emit('events-in-view')
+    },
+  },
+  mounted() {
+    // If nothing is loaded yet, ask parent to load events now.
+    if (!this.events || this.events.length === 0) {
+      this.$emit('events-in-view')
+    }
+  },
 }
 </script>
 
@@ -258,7 +263,7 @@ export default {
   flex-direction: column;
   flex-grow: 1;
   flex-shrink: 0;
-  overflow-y: auto;
+  overflow: hidden;
   margin-top: space(2.25);
   .notification-translation-container {
     display: flex;