@newlogic-digital/ui 3.2.0 → 3.4.2

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 (89) hide show
  1. package/README.md +1 -5
  2. package/package.json +21 -14
  3. package/src/data/main.json +5 -1
  4. package/src/emails/{email.css → styles/email.css} +1 -1
  5. package/src/emails/templates/Content.twig +16 -0
  6. package/src/emails/templates/Header.twig +14 -0
  7. package/src/emails/templates/Layout.twig +23 -0
  8. package/src/scripts/Components/CookieConsent.js +0 -1
  9. package/src/scripts/Layout/Header.js +23 -11
  10. package/src/scripts/Layout/Main.js +6 -39
  11. package/src/scripts/Libraries/+.js +2 -1
  12. package/src/scripts/Libraries/Dialog.js +35 -65
  13. package/src/scripts/Libraries/Drawer.js +21 -15
  14. package/src/scripts/Libraries/Form.js +14 -18
  15. package/src/scripts/Libraries/Naja.js +35 -0
  16. package/src/scripts/Libraries/NativeSlider.js +3 -2
  17. package/src/scripts/Libraries/ReCaptcha.js +24 -4
  18. package/src/scripts/Libraries/Stimulus.js +1 -31
  19. package/src/scripts/Libraries/Swup.js +24 -32
  20. package/src/scripts/Libraries/Tabs.js +5 -5
  21. package/src/scripts/Libraries/Tippy.js +3 -1
  22. package/src/scripts/Ui/+.js +0 -1
  23. package/src/scripts/Ui/Checkbox.js +4 -13
  24. package/src/scripts/Ui/Input.js +19 -65
  25. package/src/scripts/Ui/Select.js +11 -39
  26. package/src/scripts/Ui/Text.js +2 -4
  27. package/src/scripts/Utils/Functions/+.js +1 -1
  28. package/src/scripts/Utils/Functions/checkValidity.js +44 -0
  29. package/src/scripts/Utils/Functions/loadStimulus.js +4 -1
  30. package/src/scripts/Utils/cdn.js +3 -3
  31. package/src/scripts/Utils/global.js +6 -8
  32. package/src/styles/Components/+.css +1 -1
  33. package/src/styles/Components/Dialog/Default.css +17 -52
  34. package/src/styles/Components/Dropdown/+.css +1 -0
  35. package/src/styles/{Ui/Dropdown.css → Components/Dropdown/Default.css} +1 -1
  36. package/src/styles/Layout/Main.css +4 -20
  37. package/src/styles/Libraries/+.css +0 -1
  38. package/src/styles/Libraries/Dialog.css +23 -7
  39. package/src/styles/Libraries/Drawer.css +3 -9
  40. package/src/styles/Libraries/Hint.css +4 -3
  41. package/src/styles/Libraries/NativeSlider.css +8 -0
  42. package/src/styles/Libraries/Ripple.css +4 -17
  43. package/src/styles/Libraries/Tippy.css +1 -1
  44. package/src/styles/Ui/+.css +0 -1
  45. package/src/styles/Ui/Badge.css +1 -1
  46. package/src/styles/Ui/Btn.css +24 -6
  47. package/src/styles/Ui/Checkbox.css +28 -3
  48. package/src/styles/Ui/Heading.css +2 -1
  49. package/src/styles/Ui/Icon.css +2 -2
  50. package/src/styles/Ui/Image.css +1 -7
  51. package/src/styles/Ui/Input.css +65 -18
  52. package/src/styles/Ui/Label.css +2 -2
  53. package/src/styles/Ui/Link.css +13 -6
  54. package/src/styles/Ui/Notice.css +1 -1
  55. package/src/styles/Ui/Select.css +3 -5
  56. package/src/styles/Ui/Text.css +18 -4
  57. package/src/styles/Ui/Title.css +3 -2
  58. package/src/styles/Utils/+.css +1 -0
  59. package/src/styles/Utils/breakpoints.css +9 -0
  60. package/src/styles/Utils/default.css +12 -115
  61. package/src/styles/Utils/tailwind/+.css +1 -0
  62. package/src/styles/Utils/tailwind/base.css +0 -12
  63. package/src/styles/Utils/tailwind/utilities.css +48 -0
  64. package/src/styles/Utils/vars.css +28 -39
  65. package/src/styles/Utils/vendor.css +2 -1
  66. package/src/styles/main.css +2 -3
  67. package/src/templates/Components/Dialogs/Basic.twig +15 -17
  68. package/src/templates/Layout/Main.twig +0 -6
  69. package/src/templates/Sections/Ui/Docs/@intro.html +97 -0
  70. package/src/templates/Sections/Ui/Docs/@nav.html +195 -0
  71. package/src/templates/Sections/Ui/Docs/@styles.html +100 -0
  72. package/src/templates/Sections/Ui/Docs/Default.twig +1600 -0
  73. package/src/templates/Sections/Ui/Icons.html +28 -0
  74. package/src/templates/Sections/Ui/Intro.html +136 -0
  75. package/src/templates/Sections/Ui.twig +5 -2090
  76. package/src/templates/Utils/sections.twig +2 -2
  77. package/src/views/{dialog-basic.json.twig → dialog/basic.json.twig} +1 -1
  78. package/src/views/{json-tippy.json.twig → dropdown/tippy.json.twig} +3 -3
  79. package/src/views/email/email.twig +6 -0
  80. package/src/views/gdpr.json +2 -1
  81. package/src/views/index.json +2 -2
  82. package/src/views/ui-icons.json +12 -0
  83. package/src/views/ui.json +2 -2
  84. package/vite.config.js +24 -4
  85. package/src/emails/email.twig +0 -60
  86. package/src/scripts/Ui/Radio.js +0 -23
  87. package/src/scripts/Utils/Functions/inView.js +0 -25
  88. package/src/styles/Components/Item/+.css +0 -1
  89. package/src/styles/Libraries/Lazysizes.css +0 -9
package/src/templates/Utils/sections.twig CHANGED
@@ -1,3 +1,3 @@
1
1
  {% for section in sections %}
2
- {% include '../' ~ section.src ~ '.twig' %}
3
- {% endfor %}
2
+ {% include '../' ~ section.src %}
3
+ {% endfor %}
package/src/views/{dialog-basic.json.twig → dialog/basic.json.twig} RENAMED
@@ -1,3 +1,3 @@
1
- {% json 'dialog' %}
1
+ {% json 'content' %}
2
2
  {% include '@templates/Components/Dialogs/Basic.twig' %}
3
3
  {% endjson %}
package/src/views/{json-tippy.json.twig → dropdown/tippy.json.twig} RENAMED
@@ -1,6 +1,6 @@
1
1
  {% json 'content' %}
2
- <div class="ui-dropdown">
3
- <ul class="wrp_ui_list flex-col row-y gy-4">
2
+ <div class="c-dropdown">
3
+ <ul class="wrp_c_list flex-col row-y gy-4">
4
4
  <li class="col">
5
5
  <button class="ui-link">
6
6
  <span>{edit}</span>
@@ -13,4 +13,4 @@
13
13
  </li>
14
14
  </ul>
15
15
  </div>
16
- {% endjson %}
16
+ {% endjson %}
package/src/views/email/email.twig ADDED
@@ -0,0 +1,6 @@
1
+ <extends src="emails/templates/Layout.twig">
2
+ <block name="body">
3
+ <include src="emails/templates/Header.twig"></include>
4
+ <include src="emails/templates/Content.twig"></include>
5
+ </block>
6
+ </extends>
package/src/views/gdpr.json CHANGED
@@ -4,7 +4,8 @@
4
4
  "title": "Newlogic UI",
5
5
  "body": [
6
6
  {
7
- "src": "Sections/Gdpr"
7
+ "src": "Sections/Gdpr.twig",
8
+ "intro": true
8
9
  }
9
10
  ]
10
11
  }
package/src/views/index.json CHANGED
@@ -4,9 +4,9 @@
4
4
  "title": "Newlogic UI",
5
5
  "body": [
6
6
  {
7
- "src": "Sections/Ui",
7
+ "src": "Sections/Ui.twig",
8
8
  "intro": true
9
9
  }
10
10
  ]
11
11
  }
12
- }
12
+ }
package/src/views/ui-icons.json ADDED
@@ -0,0 +1,12 @@
1
+ {
2
+ "headerNormal": true,
3
+ "page": {
4
+ "title": "Newlogic UI",
5
+ "body": [
6
+ {
7
+ "src": "Sections/Ui.twig",
8
+ "icons": true
9
+ }
10
+ ]
11
+ }
12
+ }
package/src/views/ui.json CHANGED
@@ -4,8 +4,8 @@
4
4
  "title": "Newlogic UI",
5
5
  "body": [
6
6
  {
7
- "src": "Sections/Ui"
7
+ "src": "Sections/Ui.twig"
8
8
  }
9
9
  ]
10
10
  }
11
- }
11
+ }
package/vite.config.js CHANGED
@@ -1,6 +1,26 @@
1
- import { defineConfig } from 'vituum'
2
1
  import core from '@newlogic-digital/core'
2
+ import postcssHasPseudo from 'css-has-pseudo'
3
+ import postcssCustomSelectors from 'postcss-custom-selectors'
3
4
 
4
- export default defineConfig({
5
- integrations: [core()]
6
- })
5
+ export default {
6
+ plugins: [
7
+ core({
8
+ format: ['twig'],
9
+ twig: {
10
+ globals: {
11
+ template: './src/templates/Layout/Main.twig'
12
+ }
13
+ },
14
+ tailwindcss: {
15
+ nesting: {
16
+ noIsPseudoSelector: true
17
+ }
18
+ }
19
+ })
20
+ ],
21
+ css: {
22
+ postcss: {
23
+ plugins: [postcssCustomSelectors(), postcssHasPseudo()]
24
+ }
25
+ }
26
+ }
package/src/emails/email.twig DELETED
@@ -1,60 +0,0 @@
1
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2
- <html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40">
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
5
- <title>Email Template</title>
6
- <!--[if gte mso 9]><xml><o:OfficeDocumentSettings><o:PixelsPerInch>96</o:PixelsPerInch></o:OfficeDocumentSettings></xml><![endif]-->
7
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
8
- <style type="text/css" n:syntax="off">
9
- @import './email.css';
10
- </style>
11
- </head>
12
- <body>
13
- <table class="elm_container_wrapper">
14
- <tr>
15
- <td>
16
- <table class="elm_container">
17
- <tr class="elm_header">
18
- <td>
19
- <table class="elm_inner_container">
20
- <tr>
21
- <td>
22
- <br />
23
- <a href="#"><img src="https://via.placeholder.com/160x60" width="160" alt="" style="width: 160px" /></a>
24
- <br />
25
- <br />
26
- </td>
27
- </tr>
28
- </table>
29
- </td>
30
- </tr>
31
- <tr class="nlm_content">
32
- <td>
33
- <table class="elm_inner_container">
34
- <tr>
35
- <td>
36
- <br />
37
- <div class="elm_content_heading">Děkujeme za Váš zájem</div>
38
- <br />
39
- Jsme opravdu rádi že jste se nám ozvali! Toto jsou Vaše údaje z formuláře:
40
- <br />
41
- <br />
42
- <p><strong>Jméno</strong>: Pavel Novák</p>
43
- <p><strong>Email</strong>: jmeno.prijmeni@email.cz</p>
44
- <p><strong>Telefon</strong>: +420111222333</p>
45
- <br/>
46
- <p><strong>Zpráva</strong>:</p>
47
- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vitae est dui. Vestibulum vehicula in mi in interdum. Aliquam quis tempor nibh. Duis tincidunt vel purus tincidunt iaculis. In bibendum leo justo, et elementum justo dapibus et. Aliquam eu elementum magna. Fusce egestas urna ac venenatis auctor. Phasellus felis leo, suscipit non est sit amet, lobortis pellentesque urna. Ut enim leo, posuere eget mauris vel, egestas pellentesque metus. Curabitur ut est ut orci blandit suscipit. Morbi lacinia sapien luctus lectus maximus, vitae gravida lectus aliquet. Vestibulum ut placerat diam. Fusce dapibus tincidunt justo, sed venenatis nisl porttitor vitae.</p>
48
- <br />
49
- <div class="elm_content_info"><a href="https://www.nazevwebu.cz"><span>www.nazevwebu.cz</span></a></div>
50
- </td>
51
- </tr>
52
- </table>
53
- </td>
54
- </tr>
55
- </table>
56
- </td>
57
- </tr>
58
- </table>
59
- </body>
60
- </html>
package/src/scripts/Ui/Radio.js DELETED
@@ -1,23 +0,0 @@
1
- import { LibStimulus, Controller } from '../Libraries/Stimulus.js'
2
-
3
- LibStimulus.register('ui-radio', class extends Controller {
4
- validate(element) {
5
- element.parentNode._removeDataValue('state', 'valid invalid')
6
-
7
- if (element.checkValidity()) {
8
- element.parentNode._addDataValue('state', 'valid')
9
-
10
- document.querySelectorAll(`input[name="${element.name}"]`).forEach(element => {
11
- element.parentNode._addDataValue('state', 'valid')
12
- })
13
- } else {
14
- element.parentNode._addDataValue('state', 'invalid')
15
- }
16
- }
17
-
18
- connect() {
19
- const input = this.element.querySelector('input:not([type="hidden"])')
20
-
21
- input.addEventListener('change', () => this.validate(input))
22
- }
23
- })
package/src/scripts/Utils/Functions/inView.js DELETED
@@ -1,25 +0,0 @@
1
- export default function inView(element, options) {
2
- let inView = false
3
-
4
- return new Promise((resolve) => {
5
- if (typeof IntersectionObserver === 'undefined') {
6
- resolve()
7
- return false
8
- }
9
-
10
- if (typeof options === 'undefined') {
11
- options = {}
12
- }
13
-
14
- if (typeof options.rootMargin === 'undefined') {
15
- options.rootMargin = '100px'
16
- }
17
-
18
- new IntersectionObserver(entries => {
19
- if (entries[0].isIntersecting && inView === false) {
20
- inView = entries[0].isIntersecting
21
- resolve()
22
- }
23
- }, options).observe(element)
24
- })
25
- }
package/src/styles/Components/Item/+.css DELETED
@@ -1 +0,0 @@
1
- /* empty */
package/src/styles/Libraries/Lazysizes.css DELETED
@@ -1,9 +0,0 @@
1
- .lazyload,
2
- .lazyloading {
3
- opacity: 0;
4
- }
5
-
6
- .lazyloaded {
7
- opacity: 1;
8
- transition: var(--transition-opacity);
9
- }