@ouestfrance/sipa-bms-ui 8.10.1 → 8.12.0

package/dist/sipa-bms-ui.css

@@ -1,11 +1,11 @@
 @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap");.bms-button {
-  height: 2em;
   font-size: 1em;
+  --button-padding: 0.5em;
   box-sizing: border-box;
   display: inline-flex;
   align-items: center;
   margin: 0;
-  padding: 0.5em;
+  padding: var(--button-padding);
   appearance: none;
   cursor: pointer;
   border-radius: var(--bms-border-radius);
@@ -33,7 +33,6 @@
   cursor: initial;
 }
 .bms-button.is-icon {
-  padding: 0.5em 0;
   --bms-button-background-color: transparent;
   --bms-button-border-color: transparent;
   --bms-button-text-color: var(--bms-grey-100);
@@ -78,7 +77,7 @@
   --bms-button-disabled-text-color: var(--bms-disabled-color);
 }
 .bms-button .content {
-  margin: 0 0.5em;
+  margin: 0 var(--button-padding);
 }
 .bms-button > span:empty {
   display: none;
@@ -88,8 +87,13 @@
   width: 1em;
   height: 1em;
 }
+.bms-button--small {
+  --button-padding: 0.25em;
+}
+.bms-button.is-icon {
+  padding: var(--button-padding) 0;
+}
 .bms-button.is-default.is-icon {
-  padding: 0.5em 0;
   --bms-button-background-color: transparent;
   --bms-button-border-color: transparent;
   --bms-button-text-color: var(--bms-grey-100);
@@ -134,7 +138,6 @@
   --bms-button-disabled-text-color: var(--bms-disabled-color);
 }
 .bms-button.is-warning.is-icon {
-  padding: 0.5em 0;
   --bms-button-background-color: transparent;
   --bms-button-border-color: transparent;
   --bms-button-text-color: var(--bms-grey-100);
@@ -179,7 +182,6 @@
   --bms-button-disabled-text-color: var(--bms-disabled-color);
 }
 .bms-button.is-danger.is-icon {
-  padding: 0.5em 0;
   --bms-button-background-color: transparent;
   --bms-button-border-color: transparent;
   --bms-button-text-color: var(--bms-grey-100);
@@ -224,7 +226,6 @@
   --bms-button-disabled-text-color: var(--bms-disabled-color);
 }
 .bms-button.is-success.is-icon {
-  padding: 0.5em 0;
   --bms-button-background-color: transparent;
   --bms-button-border-color: transparent;
   --bms-button-text-color: var(--bms-grey-100);
@@ -394,7 +395,7 @@
 .circular-progress svg circle[data-v-7869acfb] {
   transition: stroke-dashoffset 0.2s ease-in-out;
 }.bms-loader[data-v-7cc96135] {
-  font-size: var(--71df0f7a);
+  font-size: var(--v71df0f7a);
   color: var(--bms-main-100, currentColor);
   display: inline-block;
 }
@@ -402,7 +403,7 @@
   width: 1em;
   height: 1em;
   display: block;
-}.bms-tooltip__text[data-v-44def116] {
+}.bms-tooltip__text[data-v-bf923418] {
   --bms-tooltip-background-color: white;
   --bms-tooltip-color: inherit;
   --bms-tooltip-margin: 4px;
@@ -419,8 +420,9 @@
   filter: drop-shadow(0 0 0.8rem var(--bms-shadow-color));
   color: var(--bms-font-color);
   transform: var(--bms-tooltip-transform);
+  overflow-wrap: break-word;
 }
-.bms-tooltip__text[data-v-44def116]::before {
+.bms-tooltip__text[data-v-bf923418]::before {
   content: "";
   position: absolute;
   right: var(--bms-tooltip-indicator-position-right);
@@ -432,54 +434,54 @@
   border-style: solid;
   border-color: var(--bms-tooltip-indicator-border);
 }
-.bms-tooltip__text--top[data-v-44def116], .bms-tooltip__text--bottom[data-v-44def116] {
+.bms-tooltip__text--top[data-v-bf923418], .bms-tooltip__text--bottom[data-v-bf923418] {
   --bms-tooltip-indicator-position-left: 50%;
   --bms-tooltip-indicator-position-right: initial;
 }
-.bms-tooltip__text--bottom[data-v-44def116] {
+.bms-tooltip__text--bottom[data-v-bf923418] {
   --bms-tooltip-indicator-position-top: initial;
   --bms-tooltip-indicator-position-bottom: 100%;
   --bms-tooltip-indicator-border: transparent transparent
     var(--bms-tooltip-background-color) transparent;
 }
-.bms-tooltip__text--top[data-v-44def116] {
+.bms-tooltip__text--top[data-v-bf923418] {
   --bms-tooltip-indicator-position-top: 100%;
   --bms-tooltip-indicator-position-bottom: initial;
   --bms-tooltip-indicator-border: var(--bms-tooltip-background-color)
     transparent transparent transparent;
 }
-.bms-tooltip__text--left[data-v-44def116], .bms-tooltip__text--right[data-v-44def116] {
+.bms-tooltip__text--left[data-v-bf923418], .bms-tooltip__text--right[data-v-bf923418] {
   --bms-tooltip-indicator-position-top: 50%;
   --bms-tooltip-indicator-position-bottom: initial;
 }
-.bms-tooltip__text--left[data-v-44def116] {
+.bms-tooltip__text--left[data-v-bf923418] {
   --bms-tooltip-indicator-position-right: initial;
   --bms-tooltip-indicator-position-left: 100%;
   --bms-tooltip-indicator-border: transparent transparent transparent
     var(--bms-tooltip-background-color);
 }
-.bms-tooltip__text--right[data-v-44def116] {
+.bms-tooltip__text--right[data-v-bf923418] {
   --bms-tooltip-indicator-position-right: 100%;
   --bms-tooltip-indicator-position-left: initial;
   --bms-tooltip-indicator-border: transparent
     var(--bms-tooltip-background-color) transparent transparent;
 }
-.tooltip-fade-enter-active[data-v-44def116] {
+.tooltip-fade-enter-active[data-v-bf923418] {
   transition: opacity 0.2s ease;
 }
-.tooltip-fade-enter-from[data-v-44def116] {
+.tooltip-fade-enter-from[data-v-bf923418] {
   opacity: 0;
 }
-.tooltip-fade-enter-to[data-v-44def116] {
+.tooltip-fade-enter-to[data-v-bf923418] {
   opacity: 1;
 }
-.tooltip-fade-leave-active[data-v-44def116] {
+.tooltip-fade-leave-active[data-v-bf923418] {
   transition: opacity 0.3s ease;
 }
-.tooltip-fade-leave-from[data-v-44def116] {
+.tooltip-fade-leave-from[data-v-bf923418] {
   opacity: 1;
 }
-.tooltip-fade-leave-to[data-v-44def116] {
+.tooltip-fade-leave-to[data-v-bf923418] {
   opacity: 0;
 }.bms-tooltip-anchor-wrapper[data-v-b033f8af] {
   position: relative;
@@ -628,31 +630,31 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
   height: 1em;
   width: 1em;
   cursor: pointer;
-}.icon[data-v-b0e1e6f3] {
+}.icon[data-v-43ad5137] {
   height: 1em;
   width: 1em;
 }
-.icon.datalist-icon[data-v-b0e1e6f3] {
+.icon.datalist-icon[data-v-43ad5137] {
   margin: 0 0.5em;
 }
-.icon[data-v-b0e1e6f3] svg {
+.icon[data-v-43ad5137] svg {
   height: 100%;
   width: 100%;
 }
-.icon[data-v-b0e1e6f3] svg * {
+.icon[data-v-43ad5137] svg * {
   fill: currentColor !important;
-}.icon[data-v-3115cc27] {
+}.icon[data-v-49acc0c6] {
   height: 1em;
   width: 1em;
 }
-.icon.datalist-icon[data-v-3115cc27] {
+.icon.datalist-icon[data-v-49acc0c6] {
   margin: 0 0.5em;
 }
-.icon[data-v-3115cc27] svg {
+.icon[data-v-49acc0c6] svg {
   height: 100%;
   width: 100%;
 }
-.icon[data-v-3115cc27] svg * {
+.icon[data-v-49acc0c6] svg * {
   fill: currentColor !important;
 }.field-between__separator[data-v-f25b520b] {
   margin-left: 10px;
@@ -1073,7 +1075,7 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
 .switch-wrapper.disabled[data-v-6de1a5c6] {
   --switch-background-color: var(--bms-grey-25);
   --switch-color: var(--bms-grey-50);
-}.input-toggle[data-v-9570e0a9] {
+}.input-toggle[data-v-9b546877] {
   --label-color: var(--bms-grey-100);
   --cursor: pointer;
   font-weight: var(--field-label-font-weight);
@@ -1081,18 +1083,28 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
   align-items: center;
   gap: 0.5em;
 }
-.input-toggle .input-switch-info[data-v-9570e0a9] {
+.input-toggle.overflow[data-v-9b546877] {
+  width: 100%;
+}
+.input-toggle.overflow .input-switch-info[data-v-9b546877] {
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  word-break: break-all;
+  text-overflow: ellipsis;
+}
+.input-toggle .input-switch-info[data-v-9b546877] {
   color: var(--label-color);
   transition: 0.2s;
 }
-.input-toggle.isOn[data-v-9570e0a9] {
+.input-toggle.isOn[data-v-9b546877] {
   --label-color: var(--bms-main-100);
 }
-.input-toggle.disabled[data-v-9570e0a9] {
+.input-toggle.disabled[data-v-9b546877] {
   --label-color: var(--bms-grey-50);
   --cursor: default;
 }
-.input-toggle[data-v-9570e0a9]:hover {
+.input-toggle[data-v-9b546877]:hover {
   cursor: var(--cursor);
 }.tag[data-v-e2517fee] {
   --tag-border-color: var(--bms-main-100);
@@ -1159,14 +1171,14 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
 }
 .tag .dismiss-button[data-v-e2517fee] .bms-button:hover {
   background-color: var(--tag-background-color);
-}.field__input[data-v-95176719] {
+}.field__input[data-v-6231389d] {
   --field-border-color: var(--bms-grey-50);
   --field-border-color-active: var(--bms-main-100);
   --input-background-color: var(--bms-white);
 }
-.field__input .select-wrapper[data-v-95176719] {
+.field__input .select-wrapper[data-v-6231389d] {
   width: 100%;
-  padding: 0 0 0 1em;
+  padding: 0 0 0 var(--field-padding);
   border-radius: var(--bms-border-radius);
   border: 1px solid var(--field-border-color);
   background-color: var(--input-background-color);
@@ -1175,106 +1187,62 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
   align-items: center;
   justify-content: space-between;
 }
-.field__input .select-wrapper .icon-down-container[data-v-95176719] {
-  height: 100%;
-  display: flex;
-  align-items: center;
-}
-.field__input .select-wrapper .icon-down-container[data-v-95176719]:hover {
-  cursor: pointer;
-}
-.field__input .select-wrapper .icon-down-button[data-v-95176719] {
-  width: 1em;
-  margin: 0 var(--field-padding);
-  display: block;
-}
-.field__input .select-wrapper[data-v-95176719]:hover {
+.field__input .select-wrapper[data-v-6231389d]:hover {
   --field-border-color: var(--bms-grey-100);
 }
-.field__input .select-wrapper[data-v-95176719]:has(input:focus) {
+.field__input .select-wrapper[data-v-6231389d]:has(input:focus) {
   --field-border-color: var(--field-border-color-active);
 }
-.field__input .select-wrapper.is-error[data-v-95176719] {
+.field__input .select-wrapper.is-error[data-v-6231389d] {
   --field-border-color: var(--bms-red-100);
   --input-background-color: var(--bms-red-25);
 }
-.field__input .select-wrapper.is-disabled[data-v-95176719] {
+.field__input .select-wrapper.is-disabled[data-v-6231389d] {
   --field-border-color: var(--bms-grey-25);
   --input-background-color: var(--bms-grey-25);
   pointer-events: none;
-}.tags[data-v-aece870d] {
+}.tags[data-v-584dc93e] {
   display: flex;
   gap: 0.5em;
   padding: var(--field-margin);
   flex-wrap: wrap;
   width: 100%;
 }
-.tags .search[data-v-aece870d] {
+.tags .search[data-v-584dc93e] {
   outline: none;
   border: none;
   background-color: transparent;
   flex-grow: 1;
 }
-.icon-container[data-v-aece870d] {
+.icon-container[data-v-584dc93e] {
   height: 100%;
   display: flex;
   align-items: center;
 }
-.icon-container[data-v-aece870d]:hover {
+.icon-container[data-v-584dc93e]:hover {
   cursor: pointer;
 }
-.icon-container .icon[data-v-aece870d] {
+.icon-container .icon[data-v-584dc93e] {
   display: block;
   width: 1em;
   height: 1em;
   margin: 0 1em 0 0.5em;
 }.clean-icon[data-v-66c267f2]:hover {
   cursor: pointer;
-}.field__input[data-v-21c618e0] {
-  --field-border-color: var(--bms-grey-50);
-  --field-border-color-active: var(--bms-main-100);
-  --input-background-color: var(--bms-white);
-}
-.field__input .select-wrapper[data-v-21c618e0] {
-  width: 100%;
-  padding: 0 0 0 1em;
-  border-radius: var(--bms-border-radius);
-  border: 1px solid var(--field-border-color);
-  background-color: var(--input-background-color);
-  min-height: var(--field-height);
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.field__input .select-wrapper .icon-toggle-container[data-v-21c618e0] {
+}.field__input .icon-toggle-container[data-v-a6c01476] {
   height: 100%;
   display: flex;
   align-items: center;
 }
-.field__input .select-wrapper .icon-toggle-container[data-v-21c618e0]:hover {
+.field__input .icon-toggle-container[data-v-a6c01476]:hover {
   cursor: pointer;
 }
-.field__input .select-wrapper .icon-toggle-button[data-v-21c618e0] {
+.field__input .icon-toggle-button[data-v-a6c01476] {
   width: 1em;
   margin: 0 var(--field-padding);
   display: block;
 }
-.field__input .select-wrapper[data-v-21c618e0]:hover {
-  --field-border-color: var(--bms-grey-100);
-}
-.field__input .select-wrapper[data-v-21c618e0]:has(input:focus) {
-  --field-border-color: var(--field-border-color-active);
-}
-.field__input .select-wrapper.is-error[data-v-21c618e0] {
-  --field-border-color: var(--bms-red-100);
-  --input-background-color: var(--bms-red-25);
-}
-.field__input .select-wrapper.is-disabled[data-v-21c618e0] {
-  --field-border-color: var(--bms-grey-25);
-  --input-background-color: var(--bms-grey-25);
-  pointer-events: none;
-}
-.field__input .select-wrapper input[data-v-21c618e0] {
+.field__input input[data-v-a6c01476] {
   border: none;
   background-color: transparent;
   caret-color: transparent;
@@ -2448,7 +2416,7 @@ nav .additional[data-v-731a6d8c] {
 }
 .filters__inputs .input[data-v-4a441463] {
   padding-right: 32px;
-}.table-search[data-v-df695c8a] {
+}.table-search[data-v-a0777ff1] {
   width: 260px;
 }.table-search[data-v-2f003e4e] {
   width: 260px;
@@ -3118,7 +3086,29 @@ section {
   justify-content: space-between;
   margin: 8px;
   font-weight: bold;
-}.field {
+}
+@keyframes blink-animation-c5826002 {
+0% {
+    background-color: var(--bms-main-25);
+}
+50% {
+    background-color: var(--bms-main-10);
+}
+100% {
+    background-color: var(--bms-main-25);
+}
+}
+.skeleton[data-v-c5826002] {
+  /* background-color: var(--bms-main-25); */
+  min-height: var(--field-height);
+  border-radius: var(--bms-border-radius);
+  height: 100%;
+  width: 100%;
+  /* opacity: 0.7; */
+  /* transition: background-color 1000ms linear; */
+  animation: blink-animation-c5826002 2s steps(10, start) infinite alternate;
+}
+.field {
   --field-border-color: var(--bms-grey-50);
   --field-border-color-active: var(--bms-main-100);
   --input-background-color: var(--bms-white);
@@ -3140,7 +3130,6 @@ section {
 .field__wrapper {
   display: inline-block;
   position: relative;
-  min-width: 24rem;
   width: 100%;
   background-color: transparent;
 }
@@ -3149,10 +3138,16 @@ section {
   align-items: center;
 }
 .field__label__title {
+  display: inline-block;
+  white-space: nowrap;
   font-size: 1em;
   font-weight: var(--field-label-font-weight);
   color: var(--field-label-color);
 }
+.field__label__title.ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
 .field__label-helper--icon {
   height: 100%;
   display: flex;
@@ -3174,7 +3169,7 @@ section {
   display: none;
 }
 .field.is-small {
-  --field-height: 28px;
+  --field-height: 1.5em;
   --field-padding: 0.5em;
   --field-margin: 0;
   --field-label-font-weight: normal;