hr-design-system-handlebars 1.114.85 → 1.114.87

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/dist/assets/brand/hessenschau/conf/locatags.merged.json +3 -1
  3. package/dist/assets/brand/hr/conf/locatags.merged.json +3 -1
  4. package/dist/assets/brand/hr-bigband/conf/locatags.merged.json +3 -1
  5. package/dist/assets/brand/hr-fernsehen/conf/locatags.merged.json +3 -1
  6. package/dist/assets/brand/hr-inforadio/conf/locatags.merged.json +3 -1
  7. package/dist/assets/brand/hr-rundfunkrat/conf/locatags.merged.json +3 -1
  8. package/dist/assets/brand/hr-sinfonieorchester/conf/locatags.merged.json +3 -1
  9. package/dist/assets/brand/hr-werbung/conf/locatags.merged.json +3 -1
  10. package/dist/assets/brand/hr1/conf/locatags.merged.json +3 -1
  11. package/dist/assets/brand/hr2/conf/locatags.merged.json +5 -3
  12. package/dist/assets/brand/hr3/conf/locatags.merged.json +5 -3
  13. package/dist/assets/brand/hr4/conf/locatags.merged.json +3 -1
  14. package/dist/assets/brand/you-fm/conf/locatags.merged.json +3 -1
  15. package/dist/assets/index.css +11 -9
  16. package/dist/assets/js/components/newsletter/js/newsletterForm.alpine.js +13 -7
  17. package/dist/views/components/content/copytext/components/newsletter.hbs +1 -1
  18. package/dist/views/components/content/copytext/copytext_body.hbs +1 -1
  19. package/dist/views/components/newsletter/components/new_newsletter_form.hbs +40 -69
  20. package/dist/{views_static/components/newsletter/components/controls_no_alpine.hbs → views/components/newsletter/components/newsletter_controls.hbs} +1 -1
  21. package/dist/views/components/newsletter/components/newsletter_fields.hbs +44 -0
  22. package/dist/views/components/newsletter/components/newsletter_form.hbs +24 -56
  23. package/dist/views/components/newsletter/components/newsletter_result.hbs +31 -15
  24. package/dist/views/components/newsletter/components/newsletter_success.hbs +1 -0
  25. package/dist/views/components/newsletter/newsletter.hbs +4 -23
  26. package/dist/views_static/components/content/copytext/components/newsletter.hbs +1 -1
  27. package/dist/views_static/components/content/copytext/copytext_body.hbs +1 -1
  28. package/dist/views_static/components/newsletter/components/new_newsletter_form.hbs +40 -69
  29. package/dist/{views/components/newsletter/components/controls_no_alpine.hbs → views_static/components/newsletter/components/newsletter_controls.hbs} +1 -1
  30. package/dist/views_static/components/newsletter/components/newsletter_fields.hbs +44 -0
  31. package/dist/views_static/components/newsletter/components/newsletter_form.hbs +24 -56
  32. package/dist/views_static/components/newsletter/components/newsletter_result.hbs +31 -15
  33. package/dist/views_static/components/newsletter/components/newsletter_success.hbs +1 -0
  34. package/dist/views_static/components/newsletter/newsletter.hbs +4 -23
  35. package/package.json +1 -1
  36. package/src/assets/brand/_default/conf/locatags.json +3 -1
  37. package/src/assets/brand/hessenschau/conf/locatags.merged.json +3 -1
  38. package/src/assets/brand/hr/conf/locatags.merged.json +3 -1
  39. package/src/assets/brand/hr-bigband/conf/locatags.merged.json +3 -1
  40. package/src/assets/brand/hr-fernsehen/conf/locatags.merged.json +3 -1
  41. package/src/assets/brand/hr-inforadio/conf/locatags.merged.json +3 -1
  42. package/src/assets/brand/hr-rundfunkrat/conf/locatags.merged.json +3 -1
  43. package/src/assets/brand/hr-sinfonieorchester/conf/locatags.merged.json +3 -1
  44. package/src/assets/brand/hr-werbung/conf/locatags.merged.json +3 -1
  45. package/src/assets/brand/hr1/conf/locatags.merged.json +3 -1
  46. package/src/assets/brand/hr2/conf/locatags.merged.json +5 -3
  47. package/src/assets/brand/hr3/conf/locatags.merged.json +5 -3
  48. package/src/assets/brand/hr4/conf/locatags.merged.json +3 -1
  49. package/src/assets/brand/you-fm/conf/locatags.merged.json +3 -1
  50. package/src/assets/tailwind.css +8 -6
  51. package/src/stories/views/components/content/copytext/components/newsletter.hbs +1 -1
  52. package/src/stories/views/components/content/copytext/copytext-newsletter.stories.js +97 -0
  53. package/src/stories/views/components/content/copytext/copytext.stories.js +0 -2
  54. package/src/stories/views/components/content/copytext/copytext_body.hbs +1 -1
  55. package/src/stories/views/components/content/copytext/fixtures/copytext_newsletter.json +18 -0
  56. package/src/stories/views/components/newsletter/components/new_newsletter_form.hbs +40 -69
  57. package/src/stories/views/components/newsletter/components/{controls_no_alpine.hbs → newsletter_controls.hbs} +1 -1
  58. package/src/stories/views/components/newsletter/components/newsletter_fields.hbs +44 -0
  59. package/src/stories/views/components/newsletter/components/newsletter_form.hbs +24 -56
  60. package/src/stories/views/components/newsletter/components/newsletter_result.hbs +31 -15
  61. package/src/stories/views/components/newsletter/components/newsletter_success.hbs +1 -0
  62. package/src/stories/views/components/newsletter/fixtures/new_newsletter.json +4 -8
  63. package/src/stories/views/components/newsletter/js/newsletterForm.alpine.js +13 -7
  64. package/src/stories/views/components/newsletter/newsletter.hbs +4 -23
  65. package/src/stories/views/components/newsletter/newsletter.stories.js +5 -16
  66. package/dist/assets/js/components/newsletter/js/newNewsletterDs.feature.js +0 -88
  67. package/dist/assets/js/components/newsletter/js/newsletterDs.feature.js +0 -22
  68. package/dist/views/components/newsletter/newsletter_registered.hbs +0 -0
  69. package/dist/views/components/newsletter/newsletter_success.hbs +0 -0
  70. package/dist/views_static/components/newsletter/newsletter_registered.hbs +0 -0
  71. package/dist/views_static/components/newsletter/newsletter_success.hbs +0 -0
  72. package/src/stories/views/components/newsletter/fixtures/newsletter.json +0 -15
  73. package/src/stories/views/components/newsletter/js/newNewsletterDs.feature.js +0 -88
  74. package/src/stories/views/components/newsletter/js/newsletterDs.feature.js +0 -22
  75. package/src/stories/views/components/newsletter/newsletter_registered.hbs +0 -0
  76. package/src/stories/views/components/newsletter/newsletter_success.hbs +0 -0
@@ -0,0 +1,44 @@
1
+ {{#if this.description}}
2
+ <p class="mb-6 text-base font-copy sm:text-lg dark:text-text-dark">
3
+ {{{this.description}}}
4
+ </p>
5
+ {{/if}}
6
+ {{~> components/forms/components/input
7
+ _type="email"
8
+ _isEmail=true
9
+ _name="email"
10
+ _label="E-Mail"
11
+ _labelClass=""
12
+ _description=""
13
+ _required=true
14
+ _maxLength="140"
15
+ _errorMandatory="Bitte füllen Sie dieses Pflichtfeld aus"
16
+ _errorEmail="Bitte geben Sie eine gültige E-Mail-Adresse ein."
17
+ _formId=../_formId
18
+ }}
19
+
20
+ {{~> components/forms/components/choice
21
+ _inGroup=false
22
+ _type="checkbox"
23
+ _name="checkbox"
24
+ _label=(loca "accept_data_privacy_regulation_link")
25
+ _description=""
26
+ _required=true
27
+ _errorMandatory="Bitte wählen Sie dieses Pflichtfeld aus"
28
+ }}
29
+
30
+ {{~> components/forms/components/input
31
+ _name="newsletter"
32
+ _type="hidden"
33
+ _value=this.mailingList
34
+ _wrapperClass="hidden"
35
+ _hasLabel=false
36
+ }}
37
+
38
+ {{~>components/forms/components/input
39
+ _name="newsletter-type"
40
+ _type="hidden"
41
+ _wrapperClass="hidden"
42
+ _value="html"
43
+ _hasLabel=false
44
+ }}
@@ -1,63 +1,31 @@
1
1
  <div id="formWrapper" class="mt-4">
2
- <form class="relative flex flex-col justify-center overflow-hidden group js-form" id="form{{nextRandom}}" x-ref="form{{getRandom}}" ax-load="" x-data="" x-init="" @submit.prevent=""
3
- action="{{configProperty "mailserver.newsletter"}}" method="post" enctype="application/x-www-form-urlencoded"
4
- accept-charset="utf-8">
5
2
 
6
- {{~> components/forms/components/input
7
- _type="email"
8
- _isEmail="true"
9
- _name="email"
10
- _label="E-Mail"
11
- _labelClass=""
12
- _description=""
13
- _required="true"
14
- _maxLength="140"
15
- _errorMandatory="Bitte füllen Sie dieses Pflichtfeld aus"
16
- _errorEmail="Bitte geben Sie eine gültige E-Mail-Adresse ein."
17
- _formId=../_formId
18
- }}
3
+ <form class="relative flex flex-col justify-center overflow-hidden group js-form"
4
+ id="form{{nextRandom}}"
5
+ x-ref="form{{getRandom}}"
6
+ ax-load
7
+ x-data="newsletterForm('form{{getRandom}}','{{this.trackingInformations}}')"
8
+ x-init="formInit()"
9
+ x-ignore
10
+ @submit.prevent
11
+ action="{{~#if (isStorybook)~}}{{this.jsonURL}}{{else}}{{configProperty "mailserver.newsletter"}}{{/if}}"
12
+ method="post"
13
+ enctype="application/x-www-form-urlencoded"
14
+ accept-charset="utf-8"
15
+ >
19
16
 
20
- {{> components/forms/components/choiceGroup
21
- _name="Registrierung"
22
- _required=true
23
- _inputClass=""
24
- _type="radio"
25
- _locaKey="newsletter_subscribe_text"
26
- _inGroup=true
27
- _isHorizontalLayout=true
28
- _multipleChoice=false
29
- _formId=../_formId
30
- _items=this.items
31
- }}
17
+ <div x-show="!wasPosted"
18
+ x-transition:enter="transition ease-out duration-300 delay-300"
19
+ x-transition:enter-start="opacity-0 transform scale-90"
20
+ x-transition:enter-end="opacity-100 transform scale-100"
21
+ x-transition:leave="transition ease-in duration-75 delay-0"
22
+ x-transition:leave-start="opacity-100 transform scale-100"
23
+ x-transition:leave-end="opacity-0 transform scale-90"
24
+ >
25
+ {{> components/newsletter/components/newsletter_old_fields }}
32
26
 
27
+ {{> components/newsletter/components/newsletter_controls }}
28
+ </div>
33
29
 
34
- {{~> components/forms/components/controls}}
35
-
36
- {{~> components/forms/components/input
37
- _formField=this.formData.INXMAIL_HTTP_REDIRECT
38
- _name="INXMAIL_HTTP_REDIRECT"
39
- _type="hidden"
40
- _wrapperClass="hidden"
41
- _value=this.successLink
42
- _hasLabel=false
43
- }}
44
-
45
- {{~>components/forms/components/input
46
- _formField=this.formData.INXMAIL_HTTP_REDIRECT_ERROR
47
- _name="INXMAIL_HTTP_REDIRECT_ERROR"
48
- _type="hidden"
49
- _wrapperClass="hidden"
50
- _value=this.errorLink
51
- _hasLabel=false
52
- }}
53
-
54
- {{~> components/forms/components/input
55
- _formField=this.formData.backlink
56
- _name="backlink"
57
- _type="hidden"
58
- _wrapperClass="hidden"
59
- _value=this.backlinkUuid
60
- _hasLabel=false
61
- }}
62
30
  </form>
63
31
  </div>
@@ -1,15 +1,31 @@
1
- <div class="c-feedbackBox">
2
- <h2 class="c-feedbackBox__headline">{{loca _locaKeyTitle}}</h2>
3
- <p class="c-feedbackBox__button">
4
- {{#with this.backlink}}
5
- <a class="c-form__button js-formReload" href="{{this}}#{{../uuid}}">{{loca "newsletter_form_back"}}</a>
6
- {{/with}}
7
- </p>
8
- <p class="c-feedbackBox__text">
9
- {{#if _locaKeyText}}
10
- {{loca _locaKeyText}}
11
- {{else}}
12
- {{{_text}}}
13
- {{/if}}
14
- </p>
15
- </div>
1
+ <div class="flex flex-col justify-between w-full gap-6 md:gap-10">
2
+ <div class="flex items-center gap-x-2 md:gap-x-3">
3
+ {{#if _success}}
4
+ {{> components/forms/components/success_icon}}
5
+ <h3 class="font-bold text-success pt-0.5">{{~loca "newsletter_title_success"}}</h3>
6
+ {{else}}
7
+ {{#if _alreadyRegistered}}
8
+ {{> components/forms/components/error_icon _class="!block"}}
9
+ <h3 class="font-bold text-error dark:text-error-dark pt-0.5">{{~loca "newsletter_title_already_registered"}}</h3>
10
+ {{else}}
11
+ {{> components/forms/components/error_icon _class="!block"}}
12
+ <h3 class="font-bold text-error dark:text-error-dark pt-0.5">{{~loca "newsletter_title_error"}}</h3>
13
+ {{/if}}
14
+ {{/if}}
15
+ </div>
16
+ </div>
17
+ <span class="font-copy text-text dark:text-text-dark">
18
+ {{#if _locaKeyText}}
19
+ {{loca _locaKeyText}}
20
+ {{else}}
21
+ {{{_text}}}
22
+ {{/if}}
23
+ </span>
24
+ <div class="flex justify-end">
25
+ {{#> components/button/button _variant="primary" _size="lg" }}
26
+ <span class="text-base ds-button-label ">{{loca "newsletter_form_back"}}</span>
27
+ {{/components/button/button}}
28
+ {{#*inline "htmlProperties"}}
29
+ @click="retryHandler"
30
+ {{/inline}}
31
+ </div>
@@ -2,6 +2,7 @@
2
2
  {{> components/newsletter/components/newsletter_result
3
3
  _locaKeyTitle="newsletter_title_success"
4
4
  _text=this.successText.richtext
5
+ _success=_success
5
6
  }}
6
7
  {{else}}
7
8
  {{> components/newsletter/components/newsletter_result
@@ -1,24 +1,5 @@
1
- {{#if this.useNewNewsletter}}
2
- <div id="{{this.uuid}}" class="relative bg-highlight-1 dark:bg-highlight-1-dark sm:rounded-tl-hr sm:rounded-br-hr px-5 sm:px-13 pb-8 pt-6 sm:pt-12 mt-7 sm:mt-12 mb-5 article-full-width sm:article-narrow {{_addClass}}">
3
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_intro_sr" ~}}
4
- <h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
5
- {{this.title}}
6
- </h3>
7
- {{#if this.description}}
8
- <p class="mt-4 text-base font-copy sm:text-lg sm:mt-5 dark:text-text-dark">
9
- {{{this.description}}}
10
- </p>
11
- {{/if}}
1
+ <div id="{{this.uuid}}" class="relative bg-highlight-1 dark:bg-highlight-1-dark sm:rounded-tl-hr sm:rounded-br-hr px-5 sm:px-13 pb-8 pt-6 sm:pt-12 mt-7 sm:mt-12 mb-5 article-full-width sm:article-narrow {{_addClass}}">
2
+ {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_intro_sr" ~}}
12
3
  {{> components/newsletter/components/new_newsletter_form}}
13
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_outro_sr" ~}}
14
- </div>
15
- {{else}}
16
- <div id="{{this.uuid}}" class="js-load relative bg-highlight-1 dark:bg-highlight-1-dark sm:rounded-tl-hr sm:rounded-br-hr px-5 sm:px-13 pb-8 pt-6 sm:pt-12 mt-7 sm:mt-12 mb-5 article-full-width sm:article-narrow {{_addClass}}" data-hr-newsletter-ds='{"url": "{{this.url.nocache}}"}'>
17
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_intro_sr" ~}}
18
- <h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
19
- {{this.title}}
20
- </h3>
21
- {{> components/newsletter/components/newsletter_form}}
22
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_outro_sr" ~}}
23
- </div>
24
- {{/if}}
4
+ {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_outro_sr" ~}}
5
+ </div>
@@ -1,5 +1,5 @@
1
1
  {{~#if (isStorybook)~}}
2
2
  <div class="mt-6 italic text-gray-dark">coming soon: Newsletter-component</div>
3
3
  {{~else~}}
4
- {{> modules/newsletter/newsletter _addClass="print:hidden copytext__clearBox marginTrailer--m"}}
4
+ {{> components/newsletter/newsletter _addClass="print:hidden copytext__clearBox marginTrailer--m"}}
5
5
  {{~/if~}}
@@ -25,7 +25,7 @@
25
25
  {{> components/forms/webform _newWebForm=this.hasNewWebForm}}
26
26
  {{/if~}}
27
27
  {{~#if this.isNewsletter}}
28
- {{> components/content/copytext/components/newsletter }}
28
+ {{> components/newsletter/newsletter }}
29
29
  {{/if~}}
30
30
  {{~#if this.isAudioOnDemand}}
31
31
  {{> components/content/copytext/components/audio _isTickerCopytext=../_isTickerCopytext }}
@@ -1,4 +1,7 @@
1
- <div id="formWrapper" class="mt-4">
1
+ <h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
2
+ {{this.title}}
3
+ </h3>
4
+ <div id="formWrapper">
2
5
  <form class="relative flex flex-col justify-center overflow-hidden group"
3
6
  id="form{{nextRandom}}"
4
7
  x-ref="form{{getRandom}}"
@@ -7,78 +10,46 @@
7
10
  x-init="formInit()"
8
11
  x-ignore
9
12
  @submit.prevent
10
- action="index.html"
13
+ action="{{~#if (isStorybook)~}}{{this.jsonURL}}{{else}}{{configProperty "newsletter.subscription.endpoint"}}{{/if}}"
11
14
  method="post"
12
15
  accept-charset="utf-8"
13
16
  >
17
+ <div x-show="!wasPosted"
18
+ x-transition:enter="transition ease-out duration-300 delay-300"
19
+ x-transition:enter-start="opacity-0 transform scale-90"
20
+ x-transition:enter-end="opacity-100 transform scale-100"
21
+ x-transition:leave="transition ease-in duration-75 delay-0"
22
+ x-transition:leave-start="opacity-100 transform scale-100"
23
+ x-transition:leave-end="opacity-0 transform scale-90"
24
+ >
25
+ {{> components/newsletter/components/newsletter_fields }}
14
26
 
15
- {{~> components/forms/components/input
16
- _type="email"
17
- _isEmail=true
18
- _name="email"
19
- _label="E-Mail"
20
- _labelClass=""
21
- _description=""
22
- _required=true
23
- _maxLength="140"
24
- _errorMandatory="Bitte füllen Sie dieses Pflichtfeld aus"
25
- _errorEmail="Bitte geben Sie eine gültige E-Mail-Adresse ein."
26
- _formId=../_formId
27
- }}
28
-
29
- {{~> components/forms/components/choice
30
- _inGroup=false
31
- _type="checkbox"
32
- _name="checkbox"
33
- _label=(loca "accept_data_privacy_regulation_link")
34
- _description=""
35
- _required=true
36
- _errorMandatory="Bitte wählen Sie dieses Pflichtfeld aus"
37
- }}
38
-
27
+ {{> components/newsletter/components/newsletter_controls }}
28
+ </div>
39
29
 
40
- {{~> components/forms/components/controls}}
41
-
42
-
43
- {{~> components/forms/components/input
44
- _name="newsletter"
45
- _type="hidden"
46
- _value=this.mailingList
47
- _wrapperClass="hidden"
48
- _hasLabel=false
49
- }}
50
-
51
- {{~>components/forms/components/input
52
- _name="newsletter-type"
53
- _type="hidden"
54
- _wrapperClass="hidden"
55
- _value="html"
56
- _hasLabel=false
57
- }}
58
-
59
- <div class="flex flex-col gap-6 js-successMessage md:gap-10" id="successMessage" x-show="wasPostedWithSuccess"
60
- x-transition:enter="transition ease-out duration-300 delay-75"
61
- x-transition:enter-start="opacity-0 transform scale-90"
62
- x-transition:enter-end="opacity-100 transform scale-100"
63
- x-cloak
64
- >
65
- {{{include "components/newsletter/components/newsletter_success" }}}
66
- </div>
67
- <div class="flex flex-col gap-6 js-errorMessage md:gap-10" id="errorMessage" x-show="wasPostedWithError"
68
- x-transition:enter="transition ease-out duration-300 delay-75"
69
- x-transition:enter-start="opacity-0 transform scale-90"
70
- x-transition:enter-end="opacity-100 transform scale-100"
71
- x-cloak
72
- >
73
- {{{include "components/newsletter/components/newsletter_error" }}}
74
- </div>
75
- <div class="flex flex-col gap-6 js-alreadyRegisteredMessage md:gap-10" id="alreadyRegisteredMessage" x-show="wasPostedAlreadyRegistered"
76
- x-transition:enter="transition ease-out duration-300 delay-75"
77
- x-transition:enter-start="opacity-0 transform scale-90"
78
- x-transition:enter-end="opacity-100 transform scale-100"
79
- x-cloak
80
- >
81
- {{{include "components/newsletter/components/newsletter_already_registered" }}}
82
- </div>
30
+ <div class="flex flex-col gap-6 js-successMessage md:gap-10" id="successMessage" x-show="wasPostedWithSuccess"
31
+ x-transition:enter="transition ease-out duration-300 delay-75"
32
+ x-transition:enter-start="opacity-0 transform scale-90"
33
+ x-transition:enter-end="opacity-100 transform scale-100"
34
+ x-cloak
35
+ >
36
+ {{{include "components/newsletter/components/newsletter_success" _success="true" _locaKeyText="newsletter_text_success"}}}
37
+ </div>
38
+ <div class="flex flex-col gap-6 js-errorMessage md:gap-10" id="errorMessage" x-show="wasPostedWithError"
39
+ x-transition:enter="transition ease-out duration-300 delay-75"
40
+ x-transition:enter-start="opacity-0 transform scale-90"
41
+ x-transition:enter-end="opacity-100 transform scale-100"
42
+ x-cloak
43
+ >
44
+ {{{include "components/newsletter/components/newsletter_error" _locaKeyText="newsletter_text_error"}}}
45
+ </div>
46
+ <div class="flex flex-col gap-6 js-alreadyRegisteredMessage md:gap-10" id="alreadyRegisteredMessage" x-show="wasPostedAlreadyRegistered"
47
+ x-transition:enter="transition ease-out duration-300 delay-75"
48
+ x-transition:enter-start="opacity-0 transform scale-90"
49
+ x-transition:enter-end="opacity-100 transform scale-100"
50
+ x-cloak
51
+ >
52
+ {{{include "components/newsletter/components/newsletter_already_registered" _alreadyRegistered="true" _locaKeyText="newsletter_text_already_registered" }}}
53
+ </div>
83
54
  </form>
84
55
  </div>
@@ -4,7 +4,7 @@
4
4
  <label class="order-2 cursor-pointer {{> components/button/utilities/button_base_classes}} {{> components/button/utilities/button_variation_classes _variant='primary'}} {{> components/button/utilities/button_dimension_classes _size='lg'}}">
5
5
  <span class="hidden" :class="{'hidden': !isPosting}">{{> components/base/image/icon _icon="reload" _addClass="w-5 h-5 fill-white dark:fill-text-dark animate-spin"}}</span>
6
6
  <span class="" :class="{'hidden': isPosting}">{{> components/base/image/icon _icon="send-ds" _addClass="w-5 h-5 fill-white dark:fill-text-dark "}}</span>
7
- <input type="submit" class="pl-2 cursor-pointer" value="{{loca "form_button_submit"}}" @click.prevent=""/>
7
+ <input type="submit" class="pl-2 cursor-pointer" value="{{loca "form_button_submit"}}" @click.prevent="submitButtonHandler($event)"/>
8
8
  </label>
9
9
 
10
10
  {{#> components/button/button _variant="tertiary"_size="lg" _css="order-1 mr-4" _type="reset"}}
@@ -0,0 +1,44 @@
1
+ {{#if this.description}}
2
+ <p class="mb-6 text-base font-copy sm:text-lg dark:text-text-dark">
3
+ {{{this.description}}}
4
+ </p>
5
+ {{/if}}
6
+ {{~> components/forms/components/input
7
+ _type="email"
8
+ _isEmail=true
9
+ _name="email"
10
+ _label="E-Mail"
11
+ _labelClass=""
12
+ _description=""
13
+ _required=true
14
+ _maxLength="140"
15
+ _errorMandatory="Bitte füllen Sie dieses Pflichtfeld aus"
16
+ _errorEmail="Bitte geben Sie eine gültige E-Mail-Adresse ein."
17
+ _formId=../_formId
18
+ }}
19
+
20
+ {{~> components/forms/components/choice
21
+ _inGroup=false
22
+ _type="checkbox"
23
+ _name="checkbox"
24
+ _label=(loca "accept_data_privacy_regulation_link")
25
+ _description=""
26
+ _required=true
27
+ _errorMandatory="Bitte wählen Sie dieses Pflichtfeld aus"
28
+ }}
29
+
30
+ {{~> components/forms/components/input
31
+ _name="newsletter"
32
+ _type="hidden"
33
+ _value=this.mailingList
34
+ _wrapperClass="hidden"
35
+ _hasLabel=false
36
+ }}
37
+
38
+ {{~>components/forms/components/input
39
+ _name="newsletter-type"
40
+ _type="hidden"
41
+ _wrapperClass="hidden"
42
+ _value="html"
43
+ _hasLabel=false
44
+ }}
@@ -1,63 +1,31 @@
1
1
  <div id="formWrapper" class="mt-4">
2
- <form class="relative flex flex-col justify-center overflow-hidden group js-form" id="form{{nextRandom}}" x-ref="form{{getRandom}}" ax-load="" x-data="" x-init="" @submit.prevent=""
3
- action="{{configProperty "mailserver.newsletter"}}" method="post" enctype="application/x-www-form-urlencoded"
4
- accept-charset="utf-8">
5
2
 
6
- {{~> components/forms/components/input
7
- _type="email"
8
- _isEmail="true"
9
- _name="email"
10
- _label="E-Mail"
11
- _labelClass=""
12
- _description=""
13
- _required="true"
14
- _maxLength="140"
15
- _errorMandatory="Bitte füllen Sie dieses Pflichtfeld aus"
16
- _errorEmail="Bitte geben Sie eine gültige E-Mail-Adresse ein."
17
- _formId=../_formId
18
- }}
3
+ <form class="relative flex flex-col justify-center overflow-hidden group js-form"
4
+ id="form{{nextRandom}}"
5
+ x-ref="form{{getRandom}}"
6
+ ax-load
7
+ x-data="newsletterForm('form{{getRandom}}','{{this.trackingInformations}}')"
8
+ x-init="formInit()"
9
+ x-ignore
10
+ @submit.prevent
11
+ action="{{~#if (isStorybook)~}}{{this.jsonURL}}{{else}}{{configProperty "mailserver.newsletter"}}{{/if}}"
12
+ method="post"
13
+ enctype="application/x-www-form-urlencoded"
14
+ accept-charset="utf-8"
15
+ >
19
16
 
20
- {{> components/forms/components/choiceGroup
21
- _name="Registrierung"
22
- _required=true
23
- _inputClass=""
24
- _type="radio"
25
- _locaKey="newsletter_subscribe_text"
26
- _inGroup=true
27
- _isHorizontalLayout=true
28
- _multipleChoice=false
29
- _formId=../_formId
30
- _items=this.items
31
- }}
17
+ <div x-show="!wasPosted"
18
+ x-transition:enter="transition ease-out duration-300 delay-300"
19
+ x-transition:enter-start="opacity-0 transform scale-90"
20
+ x-transition:enter-end="opacity-100 transform scale-100"
21
+ x-transition:leave="transition ease-in duration-75 delay-0"
22
+ x-transition:leave-start="opacity-100 transform scale-100"
23
+ x-transition:leave-end="opacity-0 transform scale-90"
24
+ >
25
+ {{> components/newsletter/components/newsletter_old_fields }}
32
26
 
27
+ {{> components/newsletter/components/newsletter_controls }}
28
+ </div>
33
29
 
34
- {{~> components/forms/components/controls}}
35
-
36
- {{~> components/forms/components/input
37
- _formField=this.formData.INXMAIL_HTTP_REDIRECT
38
- _name="INXMAIL_HTTP_REDIRECT"
39
- _type="hidden"
40
- _wrapperClass="hidden"
41
- _value=this.successLink
42
- _hasLabel=false
43
- }}
44
-
45
- {{~>components/forms/components/input
46
- _formField=this.formData.INXMAIL_HTTP_REDIRECT_ERROR
47
- _name="INXMAIL_HTTP_REDIRECT_ERROR"
48
- _type="hidden"
49
- _wrapperClass="hidden"
50
- _value=this.errorLink
51
- _hasLabel=false
52
- }}
53
-
54
- {{~> components/forms/components/input
55
- _formField=this.formData.backlink
56
- _name="backlink"
57
- _type="hidden"
58
- _wrapperClass="hidden"
59
- _value=this.backlinkUuid
60
- _hasLabel=false
61
- }}
62
30
  </form>
63
31
  </div>
@@ -1,15 +1,31 @@
1
- <div class="c-feedbackBox">
2
- <h2 class="c-feedbackBox__headline">{{loca _locaKeyTitle}}</h2>
3
- <p class="c-feedbackBox__button">
4
- {{#with this.backlink}}
5
- <a class="c-form__button js-formReload" href="{{this}}#{{../uuid}}">{{loca "newsletter_form_back"}}</a>
6
- {{/with}}
7
- </p>
8
- <p class="c-feedbackBox__text">
9
- {{#if _locaKeyText}}
10
- {{loca _locaKeyText}}
11
- {{else}}
12
- {{{_text}}}
13
- {{/if}}
14
- </p>
15
- </div>
1
+ <div class="flex flex-col justify-between w-full gap-6 md:gap-10">
2
+ <div class="flex items-center gap-x-2 md:gap-x-3">
3
+ {{#if _success}}
4
+ {{> components/forms/components/success_icon}}
5
+ <h3 class="font-bold text-success pt-0.5">{{~loca "newsletter_title_success"}}</h3>
6
+ {{else}}
7
+ {{#if _alreadyRegistered}}
8
+ {{> components/forms/components/error_icon _class="!block"}}
9
+ <h3 class="font-bold text-error dark:text-error-dark pt-0.5">{{~loca "newsletter_title_already_registered"}}</h3>
10
+ {{else}}
11
+ {{> components/forms/components/error_icon _class="!block"}}
12
+ <h3 class="font-bold text-error dark:text-error-dark pt-0.5">{{~loca "newsletter_title_error"}}</h3>
13
+ {{/if}}
14
+ {{/if}}
15
+ </div>
16
+ </div>
17
+ <span class="font-copy text-text dark:text-text-dark">
18
+ {{#if _locaKeyText}}
19
+ {{loca _locaKeyText}}
20
+ {{else}}
21
+ {{{_text}}}
22
+ {{/if}}
23
+ </span>
24
+ <div class="flex justify-end">
25
+ {{#> components/button/button _variant="primary" _size="lg" }}
26
+ <span class="text-base ds-button-label ">{{loca "newsletter_form_back"}}</span>
27
+ {{/components/button/button}}
28
+ {{#*inline "htmlProperties"}}
29
+ @click="retryHandler"
30
+ {{/inline}}
31
+ </div>
@@ -2,6 +2,7 @@
2
2
  {{> components/newsletter/components/newsletter_result
3
3
  _locaKeyTitle="newsletter_title_success"
4
4
  _text=this.successText.richtext
5
+ _success=_success
5
6
  }}
6
7
  {{else}}
7
8
  {{> components/newsletter/components/newsletter_result
@@ -1,24 +1,5 @@
1
- {{#if this.useNewNewsletter}}
2
- <div id="{{this.uuid}}" class="relative bg-highlight-1 dark:bg-highlight-1-dark sm:rounded-tl-hr sm:rounded-br-hr px-5 sm:px-13 pb-8 pt-6 sm:pt-12 mt-7 sm:mt-12 mb-5 article-full-width sm:article-narrow {{_addClass}}">
3
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_intro_sr" ~}}
4
- <h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
5
- {{this.title}}
6
- </h3>
7
- {{#if this.description}}
8
- <p class="mt-4 text-base font-copy sm:text-lg sm:mt-5 dark:text-text-dark">
9
- {{{this.description}}}
10
- </p>
11
- {{/if}}
1
+ <div id="{{this.uuid}}" class="relative bg-highlight-1 dark:bg-highlight-1-dark sm:rounded-tl-hr sm:rounded-br-hr px-5 sm:px-13 pb-8 pt-6 sm:pt-12 mt-7 sm:mt-12 mb-5 article-full-width sm:article-narrow {{_addClass}}">
2
+ {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_intro_sr" ~}}
12
3
  {{> components/newsletter/components/new_newsletter_form}}
13
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_outro_sr" ~}}
14
- </div>
15
- {{else}}
16
- <div id="{{this.uuid}}" class="js-load relative bg-highlight-1 dark:bg-highlight-1-dark sm:rounded-tl-hr sm:rounded-br-hr px-5 sm:px-13 pb-8 pt-6 sm:pt-12 mt-7 sm:mt-12 mb-5 article-full-width sm:article-narrow {{_addClass}}" data-hr-newsletter-ds='{"url": "{{this.url.nocache}}"}'>
17
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_intro_sr" ~}}
18
- <h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
19
- {{this.title}}
20
- </h3>
21
- {{> components/newsletter/components/newsletter_form}}
22
- {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_outro_sr" ~}}
23
- </div>
24
- {{/if}}
4
+ {{~> components/base/a11y/hiddenText _locaTag="story_newsletter_outro_sr" ~}}
5
+ </div>
package/package.json CHANGED
@@ -6,7 +6,7 @@
6
6
  "license": "MIT",
7
7
  "main": "dist/index.js",
8
8
  "repository": "https://github.com/szuelch/hr-design-system-handlebars",
9
- "version": "1.114.85",
9
+ "version": "1.114.87",
10
10
  "scripts": {
11
11
  "test": "echo \"Error: no test specified\" && exit 1",
12
12
  "storybook": "storybook dev -p 6006 public",
@@ -129,13 +129,15 @@
129
129
  "newsletter_subscribe": "Anmelden",
130
130
  "newsletter_subscribe_text": "Bitte auswählen:",
131
131
  "newsletter_text_error": "Aufgrund eines technischen Fehlers können wir derzeit Ihre Anfrage nicht bearbeiten. Bitte versuchen Sie es zu einem späteren Zeitpunkt noch einmal.",
132
- "newsletter_text_already_registered": "Sollten Sie ihr Abonnement kündigen oder verwalten wollen, können Sie dies <a href=\"https://hessenschau-nl.sr.de/newsletter-login.php\" class=\"{nuc https://hessenschau-nl.sr.de/newsletter-login.php nuc}link unbreakable\" target=\"_blank\"><span class=\"unbreakable\">hier<svg class=\"icon icon--primary icon--textRight\" role=\"presentation\"><use xlink:href=\"{<% hrcms.delivery.current.assetBaseUrl %>}base/icons/icons/svgmap.min.svg#extern\"/></svg></span></a> tun.",
132
+ "newsletter_text_already_registered": "Sollten Sie ihr Abonnement kündigen oder verwalten wollen, können Sie dies <a href=\"https://hessenschau-nl.sr.de/newsletter-login.php\" class=\"{nuc https://hessenschau-nl.sr.de/newsletter-login.php nuc}link unbreakable\" target=\"_blank\"><span class=\"unbreakable\">hier</a> tun.",
133
133
  "newsletter_text_registered": "In Zukunft erhalten Sie regelmäßig Mails mit aktuellen Informationen rund um unseren Sender.<br><br>Außerdem bekommen Sie umgehend den zurzeit aktuellen Newsletter zugeschickt.",
134
134
  "newsletter_text_success": "Sie erhalten in wenigen Minuten eine E-Mail an die von Ihnen angegebene Adresse. Erst nach einem Klick auf den darin enthaltenen Bestätigungslink erhalten Sie unseren Newsletter.",
135
135
  "newsletter_title_error": "Das hat leider nicht geklappt!",
136
136
  "newsletter_title_already_registered": "Sie haben den Newsletter bereits abonniert.",
137
137
  "newsletter_title_registered": "Sie haben sich erfolgreich für den Newsletter angemeldet.",
138
138
  "newsletter_title_success": "Vielen Dank für Ihre Anmeldung.",
139
+ "story_newsletter_intro_sr": "Formular",
140
+ "story_newsletter_outro_sr": "Ende des Formulars",
139
141
  "newsletter_unsubscribe": "Abmelden",
140
142
  "poster_copyright": "Bild &copy; {0}",
141
143
  "search_input_aria_submit": "Suche starten",