hr-design-system-handlebars 0.121.9 → 0.121.11

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+# v0.121.11 (Wed Jan 25 2023)
+
+#### 🐛 Bug Fix
+
+- improve accessibility part 2 [#504](https://github.com/mumprod/hr-design-system-handlebars/pull/504) ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 1
+
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
+# v0.121.10 (Tue Jan 24 2023)
+
+#### 🐛 Bug Fix
+
+- moves click.outside to nav element [#502](https://github.com/mumprod/hr-design-system-handlebars/pull/502) ([@StefanVesper](https://github.com/StefanVesper))
+
+#### Authors: 1
+
+- SonicSoulSurfer ([@StefanVesper](https://github.com/StefanVesper))
+
+---
+
 # v0.121.9 (Tue Jan 24 2023)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -2474,7 +2474,7 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 .counter-reset {
-  counter-reset: cnt1674571859735;
+  counter-reset: cnt1674647049712;
 }
 .line-clamp-4 {
   overflow: hidden;
@@ -2692,7 +2692,7 @@ video {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1674571859735 1;
+  counter-increment: cnt1674647049712 1;
 }
 .-ordered::before {
   position: absolute;
@@ -2708,7 +2708,7 @@ video {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1674571859735);
+  content: counter(cnt1674647049712);
 }
 /*! ****************************/
 /*! text-shadow                */

package/dist/views/components/content_nav/content_nav_container.hbs

@@ -6,7 +6,7 @@
     {{#if this.isAutosuggest}}
         <div class="flex mx-0 w-full h-10 border-blue-congress align-center{{#if _autoSuggestContainerCss}} {{_autoSuggestContainerCss}}{{/if}}">
             <input x-ref="autosuggestInput"
-                   class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white ds-link-inset text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
+                   class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
                    type="text"
                    placeholder="Eintrag filtern"/>
         </div>

package/dist/views/components/content_nav/content_nav_dropdown.hbs

@@ -1,7 +1,7 @@
 <nav class="w-full px-5 sm:px-0 {{inline-switch _teaserSize '["100","66","50","33","25"]' '[" teaser-size-100"," teaser-size-66"," teaser-size-50"," teaser-size-33"," teaser-size-25", ""]'}}"
      :class="contentNavDropdownIsOpen ? 'h-10' : ''"
      id="dropdown--{{nextRandom}}"
-    
+     @click.outside ="contentNavDropdownIsOpen = false; $dispatch('hr:global:resetinputAutoSuggest')"
      role="navigation"
      aria-labelledby="dropdown__label--{{getRandom}}">
 
@@ -9,7 +9,7 @@
     <button 
          class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10  mb-0 overflow-hidden bg-white border md:mx-0 z-100 border-content-nav whitespace-nowrap text-content-nav fill-content-nav"
          @click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen;  $dispatch('hr:global:resetinputAutoSuggest');" 
-         @click.outside ="contentNavDropdownIsOpen = false; $dispatch('hr:global:resetinputAutoSuggest')"
+        
          {{#if this.isMixed}}
             @resize.window="if(window.innerWidth > 767){contentNavDropdownIsOpen = false}; $dispatch('hr:global:resetinputAutoSuggest')"
          {{/if}}

package/dist/views/components/teaser/components/teaser_image_overlay.hbs

@@ -1,3 +1,3 @@
-<div class="{{#unless _noOverlayInMobileViewports}}absolute bg-gradient-to-t from-white bg-neutral-200 opacity-80{{else}}relative border-x border-b border-gray-400 md:border-0 md:absolute md:from-white md:bg-neutral-200 md:opacity-80{{/unless}} flex justify-center{{#if _cssClasses}} {{_cssClasses}}{{/if}}" aria-hidden="true">
+<div class="{{#unless _noOverlayInMobileViewports}}absolute bg-gradient-to-t from-white bg-neutral-200 opacity-80{{else}}relative border-x border-b border-gray-400 md:border-0 md:absolute md:from-white md:bg-neutral-200 md:opacity-80{{/unless}} flex justify-center{{#if _cssClasses}} {{_cssClasses}}{{/if}}">
     {{~ decorator_body ~}}  
 </div>

package/dist/views/components/teaser/teaser_poster.hbs

@@ -1,8 +1,8 @@
-<article class="mx-5 sm:mx-0 relative col-span-12 flex gap-y-5 gap-x-4 {{inline-switch this.realTeaserSize '["33","50"]' '["md:col-span-4 flex-col","md:col-span-6 flex-col","flex-col"]'}} ">
+<article class="mx-5 sm:mx-0 relative col-span-12 flex gap-y-5 gap-x-4 {{inline-switch this.teaserSize '["33","50"]' '["md:col-span-4 flex-col","md:col-span-6 flex-col","flex-col"]'}} ">
     <figure class="ar-1-1" aria-hidden="true">
         {{~> components/base/image/responsive_image this.teaserImage _type=this.teaserType _variant=this.content.imageVariant _noDelay=../_noDelay _addClassImg="ar__content rounded-tl-hr rounded-br-hr" ~}}
     </figure> 
-    <div class="absolute flex flex-col justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-hr rounded-br-hr" aria-hidden="true">
+    <div class="absolute flex flex-col justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-hr rounded-br-hr">
         {{#decorator 'components/base/link' _css="ds-teaser-focus flex items-center flex-col before:rounded-tl-hr before:rounded-br-hr hover:text-toplineColor"}} 
             {{> components/teaser/components/teaser_heading 
             _headlineTag="h2" 

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "0.121.9",
+    "version": "0.121.11",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "start-storybook -p 6006 public",

package/src/stories/views/components/content_nav/content_nav_container.hbs

@@ -6,7 +6,7 @@
     {{#if this.isAutosuggest}}
         <div class="flex mx-0 w-full h-10 border-blue-congress align-center{{#if _autoSuggestContainerCss}} {{_autoSuggestContainerCss}}{{/if}}">
             <input x-ref="autosuggestInput"
-                   class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white ds-link-inset text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
+                   class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
                    type="text"
                    placeholder="Eintrag filtern"/>
         </div>

package/src/stories/views/components/content_nav/content_nav_dropdown.hbs

@@ -1,7 +1,7 @@
 <nav class="w-full px-5 sm:px-0 {{inline-switch _teaserSize '["100","66","50","33","25"]' '[" teaser-size-100"," teaser-size-66"," teaser-size-50"," teaser-size-33"," teaser-size-25", ""]'}}"
      :class="contentNavDropdownIsOpen ? 'h-10' : ''"
      id="dropdown--{{nextRandom}}"
-    
+     @click.outside ="contentNavDropdownIsOpen = false; $dispatch('hr:global:resetinputAutoSuggest')"
      role="navigation"
      aria-labelledby="dropdown__label--{{getRandom}}">
 
@@ -9,7 +9,7 @@
     <button 
          class="content-nav-dropdown_dropdown{{#if this.isDropdown}} -isDropdown{{/if}}{{#if this.isMixed}} -isMixed{{/if}} ds-link-inset relative flex w-full h-10  mb-0 overflow-hidden bg-white border md:mx-0 z-100 border-content-nav whitespace-nowrap text-content-nav fill-content-nav"
          @click="contentNavDropdownIsOpen = !contentNavDropdownIsOpen;  $dispatch('hr:global:resetinputAutoSuggest');" 
-         @click.outside ="contentNavDropdownIsOpen = false; $dispatch('hr:global:resetinputAutoSuggest')"
+        
          {{#if this.isMixed}}
             @resize.window="if(window.innerWidth > 767){contentNavDropdownIsOpen = false}; $dispatch('hr:global:resetinputAutoSuggest')"
          {{/if}}

package/src/stories/views/components/teaser/components/teaser_image_overlay.hbs

@@ -1,3 +1,3 @@
-<div class="{{#unless _noOverlayInMobileViewports}}absolute bg-gradient-to-t from-white bg-neutral-200 opacity-80{{else}}relative border-x border-b border-gray-400 md:border-0 md:absolute md:from-white md:bg-neutral-200 md:opacity-80{{/unless}} flex justify-center{{#if _cssClasses}} {{_cssClasses}}{{/if}}" aria-hidden="true">
+<div class="{{#unless _noOverlayInMobileViewports}}absolute bg-gradient-to-t from-white bg-neutral-200 opacity-80{{else}}relative border-x border-b border-gray-400 md:border-0 md:absolute md:from-white md:bg-neutral-200 md:opacity-80{{/unless}} flex justify-center{{#if _cssClasses}} {{_cssClasses}}{{/if}}">
     {{~ decorator_body ~}}  
 </div>

package/src/stories/views/components/teaser/teaser_poster.hbs

@@ -1,8 +1,8 @@
-<article class="mx-5 sm:mx-0 relative col-span-12 flex gap-y-5 gap-x-4 {{inline-switch this.realTeaserSize '["33","50"]' '["md:col-span-4 flex-col","md:col-span-6 flex-col","flex-col"]'}} ">
+<article class="mx-5 sm:mx-0 relative col-span-12 flex gap-y-5 gap-x-4 {{inline-switch this.teaserSize '["33","50"]' '["md:col-span-4 flex-col","md:col-span-6 flex-col","flex-col"]'}} ">
     <figure class="ar-1-1" aria-hidden="true">
         {{~> components/base/image/responsive_image this.teaserImage _type=this.teaserType _variant=this.content.imageVariant _noDelay=../_noDelay _addClassImg="ar__content rounded-tl-hr rounded-br-hr" ~}}
     </figure> 
-    <div class="absolute flex flex-col justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-hr rounded-br-hr" aria-hidden="true">
+    <div class="absolute flex flex-col justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-hr rounded-br-hr">
         {{#decorator 'components/base/link' _css="ds-teaser-focus flex items-center flex-col before:rounded-tl-hr before:rounded-br-hr hover:text-toplineColor"}} 
             {{> components/teaser/components/teaser_heading 
             _headlineTag="h2"