@ouestfrance/sipa-bms-ui 8.2.0 → 8.4.0

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 (39) hide show
  1. package/dist/components/layout/BmsCard.vue.d.ts +3 -0
  2. package/dist/components/navigation/BmsFixedMenu.vue.d.ts +17 -0
  3. package/dist/index.d.ts +2 -1
  4. package/dist/mockServiceWorker.js +1 -1
  5. package/dist/sipa-bms-ui.css +75 -45
  6. package/dist/sipa-bms-ui.es.js +4372 -3575
  7. package/dist/sipa-bms-ui.es.js.map +1 -1
  8. package/dist/sipa-bms-ui.umd.js +4378 -3580
  9. package/dist/sipa-bms-ui.umd.js.map +1 -1
  10. package/package.json +21 -25
  11. package/src/assets/scss/global-variables.scss +1 -1
  12. package/src/components/button/UiButton.stories.js +7 -0
  13. package/src/components/feedback/BmsBadge.stories.js +1 -2
  14. package/src/components/feedback/BmsTooltip.stories.js +1 -2
  15. package/src/components/feedback/UiTooltip.stories.js +6 -0
  16. package/src/components/form/BmsInputToggle.stories.js +1 -1
  17. package/src/components/form/RawAutocomplete.spec.ts +30 -10
  18. package/src/components/form/RawAutocomplete.vue +3 -0
  19. package/src/components/form/UiBmsInputCheckbox.stories.js +1 -1
  20. package/src/components/form/UiBmsSwitch.stories.js +6 -1
  21. package/src/components/layout/BmsCard.stories.js +14 -0
  22. package/src/components/layout/BmsCard.vue +14 -2
  23. package/src/components/layout/BmsForm.stories.js +1 -1
  24. package/src/components/layout/BmsHeaderTitle.stories.js +1 -1
  25. package/src/components/navigation/BmsFixedMenu.stories.js +113 -0
  26. package/src/components/navigation/BmsFixedMenu.vue +70 -0
  27. package/src/components/navigation/BmsMenuNav.vue +5 -1
  28. package/src/components/navigation/BmsShortLinkMenu.stories.js +1 -1
  29. package/src/components/navigation/UiMenuItem.stories.js +6 -0
  30. package/src/components/navigation/UiMenuItemStatus.stories.js +6 -0
  31. package/src/components/navigation/UiTab.stories.js +7 -0
  32. package/src/components/navigation/UiTenantSwitcher.stories.js +6 -0
  33. package/src/components/table/UiBmsTable.stories.js +8 -1
  34. package/src/components/table/UiBmsTableRow.vue +5 -5
  35. package/src/components/table/UiFilterButton.stories.js +6 -0
  36. package/src/components/utils/BmsProblem.stories.js +1 -1
  37. package/src/documentation/template_internal_component.mdx +19 -0
  38. package/src/index.ts +3 -0
  39. package/src/showroom/pages/autocomplete.vue +7 -4
@@ -1,6 +1,8 @@
1
1
  import { StatusType } from '../../models';
2
+ import { RouteLocationRaw } from 'vue-router';
2
3
  type __VLS_Props = {
3
4
  animated?: boolean;
5
+ to?: RouteLocationRaw;
4
6
  type?: StatusType;
5
7
  };
6
8
  declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
@@ -10,6 +12,7 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__
10
12
  blob: HTMLDivElement;
11
13
  mainComponent: HTMLDivElement;
12
14
  }, HTMLDivElement>, {
15
+ default?(_: {}): any;
13
16
  default?(_: {}): any;
14
17
  action?(_: {}): any;
15
18
  }>;
@@ -0,0 +1,17 @@
1
+ import { RouteLocationNormalizedLoaded } from 'vue-router';
2
+ import { MenuItem, ParentMenuItem } from '../../models';
3
+ interface Props {
4
+ items: (MenuItem | ParentMenuItem)[];
5
+ activeLink: RouteLocationNormalizedLoaded;
6
+ }
7
+ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>, {
8
+ top?(_: {}): any;
9
+ additional?(_: {}): any;
10
+ footer?(_: {}): any;
11
+ }>;
12
+ export default _default;
13
+ type __VLS_WithTemplateSlots<T, S> = T & {
14
+ new (): {
15
+ $slots: S;
16
+ };
17
+ };
package/dist/index.d.ts CHANGED
@@ -42,6 +42,7 @@ import { default as BmsStep } from './components/layout/BmsStep.vue';
42
42
  import { default as BmsStepper } from './components/layout/BmsStepper.vue';
43
43
  import { default as BmsBackButton } from './components/navigation/BmsBackButton.vue';
44
44
  import { default as BmsBreadcrumb } from './components/navigation/BmsBreadcrumb.vue';
45
+ import { default as BmsFixedMenu } from './components/navigation/BmsFixedMenu.vue';
45
46
  import { default as BmsLink } from './components/navigation/BmsLink.vue';
46
47
  import { default as BmsMenu } from './components/navigation/BmsMenu.vue';
47
48
  import { default as BmsMenuNav } from './components/navigation/BmsMenuNav.vue';
@@ -70,4 +71,4 @@ export * from './plugins/confirm';
70
71
  export * from './plugins/runtime-env';
71
72
  export * from './plugins/router-history';
72
73
  export * from './services';
73
- export { BmsButton, BmsIconButton, BmsAlert, BmsBadge, BmsCaption, BmsCircularProgress, BmsLoader, BmsTooltip, BmsAutocomplete, BmsBetweenInput, BmsChip, BmsFilePicker, BmsInputBooleanCheckbox, BmsInputCheckboxGroup, BmsInputCheckboxCaption, BmsInputCheckboxCaptionGroup, BmsInputCode, BmsInputDateTime, BmsInputFile, BmsInputNumber, BmsInputRadio, BmsInputRadioGroup, BmsInputRadioCaption, BmsInputRadioCaptionGroup, BmsInputText, BmsInputToggle, BmsMultiSelect, BmsSearch, BmsSelect, BmsTag, BmsTextArea, BmsContentPageLayout, BmsCard, BmsForm, BmsHeader, BmsHeaderTitle, BmsModal, BmsOverlay, BmsSection, BmsStep, BmsStepper, BmsBackButton, BmsBreadcrumb, BmsLink, BmsMenu, BmsMenuNav, BmsShortLinkMenu, BmsTabs, BmsTenantSwitcher, BmsDraggableList, BmsEmptyScreen, BmsPagination, BmsServerTable, BmsTable, BmsCocarde, BmsProblem, BmsRelativeTime, };
74
+ export { BmsButton, BmsIconButton, BmsAlert, BmsBadge, BmsCaption, BmsCircularProgress, BmsLoader, BmsTooltip, BmsAutocomplete, BmsBetweenInput, BmsChip, BmsFilePicker, BmsInputBooleanCheckbox, BmsInputCheckboxGroup, BmsInputCheckboxCaption, BmsInputCheckboxCaptionGroup, BmsInputCode, BmsInputDateTime, BmsInputFile, BmsInputNumber, BmsInputRadio, BmsInputRadioGroup, BmsInputRadioCaption, BmsInputRadioCaptionGroup, BmsInputText, BmsInputToggle, BmsMultiSelect, BmsSearch, BmsSelect, BmsTag, BmsTextArea, BmsContentPageLayout, BmsCard, BmsForm, BmsHeader, BmsHeaderTitle, BmsModal, BmsOverlay, BmsSection, BmsStep, BmsStepper, BmsBackButton, BmsBreadcrumb, BmsFixedMenu, BmsLink, BmsMenu, BmsMenuNav, BmsShortLinkMenu, BmsTabs, BmsTenantSwitcher, BmsDraggableList, BmsEmptyScreen, BmsPagination, BmsServerTable, BmsTable, BmsCocarde, BmsProblem, BmsRelativeTime, };
@@ -7,7 +7,7 @@
7
7
  * - Please do NOT modify this file.
8
8
  */
9
9
 
10
- const PACKAGE_VERSION = '2.10.3'
10
+ const PACKAGE_VERSION = '2.10.4'
11
11
  const INTEGRITY_CHECKSUM = 'f5825c521429caf22a4dd13b66e243af'
12
12
  const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
13
13
  const activeClientIds = new Set()
@@ -582,7 +582,7 @@ ul li[data-v-4f63af62]:hover, ul li.selected[data-v-4f63af62] {
582
582
  line-height: 1;
583
583
  width: 100%;
584
584
  background-color: transparent;
585
- }.field__input .autocomplete-wrapper[data-v-143805f2] {
585
+ }.field__input .autocomplete-wrapper[data-v-a3c538be] {
586
586
  width: 100%;
587
587
  padding: 0.7em;
588
588
  margin: 0.5em 0;
@@ -591,22 +591,22 @@ ul li[data-v-4f63af62]:hover, ul li.selected[data-v-4f63af62] {
591
591
  background-color: var(--input-background-color);
592
592
  height: 48px;
593
593
  }
594
- .field__input .autocomplete-wrapper[data-v-143805f2]:hover {
594
+ .field__input .autocomplete-wrapper[data-v-a3c538be]:hover {
595
595
  --field-border-color: var(--bms-grey-100);
596
596
  }
597
- .field__input .autocomplete-wrapper[data-v-143805f2]:has(input:focus) {
597
+ .field__input .autocomplete-wrapper[data-v-a3c538be]:has(input:focus) {
598
598
  --field-border-color: var(--field-border-color-active);
599
599
  }
600
- .field__input .autocomplete-wrapper.is-error[data-v-143805f2] {
600
+ .field__input .autocomplete-wrapper.is-error[data-v-a3c538be] {
601
601
  --field-border-color: var(--bms-red-100);
602
602
  --input-background-color: var(--bms-red-25);
603
603
  }
604
- .field__input .autocomplete-wrapper.is-disabled[data-v-143805f2] {
604
+ .field__input .autocomplete-wrapper.is-disabled[data-v-a3c538be] {
605
605
  --field-border-color: var(--bms-grey-25);
606
606
  --input-background-color: var(--bms-grey-25);
607
607
  pointer-events: none;
608
608
  }
609
- .field__input .autocomplete-wrapper input[data-v-143805f2] {
609
+ .field__input .autocomplete-wrapper input[data-v-a3c538be] {
610
610
  outline: none;
611
611
  appearance: none;
612
612
  border: 0;
@@ -619,7 +619,7 @@ ul li[data-v-4f63af62]:hover, ul li.selected[data-v-4f63af62] {
619
619
  width: 100%;
620
620
  background-color: transparent;
621
621
  }
622
- .icon[data-v-143805f2] {
622
+ .icon[data-v-a3c538be] {
623
623
  height: 1em;
624
624
  width: 1em;
625
625
  cursor: pointer;
@@ -1312,7 +1312,7 @@ input[type=radio][data-v-cb26402d]:checked::before {
1312
1312
  }
1313
1313
  .page[data-v-31057778] .header .actions .add-button {
1314
1314
  text-align: end;
1315
- }.card[data-v-4c43a2ad] {
1315
+ }.card[data-v-cff3f84d] {
1316
1316
  --summary-card-background-color: rgba(255, 255, 255, 0.5);
1317
1317
  --summary-card-color: var(--bms-font-color);
1318
1318
  --card-margin: 2px;
@@ -1322,28 +1322,28 @@ input[type=radio][data-v-cb26402d]:checked::before {
1322
1322
  overflow: hidden;
1323
1323
  --card-content-border-radius: var(--bms-border-radius-large);
1324
1324
  }
1325
- .card.card--information[data-v-4c43a2ad] {
1325
+ .card.card--information[data-v-cff3f84d] {
1326
1326
  --summary-card-color: white;
1327
1327
  --summary-card-background-color: var(--bms-main-100);
1328
1328
  }
1329
- .card.card--success[data-v-4c43a2ad] {
1329
+ .card.card--success[data-v-cff3f84d] {
1330
1330
  --summary-card-color: white;
1331
1331
  --summary-card-background-color: var(--bms-success-color);
1332
1332
  }
1333
- .card.card--warning[data-v-4c43a2ad] {
1333
+ .card.card--warning[data-v-cff3f84d] {
1334
1334
  --summary-card-color: white;
1335
1335
  --summary-card-background-color: var(--bms-warning-color);
1336
1336
  }
1337
- .card.card--danger[data-v-4c43a2ad] {
1337
+ .card.card--danger[data-v-cff3f84d] {
1338
1338
  --summary-card-color: white;
1339
1339
  --summary-card-background-color: var(--bms-danger-color);
1340
1340
  }
1341
- .card .hasAction[data-v-4c43a2ad] {
1341
+ .card .hasAction[data-v-cff3f84d] {
1342
1342
  --card-content-border-radius: var(--bms-border-radius-large)
1343
1343
  var(--bms-border-radius-large) 0 0;
1344
1344
  cursor: pointer;
1345
1345
  }
1346
- .card__body[data-v-4c43a2ad] {
1346
+ .card__body[data-v-cff3f84d] {
1347
1347
  position: relative;
1348
1348
  min-height: 50px;
1349
1349
  min-width: 50px;
@@ -1354,14 +1354,18 @@ input[type=radio][data-v-cb26402d]:checked::before {
1354
1354
  justify-content: space-between;
1355
1355
  flex-direction: column;
1356
1356
  }
1357
- .card__body__content[data-v-4c43a2ad] {
1357
+ .card__body__content[data-v-cff3f84d] {
1358
1358
  height: 100%;
1359
1359
  border-radius: var(--card-content-border-radius);
1360
1360
  background-color: var(--summary-card-background-color);
1361
1361
  backdrop-filter: blur(40px);
1362
1362
  color: var(--summary-card-color);
1363
1363
  }
1364
- .card__body__action[data-v-4c43a2ad] {
1364
+ .card__body__content__link[data-v-cff3f84d] {
1365
+ color: var(--summary-card-color);
1366
+ text-decoration: none;
1367
+ }
1368
+ .card__body__action[data-v-cff3f84d] {
1365
1369
  border-top: 1px solid var(--bms-grey-10);
1366
1370
  border-radius: 0 0 var(--bms-border-radius-large) var(--bms-border-radius-large);
1367
1371
  background-color: var(--bms-white);
@@ -1369,7 +1373,7 @@ input[type=radio][data-v-cb26402d]:checked::before {
1369
1373
  padding: 0.5em;
1370
1374
  cursor: pointer;
1371
1375
  }
1372
- .card .blob[data-v-4c43a2ad] {
1376
+ .card .blob[data-v-cff3f84d] {
1373
1377
  transform: translate(10px, 10px);
1374
1378
  width: 60%;
1375
1379
  height: 60%;
@@ -1739,7 +1743,7 @@ a svg[data-v-02d02028] {
1739
1743
  .menu__link .label {
1740
1744
  padding: 16px 16px 16px 0;
1741
1745
  line-height: 16px;
1742
- }nav[data-v-f1abaa99] {
1746
+ }nav[data-v-731a6d8c] {
1743
1747
  display: flex;
1744
1748
  flex-direction: column;
1745
1749
  flex: 1 1 auto;
@@ -1747,63 +1751,90 @@ a svg[data-v-02d02028] {
1747
1751
  padding: 6rem 0 2rem;
1748
1752
  background-color: var(--bms-white);
1749
1753
  }
1750
- nav ul[data-v-f1abaa99] {
1754
+ nav ul[data-v-731a6d8c] {
1751
1755
  margin: 0;
1752
1756
  padding: 0;
1753
1757
  }
1754
- nav ul li[data-v-f1abaa99] {
1758
+ nav ul li[data-v-731a6d8c] {
1755
1759
  display: flex;
1756
1760
  align-items: center;
1757
1761
  list-style-type: none;
1758
1762
  cursor: pointer;
1759
1763
  width: 100%;
1760
1764
  }
1761
- nav ul li .parent-container[data-v-f1abaa99] {
1765
+ nav ul li .parent-container[data-v-731a6d8c] {
1762
1766
  width: 100%;
1763
1767
  }
1764
- nav ul li .parent-container .parent-item[data-v-f1abaa99] {
1768
+ nav ul li .parent-container .parent-item[data-v-731a6d8c] {
1765
1769
  display: flex;
1766
1770
  justify-content: space-between;
1767
1771
  align-items: center;
1768
1772
  color: var(--bms-grey-75);
1769
1773
  padding: 14px 8px;
1770
1774
  }
1771
- nav ul li .parent-container .parent-item[data-v-f1abaa99] .internal-link {
1775
+ nav ul li .parent-container .parent-item[data-v-731a6d8c] .internal-link {
1772
1776
  color: inherit;
1773
1777
  }
1774
- nav ul li .parent-container .parent-item__custom-icon[data-v-f1abaa99] {
1778
+ nav ul li .parent-container .parent-item__custom-icon[data-v-731a6d8c] {
1775
1779
  width: 1em;
1776
1780
  height: 1em;
1777
1781
  }
1778
- nav ul li .parent-container .parent-item[data-v-f1abaa99]:hover {
1782
+ nav ul li .parent-container .parent-item[data-v-731a6d8c]:hover {
1779
1783
  color: var(--bms-main-100);
1780
1784
  text-decoration: none;
1781
1785
  }
1782
- nav ul li .parent-container .parent-item .parent-label[data-v-f1abaa99] {
1786
+ nav ul li .parent-container .parent-item .parent-label[data-v-731a6d8c] {
1783
1787
  line-height: 16px;
1784
1788
  font-size: 14px;
1785
1789
  text-transform: uppercase;
1786
1790
  }
1787
- nav .additional[data-v-f1abaa99] {
1791
+ nav .additional[data-v-731a6d8c] {
1788
1792
  display: flex;
1789
1793
  flex-direction: column;
1790
1794
  flex-grow: 1;
1791
1795
  }
1792
- .open-enter-active[data-v-f1abaa99] {
1796
+ .open-enter-active[data-v-731a6d8c] {
1793
1797
  transition: all 0.7s ease;
1794
1798
  }
1795
- .open-leave-active[data-v-f1abaa99] {
1799
+ .open-leave-active[data-v-731a6d8c] {
1796
1800
  transition: all 0.25s linear;
1797
1801
  }
1798
- .open-enter-from[data-v-f1abaa99],
1799
- .open-leave-to[data-v-f1abaa99] {
1802
+ .open-enter-from[data-v-731a6d8c],
1803
+ .open-leave-to[data-v-731a6d8c] {
1800
1804
  max-height: 0;
1801
1805
  opacity: 0;
1802
1806
  }
1803
- .open-enter-to[data-v-f1abaa99],
1804
- .open-leave-from[data-v-f1abaa99] {
1807
+ .open-enter-to[data-v-731a6d8c],
1808
+ .open-leave-from[data-v-731a6d8c] {
1805
1809
  max-height: 500px;
1806
1810
  opacity: 1;
1811
+ }.menu__container[data-v-701e04d9] {
1812
+ display: flex;
1813
+ flex-direction: column;
1814
+ height: 100%;
1815
+ width: 100%;
1816
+ background: var(--bms-white);
1817
+ border-right: 1px solid var(--bms-grey-10);
1818
+ padding: 0;
1819
+ }
1820
+ .menu__container nav[data-v-701e04d9] {
1821
+ scrollbar-width: none;
1822
+ padding: 0;
1823
+ overflow-x: hidden;
1824
+ max-width: calc(var(--bms-menu-width) + 5px);
1825
+ }
1826
+ .menu__container nav[data-v-701e04d9] ul li {
1827
+ width: var(--bms-menu-width);
1828
+ }
1829
+ .menu__top[data-v-701e04d9] {
1830
+ margin: 0.5em;
1831
+ }
1832
+ .menu__copyright[data-v-701e04d9] {
1833
+ display: flex;
1834
+ justify-content: center;
1835
+ align-items: center;
1836
+ min-height: 80px;
1837
+ overflow-x: hidden;
1807
1838
  }.menu__container[data-v-79a67d3d] {
1808
1839
  --menu-margin: 1.5rem;
1809
1840
  position: fixed;
@@ -2093,40 +2124,39 @@ nav .additional[data-v-f1abaa99] {
2093
2124
  .bms-pagination__select[data-v-e10f3b80] .field__wrapper {
2094
2125
  min-width: 10em;
2095
2126
  width: 10em;
2096
- }.bms-table__row[data-v-e0f602cf] {
2127
+ }.bms-table__row[data-v-bfdc6655] {
2097
2128
  --table-cell-padding: 1em;
2098
2129
  background-color: rgb(255, 255, 255);
2099
2130
  }
2100
- .bms-table__row td[data-v-e0f602cf] {
2131
+ .bms-table__row td[data-v-bfdc6655] {
2101
2132
  padding: var(--table-cell-padding);
2102
2133
  background-color: rgb(255, 255, 255);
2103
2134
  }
2104
- .bms-table__row--dense[data-v-e0f602cf] {
2135
+ .bms-table__row--dense[data-v-bfdc6655] {
2105
2136
  --table-cell-padding: 0.5em 1em;
2106
2137
  }
2107
- .bms-table__row--selected td[data-v-e0f602cf] {
2138
+ .bms-table__row--selected[data-v-bfdc6655] td {
2108
2139
  background-color: var(--bms-main-10);
2109
2140
  }
2110
- .bms-table__row--disabled td[data-v-e0f602cf] {
2141
+ .bms-table__row--disabled td[data-v-bfdc6655] {
2111
2142
  color: var(--bms-grey-50);
2112
2143
  }
2113
- .bms-table__row__cell__checkbox[data-v-e0f602cf] {
2144
+ .bms-table__row__cell__checkbox[data-v-bfdc6655] {
2114
2145
  width: 4em;
2115
2146
  }
2116
- .bms-table__row__cell--action[data-v-e0f602cf] {
2147
+ .bms-table__row__cell--action[data-v-bfdc6655] {
2117
2148
  display: flex;
2118
2149
  justify-content: end;
2119
2150
  }
2120
- .bms-table__row__cell--empty[data-v-e0f602cf] {
2151
+ .bms-table__row__cell--empty[data-v-bfdc6655] {
2121
2152
  height: 360px;
2122
2153
  }
2123
- .bms-table__row__cell--child-element[data-v-e0f602cf] {
2154
+ .bms-table__row__cell--child-element[data-v-bfdc6655] {
2124
2155
  display: inline-flex;
2125
2156
  align-items: flex-end;
2126
2157
  }
2127
- .bms-table__row__cell--child-element__icon[data-v-e0f602cf] {
2158
+ .bms-table__row__cell--child-element__icon[data-v-bfdc6655] {
2128
2159
  display: flex;
2129
- min-width: 1em;
2130
2160
  margin-right: 1em;
2131
2161
  }.bms-table[data-v-9cbfc981] {
2132
2162
  --table-cell-padding: 1em;
@@ -2995,7 +3025,7 @@ section {
2995
3025
  --bms-red-25: #f4cfd0;
2996
3026
  --bms-red-10: #f9eaeb;
2997
3027
  --bms-white: #fcfcfc;
2998
- --bms-background-color: #f6f6f8;
3028
+ --bms-background-color: #f8fafd;
2999
3029
  --bms-border-radius: 4px;
3000
3030
  --bms-border-radius-large: 8px;
3001
3031
  --bms-border-radius-xlarge: 16px;