@lion/ui 0.7.2 → 0.7.3

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 (104) hide show
  1. package/components/button/test-suites/LionButtonReset.suite.js +7 -9
  2. package/components/calendar/test/lion-calendar.test.js +26 -30
  3. package/components/checkbox-group/test-suites/CheckboxIndeterminate.suite.js +3 -0
  4. package/components/combobox/test/lion-combobox.test.js +32 -32
  5. package/components/core/src/SlotMixin.js +7 -1
  6. package/components/form/test/lion-form.test.js +4 -4
  7. package/components/form-core/test-suites/ValidateMixin.suite.js +1 -0
  8. package/components/form-core/test-suites/form-group/FormGroupMixin.suite.js +18 -18
  9. package/components/form-integrations/test/dialog-integrations.test.js +6 -4
  10. package/components/helpers/src/SbActionLogger.js +11 -2
  11. package/components/icon/test/lion-icon.test.js +12 -14
  12. package/components/input-amount/test/lion-input-amount.test.js +10 -14
  13. package/components/input-datepicker/test/lion-input-datepicker.test.js +4 -4
  14. package/components/input-file/test/lion-input-file.test.js +3 -3
  15. package/components/input-tel-dropdown/test/LionInputTelDropdown.test.js +23 -23
  16. package/components/listbox/test-suites/ListboxMixin.suite.js +10 -3
  17. package/components/localize/src/date/utils/normalizeIntlDate.js +13 -2
  18. package/components/progress-indicator/test/lion-progress-indicator.test.js +42 -46
  19. package/components/select-rich/test/lion-select-rich.test.js +6 -8
  20. package/components/steps/test/lion-step.test.js +5 -7
  21. package/components/switch/test/lion-switch.test.js +5 -7
  22. package/custom-elements.json +517 -5134
  23. package/dist-types/components/button/test-suites/LionButtonReset.suite.d.ts.map +1 -1
  24. package/dist-types/components/checkbox-group/test-suites/CheckboxIndeterminate.suite.d.ts.map +1 -1
  25. package/dist-types/components/core/src/SlotMixin.d.ts.map +1 -1
  26. package/dist-types/components/form-core/test-suites/ValidateMixin.suite.d.ts.map +1 -1
  27. package/dist-types/components/helpers/src/SbActionLogger.d.ts.map +1 -1
  28. package/dist-types/components/input-tel-dropdown/test/LionInputTelDropdown.test.d.ts.map +1 -1
  29. package/dist-types/components/listbox/test-suites/ListboxMixin.suite.d.ts.map +1 -1
  30. package/dist-types/components/localize/src/date/utils/normalizeIntlDate.d.ts.map +1 -1
  31. package/dist-types/tsconfig.tsbuildinfo +1 -1
  32. package/docs/components/button/use-cases.md +11 -10
  33. package/docs/components/checkbox-group/overview.md +2 -2
  34. package/docs/components/collapsible/assets/applyDemoCollapsibleStyles.js +6 -2
  35. package/docs/components/collapsible/overview.md +1 -1
  36. package/docs/components/combobox/overview.md +4 -3
  37. package/docs/components/combobox/src/gh-combobox/gh-button.js +3 -1
  38. package/docs/components/combobox/src/gh-combobox/gh-combobox.js +9 -2
  39. package/docs/components/combobox/src/google-combobox/google-combobox.js +6 -8
  40. package/docs/components/combobox/src/md-combobox/MdFieldMixin.js +7 -3
  41. package/docs/components/combobox/src/md-combobox/style/md-ripple.js +1 -0
  42. package/docs/components/combobox/src/wa-combobox/wa-combobox.js +15 -3
  43. package/docs/components/combobox/use-cases.md +19 -17
  44. package/docs/components/dialog/overview.md +1 -1
  45. package/docs/components/fieldset/overview.md +5 -5
  46. package/docs/components/form/overview.md +3 -3
  47. package/docs/components/icon/use-cases.md +1 -1
  48. package/docs/components/input/overview.md +1 -1
  49. package/docs/components/input/use-cases.md +3 -2
  50. package/docs/components/input-amount/overview.md +3 -3
  51. package/docs/components/input-date/overview.md +3 -3
  52. package/docs/components/input-datepicker/overview.md +5 -5
  53. package/docs/components/input-email/overview.md +2 -2
  54. package/docs/components/input-file/overview.md +1 -1
  55. package/docs/components/input-iban/overview.md +2 -2
  56. package/docs/components/input-range/overview.md +2 -2
  57. package/docs/components/input-stepper/overview.md +1 -1
  58. package/docs/components/input-tel/overview.md +1 -1
  59. package/docs/components/input-tel/use-cases.md +6 -6
  60. package/docs/components/input-tel-dropdown/overview.md +1 -1
  61. package/docs/components/input-tel-dropdown/src/intl-input-tel-dropdown.js +15 -5
  62. package/docs/components/listbox/use-cases.md +1 -1
  63. package/docs/components/progress-indicator/examples.md +11 -11
  64. package/docs/components/radio-group/overview.md +3 -3
  65. package/docs/components/select/use-cases.md +1 -1
  66. package/docs/components/select-rich/use-cases.md +1 -1
  67. package/docs/components/tabs/examples.md +1 -1
  68. package/docs/components/tabs/src/lea-tab-panel.js +3 -1
  69. package/docs/components/tabs/src/lea-tab.js +7 -2
  70. package/docs/fundamentals/index.md +4 -4
  71. package/docs/fundamentals/node-tools/providence-analytics/LocalConfiguration.md +1 -1
  72. package/docs/fundamentals/node-tools/providence-analytics/QueryResult.md +1 -1
  73. package/docs/fundamentals/node-tools/providence-analytics/analyzer.md +1 -1
  74. package/docs/fundamentals/node-tools/providence-analytics/assets/_mermaid.svg.js +32 -8
  75. package/docs/fundamentals/node-tools/providence-analytics/dashboard.md +1 -1
  76. package/docs/fundamentals/node-tools/providence-analytics/overview.md +3 -3
  77. package/docs/fundamentals/node-tools/publish-docs/overview.md +3 -3
  78. package/docs/fundamentals/node-tools/rocket-preset-extend-lion-docs/overview.md +2 -2
  79. package/docs/fundamentals/rationales/accessibility.md +1 -1
  80. package/docs/fundamentals/systems/core/SlotMixin.md +1 -1
  81. package/docs/fundamentals/systems/core/overview.md +1 -1
  82. package/docs/fundamentals/systems/form/formatting-and-parsing.md +4 -4
  83. package/docs/fundamentals/systems/form/model-value.md +1 -1
  84. package/docs/fundamentals/systems/form/overview.md +28 -28
  85. package/docs/fundamentals/systems/form/validate.md +3 -3
  86. package/docs/fundamentals/systems/localize/overview.md +4 -4
  87. package/docs/fundamentals/systems/overlays/_configuration-positioning.md +0 -9
  88. package/docs/fundamentals/systems/overlays/_edge-cases.md +74 -80
  89. package/docs/fundamentals/systems/overlays/configuration.md +2 -2
  90. package/docs/fundamentals/systems/overlays/overview.md +5 -5
  91. package/docs/fundamentals/systems/overlays/use-cases.md +5 -8
  92. package/docs/fundamentals/tools/helpers/action-logger.md +3 -6
  93. package/docs/fundamentals/tools/helpers/overview.md +1 -1
  94. package/docs/fundamentals/tools/singleton-manager/example-complex/demo-app.js +3 -1
  95. package/docs/fundamentals/tools/singleton-manager/example-fail/demo-app.js +3 -1
  96. package/docs/fundamentals/tools/singleton-manager/example-success/demo-app.js +3 -1
  97. package/docs/fundamentals/tools/singleton-manager/overview.md +4 -4
  98. package/docs/guides/how-to/create-a-custom-field.md +5 -5
  99. package/docs/guides/how-to/create-a-form.md +4 -4
  100. package/docs/guides/how-to/extend-a-native-input.md +2 -2
  101. package/docs/guides/index.md +8 -8
  102. package/docs/guides/principles/index.md +5 -5
  103. package/docs/guides/principles/styling.md +1 -1
  104. package/package.json +2 -2
@@ -51,15 +51,14 @@ By given the progress-indicator a value it becomes determinate.
51
51
  The min is automatically set to "0" and max to "100", but they can be set to your local needs.
52
52
 
53
53
  ```js preview-story
54
- export const progressBarDemo = () =>
55
- html`
56
- <my-determinate-progress-bar
57
- aria-label="Interest rate"
58
- name="my-bar"
59
- value="50"
60
- ></my-determinate-progress-bar>
61
- <button @click="${changeProgress}">Randomize Value</button>
62
- `;
54
+ export const progressBarDemo = () => html`
55
+ <my-determinate-progress-bar
56
+ aria-label="Interest rate"
57
+ name="my-bar"
58
+ value="50"
59
+ ></my-determinate-progress-bar>
60
+ <button @click="${changeProgress}">Randomize Value</button>
61
+ `;
63
62
  ```
64
63
 
65
64
  ## Styled progress spinner example
@@ -120,6 +119,7 @@ class MyIndeterminateProgressSpinner extends LionProgressIndicator {
120
119
  ```
121
120
 
122
121
  ```js preview-story
123
- export const main = () =>
124
- html` <my-indeterminate-progress-spinner></my-indeterminate-progress-spinner> `;
122
+ export const main = () => html`
123
+ <my-indeterminate-progress-spinner></my-indeterminate-progress-spinner>
124
+ `;
125
125
  ```
@@ -20,12 +20,12 @@ export const main = () => html`
20
20
  `;
21
21
  ```
22
22
 
23
- - Make sure that to use a name attribute as it is necessary for our [form](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/form/overview.md)'s serialization result.
24
- - If you have many options for a user to pick from, consider using our [select](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/select/overview.md) instead.
23
+ - Make sure that to use a name attribute as it is necessary for our [form](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/form/overview.md)'s serialization result.
24
+ - If you have many options for a user to pick from, consider using our [select](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/select/overview.md) instead.
25
25
 
26
26
  ## Features
27
27
 
28
- Since it extends from our [fieldset](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/fieldset/overview.md), it has all the features a fieldset has.
28
+ Since it extends from our [fieldset](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/fieldset/overview.md), it has all the features a fieldset has.
29
29
 
30
30
  - Get or set the checked value of the group:
31
31
  - modelValue (default) - `checkedValue()`
@@ -53,4 +53,4 @@ Or by setting the `disabled` attribute on the entire `lion-select` field.
53
53
 
54
54
  ## Validation
55
55
 
56
- A validator can be used to make it e.g. `required`. If you want to know how to do that, please take a look at our [validation examples](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/validate.md).
56
+ A validator can be used to make it e.g. `required`. If you want to know how to do that, please take a look at our [validation examples](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/validate.md).
@@ -302,7 +302,7 @@ LionSelectRich will give it acces to:
302
302
  - LionSelectRich itself, via `.hostElement`
303
303
 
304
304
  Code of an advanced custom invoker is shown below (this is the code for the
305
- invoker used in [IntlSelectRich](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/select-rich/examples.md)).
305
+ invoker used in [IntlSelectRich](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/select-rich/examples.md)).
306
306
  The invoker is usually added in the invoker slot of the LionSelectRich subclass.
307
307
  However, it would also be possible for an application developer to provide the invoker
308
308
  by putting it in light dom:
@@ -9,7 +9,7 @@ import './src/lea-tab-panel.js';
9
9
 
10
10
  ## Lea Tabs
11
11
 
12
- Learn how to create the `lea tabs` in our ["introducing lion" blogpost](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/blog/ing-open-sources-lion.md).
12
+ Learn how to create the `lea tabs` in our ["introducing lion" blogpost](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/blog/ing-open-sources-lion.md).
13
13
 
14
14
  ```js preview-story
15
15
  export const main = () => html`
@@ -7,7 +7,9 @@ export class LeaTabPanel extends LitElement {
7
7
  background-color: #fff;
8
8
  background-image: linear-gradient(top, #fff, #ddd);
9
9
  border-radius: 0 2px 2px 2px;
10
- box-shadow: 0 2px 2px #000, 0 -1px 0 #fff inset;
10
+ box-shadow:
11
+ 0 2px 2px #000,
12
+ 0 -1px 0 #fff inset;
11
13
  padding: 30px;
12
14
  }
13
15
  `;
@@ -10,7 +10,10 @@ export class LeaTab extends LitElement {
10
10
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
11
11
  color: #fff;
12
12
  float: left;
13
- font: bold 12px/35px 'Lucida sans', Arial, Helvetica;
13
+ font:
14
+ bold 12px/35px 'Lucida sans',
15
+ Arial,
16
+ Helvetica;
14
17
  height: 35px;
15
18
  padding: 0 30px;
16
19
  text-decoration: none;
@@ -23,7 +26,9 @@ export class LeaTab extends LitElement {
23
26
 
24
27
  :host(:focus) {
25
28
  border-radius: 4px;
26
- box-shadow: 0 0 8px #9fcaea, 0 0 0 1px #559bd1;
29
+ box-shadow:
30
+ 0 0 8px #9fcaea,
31
+ 0 0 0 1px #559bd1;
27
32
 
28
33
  /* outline: 0; */
29
34
  }
@@ -9,11 +9,11 @@ Here you find more details about what we offer.
9
9
 
10
10
  Let's see what each section describes.
11
11
 
12
- 1. [Systems](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/core/overview.md) <br>
12
+ 1. [Systems](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/core/overview.md) <br>
13
13
  These are the fundamental systems that power all of our components.
14
- 2. [Tools](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/tools/helpers/overview.md) <br>
14
+ 2. [Tools](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/tools/helpers/overview.md) <br>
15
15
  Frontend Tools useful for web development but are not visual and therefore are not components.
16
- 3. [Node Tools](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/babel-plugin-extend-docs/overview.md) <br>
16
+ 3. [Node Tools](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/babel-plugin-extend-docs/overview.md) <br>
17
17
  Node tools to analyse the code and for extending the documentation.
18
- 4. [Rationales](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/rationales/side-effects.md) <br>
18
+ 4. [Rationales](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/rationales/side-effects.md) <br>
19
19
  The reasoning behind some of our decisions.
@@ -45,7 +45,7 @@ export default {
45
45
  ### referenceCollections
46
46
 
47
47
  A list of file system paths. They can be defined relative from the current project root or they can be full paths.
48
- When a [MatchAnalyzer](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/providence-analytics/analyzer.md) like `match-imports` or `match-subclasses` is used, the default reference(s) can be configured here. For instance: ['/path/to/@lion/ui/form.js']
48
+ When a [MatchAnalyzer](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/providence-analytics/analyzer.md) like `match-imports` or `match-subclasses` is used, the default reference(s) can be configured here. For instance: ['/path/to/@lion/ui/form.js']
49
49
 
50
50
  An example:
51
51
 
@@ -108,4 +108,4 @@ QueryOutput structure could be simplified in the future.
108
108
 
109
109
  The output files stored in the file system always need to be machine independent:
110
110
  this means that all machine specific information, like a complete filepath, needs to be removed from a QueryOutput (paths relative from project root are still allowed).
111
- In that way, the caching mechanism (based on hash comparisons) as described in [Analyzer](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/providence-analytics/analyzer.md) is guaranteed to work across different machines.
111
+ In that way, the caching mechanism (based on hash comparisons) as described in [Analyzer](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/providence-analytics/analyzer.md) is guaranteed to work across different machines.
@@ -7,7 +7,7 @@ A few examples are:
7
7
  - find-exports
8
8
  - match-imports
9
9
 
10
- An analyzer will give back a [QueryResult](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/providence-analytics/QueryResult.md) that will be written to the file system by Providence.
10
+ An analyzer will give back a [QueryResult](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/providence-analytics/QueryResult.md) that will be written to the file system by Providence.
11
11
  All analyzers need to extend from the `Analyzer` base class, found in `src/program/analyzers/helpers`.
12
12
 
13
13
  ## Public api
@@ -19,7 +19,10 @@ export const providenceFlowSvg = html` <svg
19
19
  >
20
20
  <style>
21
21
  #mermaid-1592918098747 .label {
22
- font-family: trebuchet ms, verdana, arial;
22
+ font-family:
23
+ trebuchet ms,
24
+ verdana,
25
+ arial;
23
26
  color: #333;
24
27
  }
25
28
  #mermaid-1592918098747 .node circle,
@@ -57,7 +60,10 @@ export const providenceFlowSvg = html` <svg
57
60
  max-width: 200px;
58
61
  max-height: 400px;
59
62
  padding: 2px;
60
- font-family: trebuchet ms, verdana, arial;
63
+ font-family:
64
+ trebuchet ms,
65
+ verdana,
66
+ arial;
61
67
  font-size: 12px;
62
68
  background: #ffffde;
63
69
  border: 1px solid #aa3;
@@ -118,7 +124,10 @@ export const providenceFlowSvg = html` <svg
118
124
  #mermaid-1592918098747 .noteText {
119
125
  fill: #000;
120
126
  stroke: none;
121
- font-family: trebuchet ms, verdana, arial;
127
+ font-family:
128
+ trebuchet ms,
129
+ verdana,
130
+ arial;
122
131
  font-size: 14px;
123
132
  }
124
133
  #mermaid-1592918098747 .section {
@@ -267,7 +276,10 @@ export const providenceFlowSvg = html` <svg
267
276
  #mermaid-1592918098747 g.classGroup text {
268
277
  fill: #9370db;
269
278
  stroke: none;
270
- font-family: trebuchet ms, verdana, arial;
279
+ font-family:
280
+ trebuchet ms,
281
+ verdana,
282
+ arial;
271
283
  font-size: 10px;
272
284
  }
273
285
  #mermaid-1592918098747 g.classGroup rect {
@@ -553,7 +565,10 @@ export const providenceInternalFlowSvg = html`
553
565
  >
554
566
  <style>
555
567
  #mermaid-1592918099462 .label {
556
- font-family: trebuchet ms, verdana, arial;
568
+ font-family:
569
+ trebuchet ms,
570
+ verdana,
571
+ arial;
557
572
  color: #333;
558
573
  }
559
574
  #mermaid-1592918099462 .node circle,
@@ -591,7 +606,10 @@ export const providenceInternalFlowSvg = html`
591
606
  max-width: 200px;
592
607
  max-height: 400px;
593
608
  padding: 2px;
594
- font-family: trebuchet ms, verdana, arial;
609
+ font-family:
610
+ trebuchet ms,
611
+ verdana,
612
+ arial;
595
613
  font-size: 12px;
596
614
  background: #ffffde;
597
615
  border: 1px solid #aa3;
@@ -652,7 +670,10 @@ export const providenceInternalFlowSvg = html`
652
670
  #mermaid-1592918099462 .noteText {
653
671
  fill: #000;
654
672
  stroke: none;
655
- font-family: trebuchet ms, verdana, arial;
673
+ font-family:
674
+ trebuchet ms,
675
+ verdana,
676
+ arial;
656
677
  font-size: 14px;
657
678
  }
658
679
  #mermaid-1592918099462 .section {
@@ -801,7 +822,10 @@ export const providenceInternalFlowSvg = html`
801
822
  #mermaid-1592918099462 g.classGroup text {
802
823
  fill: #9370db;
803
824
  stroke: none;
804
- font-family: trebuchet ms, verdana, arial;
825
+ font-family:
826
+ trebuchet ms,
827
+ verdana,
828
+ arial;
805
829
  font-size: 10px;
806
830
  }
807
831
  #mermaid-1592918099462 g.classGroup rect {
@@ -1,6 +1,6 @@
1
1
  # Node Tools >> Providence Analytics >> Dashboard ||30
2
2
 
3
- An interactive overview of all aggregated [QueryResults](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/providence-analytics/QueryResult.md) can be found in the dashboard.
3
+ An interactive overview of all aggregated [QueryResults](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/providence-analytics/QueryResult.md) can be found in the dashboard.
4
4
  The dashboard is a small nodejs server (based on es-dev-server + middleware) and a frontend
5
5
  application.
6
6
 
@@ -47,7 +47,7 @@ npm i --save-dev providence-analytics
47
47
  You are now ready to use providence in your project. All
48
48
  data will be stored in json files in the folder `./providence-output`
49
49
 
50
- ![CLI](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/providence-analytics/assets/provicli.gif 'CLI')
50
+ ![CLI](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/providence-analytics/assets/provicli.gif 'CLI')
51
51
 
52
52
  ## Setup: Dashboard
53
53
 
@@ -76,7 +76,7 @@ export default {
76
76
 
77
77
  Run `npm run providence:dashboard`
78
78
 
79
- ![dashboard](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/providence-analytics/assets/providash.gif 'dashboard')
79
+ ![dashboard](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/providence-analytics/assets/providash.gif 'dashboard')
80
80
 
81
81
  ## Setup: about result output
82
82
 
@@ -153,7 +153,7 @@ Now you will get a list of all predefined analyzers:
153
153
  - match-subclasses
154
154
  - etc...
155
155
 
156
- ![Analyzer query](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/providence-analytics/assets/analyzer-query.gif 'Analyzer query')
156
+ ![Analyzer query](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/providence-analytics/assets/analyzer-query.gif 'Analyzer query')
157
157
 
158
158
  <!--
159
159
  ## Running providence from its own repo
@@ -31,7 +31,7 @@ For a Mono Repository
31
31
  ```md
32
32
  # My Pkg
33
33
 
34
- [=> See Source <=](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/docs/deep/dir/overview.md)
34
+ [=> See Source <=](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/docs/deep/dir/overview.md)
35
35
  ```
36
36
 
37
37
  ## CLI flags
@@ -61,7 +61,7 @@ Bring the `overview.md` in a docs folder along.
61
61
  👉 `packages/[my-package]/docs/overview.md`
62
62
 
63
63
  ```md
64
- [=> See Source <=](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/docs/deep/dir/overview.md)
64
+ [=> See Source <=](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/docs/deep/dir/overview.md)
65
65
  ```
66
66
 
67
67
  Add a `use-cases.md`
@@ -69,7 +69,7 @@ Add a `use-cases.md`
69
69
  👉 `packages/[my-package]/docs/use-cases.md`
70
70
 
71
71
  ```md
72
- [=> See Source <=](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/docs/deep/dir/use-cases.md)
72
+ [=> See Source <=](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/docs/deep/dir/use-cases.md)
73
73
  ```
74
74
 
75
75
  So you will end up with something like this in your package.
@@ -7,7 +7,7 @@ To do this automatically you can use this preset for [rocket](https://rocket.mod
7
7
 
8
8
  ## Features
9
9
 
10
- - Import lion documentation and adjust it using [remark-extend](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/remark-extend/overview.md)
10
+ - Import lion documentation and adjust it using [remark-extend](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/remark-extend/overview.md)
11
11
  - Renames named imports and all it's usage
12
12
  - Adjusts import paths
13
13
  - Replace tags in template literals
@@ -38,7 +38,7 @@ export default {
38
38
 
39
39
  ## Reusing documentation
40
40
 
41
- To take an existing documentation you can "import" it using [remark-extend](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/node-tools/remark-extend/overview.md).
41
+ To take an existing documentation you can "import" it using [remark-extend](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/node-tools/remark-extend/overview.md).
42
42
 
43
43
  As an example you can create `docs/components/tabs/overview.md`.
44
44
 
@@ -25,4 +25,4 @@ Internally, we delegate all intricacies involved in managing light dom to SlotMi
25
25
  SlotMixin automatically mediates between light dom provided by the user ('public slots') and light dom provided by the component author ('private slots').
26
26
  Also, SlotMixin allows to hook into the reactive update loop of LitElement (automatically rerendering on property changes) and it automatically respects
27
27
  the scoped registry belonging to the shadow root.
28
- More details about SlotMixin can be found in the [SlotMixin documentation](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/core/SlotMixin.md)
28
+ More details about SlotMixin can be found in the [SlotMixin documentation](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/core/SlotMixin.md)
@@ -152,4 +152,4 @@ This will make sure that the slot provided by the user always takes precedence a
152
152
 
153
153
  ### Default slot
154
154
 
155
- As can be seen in the example of [SlotFunctionResults](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/core/#slotfunctionresults), '' can be used to add content to the default slot
155
+ As can be seen in the example of [SlotFunctionResults](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/core/#slotfunctionresults), '' can be used to add content to the default slot
@@ -15,7 +15,7 @@ import { LitElement, html, render } from 'lit-element';
15
15
 
16
16
  ## Features
17
17
 
18
- - [function to deduplicate mixins (dedupeMixin)](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/core/#deduping-of-mixins)
18
+ - [function to deduplicate mixins (dedupeMixin)](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/core/#deduping-of-mixins)
19
19
  - Mixin to handle disabled (DisabledMixin)
20
20
  - Mixin to handle disabled AND tabIndex (DisabledWithTabIndexMixin)
21
21
  - Mixin to manage auto-generated needed slot elements in light dom (SlotMixin)
@@ -23,7 +23,7 @@ Our fields can automatically format/parse/serialize user input or an input set i
23
23
 
24
24
  Below are some concrete examples of implementations of formatters and parsers mimicking a (basic) amount input.
25
25
 
26
- > For an actual amount input, check out [lion-input-amount](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-amount/overview.md).
26
+ > For an actual amount input, check out [lion-input-amount](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-amount/overview.md).
27
27
  > This comes with its own formatter, parser, serializer.
28
28
 
29
29
  ### Parsers & modelValue
@@ -230,16 +230,16 @@ Below we show three flow diagrams to show the flow of formatting, serializing an
230
230
 
231
231
  Where a user changes the input with their keyboard:
232
232
 
233
- ![Standard flow](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/assets/FormatMixinDiagram-1.svg 'Standard flow')
233
+ ![Standard flow](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/assets/FormatMixinDiagram-1.svg 'Standard flow')
234
234
 
235
235
  ### Unparseable flow
236
236
 
237
237
  Where a user sets the input to something that is not parseable by the parser:
238
238
 
239
- ![Unparseable flow](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/assets/FormatMixinDiagram-2.svg 'Unparseable flow')
239
+ ![Unparseable flow](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/assets/FormatMixinDiagram-2.svg 'Unparseable flow')
240
240
 
241
241
  ### Imperative / programmatic flow
242
242
 
243
243
  Where the developer sets the modelValue of the input programmatically:
244
244
 
245
- ![Imperative flow](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/assets/FormatMixinDiagram-3.svg 'Imperative flow')
245
+ ![Imperative flow](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/assets/FormatMixinDiagram-3.svg 'Imperative flow')
@@ -21,7 +21,7 @@ level, via:
21
21
  > Internal/private concepts like viewValue, formattedValue, serializedValue are therefore not
22
22
  > recommended as a means of interaction.
23
23
 
24
- For more information about parsing and the Unparseable type, see [Formatting and Parsing](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/formatting-and-parsing.md)
24
+ For more information about parsing and the Unparseable type, see [Formatting and Parsing](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/formatting-and-parsing.md)
25
25
 
26
26
  ### Event meta
27
27
 
@@ -20,9 +20,9 @@ Fields (think of an input, textarea, select) are the actual form controls the en
20
20
 
21
21
  On top of this, they feature:
22
22
 
23
- - [formatting/parsing/serializing](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/formatting-and-parsing.md) of view values.
24
- - Advanced [validation](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/validate.md) possibilities.
25
- - Creation of advanced user interaction scenarios via [interaction states](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/interaction-states.md).
23
+ - [formatting/parsing/serializing](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/formatting-and-parsing.md) of view values.
24
+ - Advanced [validation](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/validate.md) possibilities.
25
+ - Creation of advanced user interaction scenarios via [interaction states](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/interaction-states.md).
26
26
  - Provision of labels and help texts in an easy, declarative manner.
27
27
  - Accessibility out of the box.
28
28
  - Advanced styling possibilities: map your own Design System to the internal HTML structure.
@@ -31,33 +31,33 @@ On top of this, they feature:
31
31
 
32
32
  ### Platform fields (wrappers)
33
33
 
34
- - [LionInput](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input/overview.md), a wrapper for `<input>`.
35
- - [LionTextarea](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/textarea/overview.md), a wrapper for `<textarea>`.
36
- - [LionSelect](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/select/overview.md), a wrapper for `<select>`.
34
+ - [LionInput](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input/overview.md), a wrapper for `<input>`.
35
+ - [LionTextarea](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/textarea/overview.md), a wrapper for `<textarea>`.
36
+ - [LionSelect](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/select/overview.md), a wrapper for `<select>`.
37
37
 
38
38
  ### Custom fields (wrappers)
39
39
 
40
- Whenever a native form control doesn't exist or is not sufficient, a [custom form field](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/guides/how-to/create-a-custom-field.md) should be created. One could think of components like:
40
+ Whenever a native form control doesn't exist or is not sufficient, a [custom form field](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/guides/how-to/create-a-custom-field.md) should be created. One could think of components like:
41
41
 
42
- - [LionCombobox](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/combobox/overview.md), a custom implementation of a combobox.
43
- - [LionDate](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-date/overview.md), an alternative for `<input type="date">`.
44
- - [LionDatepicker](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-datepicker/overview.md), an alternative for `<input type="date">` including a calendar dropdown.
45
- - [LionListbox](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/listbox/overview.md), a custom implementation of a listbox.
46
- - [LionInputAmount](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-amount/overview.md), an alternative for `<input type="number">` special for amounts.
47
- - [LionInputEmail](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-email/overview.md), an alternative for `<input type="email">`.
48
- - [LionInputIban](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-iban/overview.md), an ING specific for an input with IBAN numbers.
49
- - [LionInputRange](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-range/overview.md), an alternative for `<input type="range">`.
50
- - [LionInputStepper](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/input-stepper/overview.md), an alternative for `<input type="number">`.
51
- - [LionSelectRich](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/select-rich/overview.md), an alternative for `<select>` with multiline options.
42
+ - [LionCombobox](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/combobox/overview.md), a custom implementation of a combobox.
43
+ - [LionDate](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-date/overview.md), an alternative for `<input type="date">`.
44
+ - [LionDatepicker](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-datepicker/overview.md), an alternative for `<input type="date">` including a calendar dropdown.
45
+ - [LionListbox](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/listbox/overview.md), a custom implementation of a listbox.
46
+ - [LionInputAmount](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-amount/overview.md), an alternative for `<input type="number">` special for amounts.
47
+ - [LionInputEmail](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-email/overview.md), an alternative for `<input type="email">`.
48
+ - [LionInputIban](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-iban/overview.md), an ING specific for an input with IBAN numbers.
49
+ - [LionInputRange](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-range/overview.md), an alternative for `<input type="range">`.
50
+ - [LionInputStepper](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/input-stepper/overview.md), an alternative for `<input type="number">`.
51
+ - [LionSelectRich](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/select-rich/overview.md), an alternative for `<select>` with multiline options.
52
52
 
53
53
  ### Choice Input Fields
54
54
 
55
55
  For form controls which return a `checked-state` you can use the `lion-choice-input` mixin. It is used in:
56
56
 
57
- - [LionCheckbox](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/checkbox-group/overview.md), a wrapper for `<input type="checkbox">`.
57
+ - [LionCheckbox](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/checkbox-group/overview.md), a wrapper for `<input type="checkbox">`.
58
58
  - LionOption, an alternative for `<option>`.
59
- - [LionRadio](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/radio-group/overview.md), a wrapper for `<input type="radio">`.
60
- - [LionSwitch](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/switch/overview.md), a custom implementation of a switch.
59
+ - [LionRadio](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/radio-group/overview.md), a wrapper for `<input type="radio">`.
60
+ - [LionSwitch](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/switch/overview.md), a custom implementation of a switch.
61
61
 
62
62
  Which contains the following features:
63
63
 
@@ -69,14 +69,14 @@ Which contains the following features:
69
69
 
70
70
  Fieldsets are groups of fields. They can be considered fields on their own as well, since they partly share the normalized API via `FormControlMixin`. Fieldsets are the basis for:
71
71
 
72
- - [LionFieldset](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/fieldset/overview.md), a wrapper around multiple input fields or other fieldsets.
73
- - [LionForm](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/form/overview.md), enhances the functionality of the native `<form>` component.
74
- - [LionCheckboxGroup](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/checkbox-group/overview.md), a wrapper component for multiple checkboxes.
75
- - [LionRadioGroup](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/components/radio-group/overview.md), a wrapper component for multiple radio inputs.
72
+ - [LionFieldset](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/fieldset/overview.md), a wrapper around multiple input fields or other fieldsets.
73
+ - [LionForm](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/form/overview.md), enhances the functionality of the native `<form>` component.
74
+ - [LionCheckboxGroup](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/checkbox-group/overview.md), a wrapper component for multiple checkboxes.
75
+ - [LionRadioGroup](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/components/radio-group/overview.md), a wrapper component for multiple radio inputs.
76
76
 
77
77
  ## Other Resources
78
78
 
79
- - [Model Value](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/model-value.md)
80
- - [Formatting and parsing](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/formatting-and-parsing.md)
81
- - [Interaction states](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/interaction-states.md)
82
- - [Validation System](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/validate.md)
79
+ - [Model Value](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/model-value.md)
80
+ - [Formatting and parsing](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/formatting-and-parsing.md)
81
+ - [Interaction states](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/interaction-states.md)
82
+ - [Validation System](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/validate.md)
@@ -57,7 +57,7 @@ Validation happens on every change of `modelValue`. A change in modelValue can b
57
57
 
58
58
  ## When validation feedback will be shown
59
59
 
60
- Although validation happens realtime under the hood, displaying validity feedback in realtime may not always lead to the desired User Experience. Together with [interaction states](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/interaction-states.md),
60
+ Although validation happens realtime under the hood, displaying validity feedback in realtime may not always lead to the desired User Experience. Together with [interaction states](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/interaction-states.md),
61
61
  validity states can determine whether a validation message should be shown along the input field.
62
62
 
63
63
  ## Assessing field validation state programmatically
@@ -232,7 +232,7 @@ export const requiredValidator = () => html`
232
232
  `;
233
233
  ```
234
234
 
235
- The default `Required` validation message is "Please, enter a(n) {fieldName}". In which the "fieldName" can be provided separately via the `fieldName` attribute, with a fallback to the label. See [override fieldname](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/form/#override-fieldname) for more information.
235
+ The default `Required` validation message is "Please, enter a(n) {fieldName}". In which the "fieldName" can be provided separately via the `fieldName` attribute, with a fallback to the label. See [override fieldname](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/form/#override-fieldname) for more information.
236
236
 
237
237
  Specific required messages for a select and file-upload are created.
238
238
 
@@ -612,7 +612,7 @@ However, the validation system also supports three non blocking validation feedb
612
612
  - **error**: blocking the field from being submitted to the server. For example:
613
613
  "Please enter an amount higher than 1000,00 euro."
614
614
  - **warning**: something looks wrong, but it is not blocking. For example an optional email input:
615
- "Please enter a valid e-mail address in the format "name@example.com"."
615
+ "Please enter a valid e-mail address in the format `name@example.com`."
616
616
  - **info**: shows extra information. For example a message of a scheduled payment planner:
617
617
  "Ends on 15/05/2020 after 5 payments."
618
618
  - **success**: will only be triggered if there was a Message from one of the above validation types and is now correct. For example: "Ok, correct."
@@ -9,15 +9,15 @@ In it's simplest form it is a function that returns the translated text for a na
9
9
  - Formatting of numbers, amounts
10
10
  - Formatting of dates
11
11
 
12
- Further examples and a more in depth description can be found at the [Use Cases Page](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/localize/use-cases.md).
12
+ Further examples and a more in depth description can be found at the [Use Cases Page](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/localize/use-cases.md).
13
13
 
14
14
  ## Content
15
15
 
16
16
  | Feature | Description |
17
17
  | ---------------------------------------- | --------------------------------------------- |
18
- | [Translate Text](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/localize/text.md) | Load and translate text in multiple languages |
19
- | [Format Numbers](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/localize/numbers.md) | Format numbers in multiple languages |
20
- | [Format Dates](https://github.com/ing-bank/lion/blob/8fd9ec4df166dd45f230eb032e3b1c151fd6240d/docs/fundamentals/systems/localize/dates.md) | Format dates in multiple languages |
18
+ | [Translate Text](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/localize/text.md) | Load and translate text in multiple languages |
19
+ | [Format Numbers](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/localize/numbers.md) | Format numbers in multiple languages |
20
+ | [Format Dates](https://github.com/ing-bank/lion/blob/3829e2dce5fce180672f666257d10513da30e1d5/docs/fundamentals/systems/localize/dates.md) | Format dates in multiple languages |
21
21
 
22
22
  ## Installation
23
23
 
@@ -99,15 +99,6 @@ export const placementGlobal = () => {
99
99
 
100
100
  ## popperConfig
101
101
 
102
- /** Viewport configuration. Will be used when placementMode is 'global' \*/
103
- viewportConfig?: ViewportConfig;
104
- /** Hides other overlays when multiple are opened (currently exclusive to globalOverlayController) _/
105
- isBlocking?: boolean;
106
- /\*\* Will align contentNode with referenceNode (invokerNode by default) for local overlays. Usually needed for dropdowns. 'max' will prevent contentNode from exceeding width of referenceNode, 'min' guarantees that contentNode will be at least as wide as referenceNode. 'full' will make sure that the invoker width always is the same. _/
107
- inheritsReferenceWidth?: 'max' | 'full' | 'min' | 'none';
108
- /\*_ Change the default of 9999 _/
109
- zIndex?: number;
110
-
111
102
  | Prop | Description | Type | | | |
112
103
  | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------- | --- | --- | --- |
113
104
  | placementMode | Determines the positioning anchor (viewport vs invokerNode/referenceNode) | 'global'\|'local' | | | |