@micromag/fields 0.3.824 → 0.4.4

package/es/styles.css

@@ -0,0 +1,47 @@
+.container{display:-ms-flexbox!important;display:flex!important;-ms-flex-flow:row nowrap;flex-flow:row nowrap;overflow:auto;scrollbar-width:none}.container::-webkit-scrollbar{display:none}.item{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}
+.container{width:100%}.button{color:#ccc;-ms-flex:none!important;flex:none!important}.button.active{color:var(--mm-black)}.layout{height:120px;position:relative;width:80px}.type{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.borders{height:1.5em;width:1.5em}
+.icon{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;width:30px;-ms-flex-align:center;align-items:center}.icon>div{background-color:var(--mm-white);height:8px;margin-bottom:2px;margin-right:2px;mix-blend-mode:difference;width:8px}.icon.left{-ms-flex-pack:start;justify-content:flex-start}.icon.middle{-ms-flex-pack:center;justify-content:center}.icon.right{-ms-flex-pack:end;justify-content:flex-end}
+.label{margin-right:auto}
+.label{padding-right:10px}
+.container .error{display:block}
+.container{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.container .rc-switch{background-color:#ccc;border:1px solid #ccc;border-radius:20px;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:inline-block;height:22px;line-height:20px;overflow:hidden;padding:0;position:relative;-webkit-transition:all .3s cubic-bezier(.35,0,.25,1);transition:all .3s cubic-bezier(.35,0,.25,1);vertical-align:middle;width:44px}.container .rc-switch-inner-checked,.container .rc-switch-inner-unchecked{color:#fff;font-size:12px;position:absolute;top:0;-webkit-transition:left .3s cubic-bezier(.35,0,.25,1);transition:left .3s cubic-bezier(.35,0,.25,1)}.container .rc-switch-inner-checked{left:-14px}.container .rc-switch-inner-unchecked{left:24px}.container .rc-switch:after{-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-name:rcSwitchOff;animation-name:rcSwitchOff;-webkit-animation-timing-function:cubic-bezier(.35,0,.25,1);animation-timing-function:cubic-bezier(.35,0,.25,1);background-color:#fff;border-radius:50%;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.26);box-shadow:0 2px 5px rgba(0,0,0,.26);content:" ";cursor:pointer;height:18px;left:2px;position:absolute;top:1px;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition:left .3s cubic-bezier(.35,0,.25,1);transition:left .3s cubic-bezier(.35,0,.25,1);width:18px}.container .rc-switch:hover:after{-webkit-animation-name:rcSwitchOn;animation-name:rcSwitchOn;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}.container .rc-switch:focus{-webkit-box-shadow:0 0 0 2px #d5f1fd;box-shadow:0 0 0 2px #d5f1fd;outline:none}.container .rc-switch-checked{background-color:#a13dff;background-color:var(--mm-purple,#a13dff);border:1px solid #a13dff;border:1px solid var(--mm-purple,#a13dff)}.container .rc-switch-checked .rc-switch-inner-checked{left:6px}.container .rc-switch-checked .rc-switch-inner-unchecked{left:44px}.container .rc-switch-checked:after{left:22px}.container .rc-switch-disabled{background:#ccc;border-color:#ccc;cursor:no-drop}.container .rc-switch-disabled:after{-webkit-animation-name:none;animation-name:none;background:#9e9e9e;cursor:no-drop}.container .rc-switch-disabled:hover:after{-webkit-animation-name:none;animation-name:none;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.container .rc-switch-label{display:inline-block;font-size:14px;line-height:20px;padding-left:10px;pointer-events:none;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;vertical-align:middle;white-space:normal}@-webkit-keyframes rcSwitchOn{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.25);transform:scale(1.25)}to{-webkit-transform:scale(1.1);transform:scale(1.1)}}@keyframes rcSwitchOn{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.25);transform:scale(1.25)}to{-webkit-transform:scale(1.1);transform:scale(1.1)}}@-webkit-keyframes rcSwitchOff{0%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes rcSwitchOff{0%{-webkit-transform:scale(1.1);transform:scale(1.1)}to{-webkit-transform:scale(1);transform:scale(1)}}
+.resetButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0}.colLabel{-ms-flex-negative:1;flex-shrink:1;text-align:left}.colValue{margin-left:auto;white-space:nowrap}.colButtonWidth{width:80%}.colMinWidth{min-width:0}.collapsed{display:none;visibility:hidden}.settingsButton[disabled]{opacity:.25;pointer-events:none}
+.container .form-group:last-child{margin-bottom:0}.container .field{margin-bottom:var(--mm-spacer)}.container .field.isSection{margin-bottom:calc(var(--mm-spacer)*2)}.container .field.isList{margin-bottom:0}.container .field:last-child{margin-bottom:0}.container .advanced{margin-top:calc(var(--mm-spacer)*2)}.container.withBorders .fields{border-bottom:1px solid var(--mm-border-color)}.container.withBorders .field{border-top:1px solid var(--mm-border-color);margin-bottom:0}.container.withBorders .field:last-child{margin-bottom:0}.container.withBorders .fieldRow{padding-bottom:calc(var(--mm-spacer)/2);padding-top:calc(var(--mm-spacer)/2)}
+
+.field-with-form{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;white-space:nowrap;&>*{display:block;margin-right:calc(var(--mm-spacer)/2);&:last-child{margin-right:0}}& .noValue{color:var(--mm-gray-400)}& .noValue,& .value{overflow:hidden;text-overflow:ellipsis}& .value{font-family:var(--mm-font-family-monospace);font-size:.75rem}}.container .value{font-family:var(--mm-font-family-monospace)}.panel{padding:calc(var(--mm-spacer)/2)}
+.thumbnail{display:block;height:1.5em;margin:0;width:auto}.label{min-width:0}.clearButton{margin-left:0;margin-right:8px;position:relative;z-index:1}
+.container{display:-ms-flexbox;display:flex;max-width:100%;width:100%}@media screen and (min-width:768px){.dialog{max-width:90vw!important;width:1200px!important}}.thumbnail{display:inline-block;height:1.3em;margin:0;width:auto}.dialogBody{padding-top:0!important}.dialogBody>div{min-height:75vh;overflow:hidden;overflow-y:scroll}.previewButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;background-color:transparent;border:0;color:inherit;cursor:pointer;display:inline-block;font-family:inherit;padding:0;position:relative}.previewButton.shaded{background-color:var(--mm-gray-700);border-radius:4px}.previewButton.small{width:180px}.clearButton{display:inline-block;display:-ms-flexbox;display:flex;height:18px;position:relative;width:18px;z-index:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;background-color:var(--mm-gray-700);border:0;border-radius:4px;color:inherit;cursor:pointer;font-family:inherit;justify-content:center;margin-left:10px;padding:0 10px}.clearButton svg{display:block}.preview{border-bottom:.4em solid var(--mm-input-bg);border-radius:var(--mm-input-border-radius);height:calc(1.4em + 1rem);overflow:hidden;pointer-events:none}
+.container .list{background-color:var(--mm-light);margin-top:5px;max-height:150px;overflow-y:scroll;position:absolute;width:300px;z-index:1}.container .item{padding:5px 10px}
+.container .field{display:none;margin-bottom:0}.container .field:first-child{display:block}.container .field:first-child button{display:block;margin-left:auto}.container.active .field{display:block;margin-bottom:1rem}
+.container{display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.container .slider{padding:0 .5rem;position:relative;top:-2px}.container .input{width:5em}.container .input,.container .unit{font-size:.75rem;margin-left:calc(var(--mm-spacer)/4)}.container .rc-slider{border-radius:6px;height:14px;padding:5px 0;position:relative;-ms-touch-action:none;touch-action:none;width:100%}.container .rc-slider,.container .rc-slider *{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.container .rc-slider-rail{background-color:#e9e9e9;border-radius:6px;height:4px;position:absolute;width:100%}.container .rc-slider-track,.container .rc-slider-tracks{background-color:#abe2fb;border-radius:6px;height:4px;position:absolute}.container .rc-slider-track-draggable{background-clip:content-box;border-bottom:5px solid rgba(0,0,0,0);border-top:5px solid rgba(0,0,0,0);-webkit-box-sizing:content-box;box-sizing:content-box;-webkit-transform:translateY(-5px);-ms-transform:translateY(-5px);transform:translateY(-5px);z-index:1}.container .rc-slider-handle{background-color:#fff;border:2px solid #96dbfa;border-radius:50%;cursor:pointer;cursor:-webkit-grab;cursor:grab;height:14px;margin-top:-5px;opacity:.8;position:absolute;-ms-touch-action:pan-x;touch-action:pan-x;width:14px;z-index:1}.container .rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging{border-color:#57c5f7;-webkit-box-shadow:0 0 0 5px #96dbfa;box-shadow:0 0 0 5px #96dbfa}.container .rc-slider-handle:focus{-webkit-box-shadow:none;box-shadow:none;outline:none}.container .rc-slider-handle:focus-visible{border-color:#2db7f5;-webkit-box-shadow:0 0 0 3px #96dbfa;box-shadow:0 0 0 3px #96dbfa}.container .rc-slider-handle-click-focused:focus{border-color:#96dbfa;-webkit-box-shadow:none;-webkit-box-shadow:initial;box-shadow:none}.container .rc-slider-handle:hover{border-color:#57c5f7}.container .rc-slider-handle:active{border-color:#57c5f7;-webkit-box-shadow:0 0 5px #57c5f7;box-shadow:0 0 5px #57c5f7;cursor:-webkit-grabbing;cursor:grabbing}.container .rc-slider-mark{font-size:12px;left:0;position:absolute;top:18px;width:100%}.container .rc-slider-mark-text{color:#999;cursor:pointer;display:inline-block;position:absolute;text-align:center;vertical-align:middle}.container .rc-slider-mark-text-active{color:#666}.container .rc-slider-step{background:transparent;height:4px;position:absolute;width:100%}.container .rc-slider-dot{background-color:#fff;border:2px solid #e9e9e9;border-radius:50%;bottom:-2px;cursor:pointer;height:8px;position:absolute;vertical-align:middle;width:8px}.container .rc-slider-dot-active{border-color:#96dbfa}.container .rc-slider-dot-reverse{margin-right:-4px}.container .rc-slider-disabled{background-color:#e9e9e9}.container .rc-slider-disabled .rc-slider-track{background-color:#ccc}.container .rc-slider-disabled .rc-slider-dot,.container .rc-slider-disabled .rc-slider-handle{background-color:#fff;border-color:#ccc;-webkit-box-shadow:none;box-shadow:none;cursor:not-allowed}.container .rc-slider-disabled .rc-slider-dot,.container .rc-slider-disabled .rc-slider-mark-text{cursor:not-allowed!important}.container .rc-slider-vertical{height:100%;padding:0 5px;width:14px}.container .rc-slider-vertical .rc-slider-rail{height:100%;width:4px}.container .rc-slider-vertical .rc-slider-track{bottom:0;left:5px;width:4px}.container .rc-slider-vertical .rc-slider-track-draggable{border-bottom:0;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);border-top:0;-webkit-transform:translateX(-5px);-ms-transform:translateX(-5px);transform:translateX(-5px)}.container .rc-slider-vertical .rc-slider-handle{margin-left:-5px;margin-top:0;position:absolute;-ms-touch-action:pan-y;touch-action:pan-y;z-index:1}.container .rc-slider-vertical .rc-slider-mark{height:100%;left:18px;top:0}.container .rc-slider-vertical .rc-slider-step{height:100%;width:4px}.container .rc-slider-vertical .rc-slider-dot{margin-left:-2px}.container .rc-slider-tooltip-zoom-down-appear,.container .rc-slider-tooltip-zoom-down-enter{-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(.23,1,.32,1);animation-timing-function:cubic-bezier(.23,1,.32,1);display:block!important;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)}.container .rc-slider-tooltip-zoom-down-leave{-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);display:block!important}.container .rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active,.container .rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active{-webkit-animation-name:rcSliderTooltipZoomDownIn;animation-name:rcSliderTooltipZoomDownIn;-webkit-animation-play-state:running;animation-play-state:running}.container .rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active{-webkit-animation-name:rcSliderTooltipZoomDownOut;animation-name:rcSliderTooltipZoomDownOut;-webkit-animation-play-state:running;animation-play-state:running}@-webkit-keyframes rcSliderTooltipZoomDownIn{0%{opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}to{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}}@keyframes rcSliderTooltipZoomDownIn{0%{opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}to{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}}@-webkit-keyframes rcSliderTooltipZoomDownOut{0%{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}to{opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}}@keyframes rcSliderTooltipZoomDownOut{0%{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}to{opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}}.container .rc-slider-tooltip{left:-9999px;position:absolute;top:-9999px;visibility:visible}.container .rc-slider-tooltip,.container .rc-slider-tooltip *{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.container .rc-slider-tooltip-hidden{display:none}.container .rc-slider-tooltip-placement-top{padding:4px 0 8px}.container .rc-slider-tooltip-inner{background-color:#6c6c6c;border-radius:6px;-webkit-box-shadow:0 0 4px #d9d9d9;box-shadow:0 0 4px #d9d9d9;color:#fff;font-size:12px;height:24px;line-height:1;min-width:24px;padding:6px 2px;text-align:center;-webkit-text-decoration:none;text-decoration:none}.container .rc-slider-tooltip-arrow{border-color:transparent;border-style:solid;height:0;position:absolute;width:0}.container .rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow{border-top-color:#6c6c6c;border-width:4px 4px 0;bottom:4px;left:50%;margin-left:-4px}
+.container{padding-bottom:1rem}
+.preview{display:block;height:1em;position:relative;width:2em}.preview .box{display:block;height:400%;left:0;position:absolute;top:0;-webkit-transform:scale(.25);-ms-transform:scale(.25);transform:scale(.25);-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:400%}
+.button,.container{width:100%}.button{color:#ccc;padding:.66em}.button .placeholderText{padding:0 2px}.button .placeholderTextOver{bottom:6px;color:var(--mm-gray-600);left:25%;position:absolute;width:50%}.button .placeholderTextRight{width:.625em}.button.active,.button:active,.button:hover{color:var(--mm-black)}.button.active .placeholderTextOver,.button:active .placeholderTextOver,.button:hover .placeholderTextOver{opacity:.6}.layout{height:120px;position:relative;width:80px}.type{display:-ms-flexbox;display:flex;height:40px;width:40px;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}
+.container .field{display:none;margin-bottom:0}.container .field:first-child{display:block}.container .field:first-child button{display:block;margin-left:auto}.container.active .field{display:block;margin-bottom:1rem}
+.container .field{display:none;margin-bottom:0}.container .field:first-child{display:block}.container .field:first-child button{display:block;margin-left:auto}.container.enabled .field{display:block;margin-bottom:1rem}
+.container{position:relative}.container .input::-webkit-inner-spin-button,.container .input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none}.container .input{-moz-appearance:textfield;margin-left:auto;padding-right:20px;width:100%}
+.container{width:100%}.button{-ms-flex:none!important;flex:none!important;height:60px;padding:4px!important;width:40px}.layout{position:relative;width:100%}
+.item{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}
+.preview{@include background-grid(4px, var(--mm-gray-300));border:1px solid var(--mm-black);display:block}.preview .color{display:block;height:1.3em;width:1.3em}.picker label{color:#fff!important}.picker>div{overflow:hidden}.picker>div>div:nth-child(2)>div:first-child>div{-webkit-box-shadow:0 0 0 1px hsla(0,0%,100%,.25);box-shadow:0 0 0 1px hsla(0,0%,100%,.25);margin:0 1px}.picker>div>div:nth-child(2)>div:last-child{-webkit-box-shadow:0 0 0 1px hsla(0,0%,100%,.25);box-shadow:0 0 0 1px hsla(0,0%,100%,.25);margin-right:1px}.picker>div>div:nth-child(3),.picker>div>div:nth-child(3) input{text-align:center}.picker>div>div:nth-child(4){border-top-color:rgba(#EEE,.2)!important}
+
+.container .field{display:none;margin-bottom:0}.container .field:first-child{display:block}.container .field:first-child button{display:block;margin-left:auto}.container.active .field{display:block;margin-bottom:1rem}
+.container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%}.container .button{-ms-flex-positive:1;flex-grow:1;padding:20px 0}.container .frame{border:1px solid var(--mm-gray-400);margin:0 auto;max-width:50px;width:100%}.container .frame .shape{padding-bottom:150%;position:relative;width:100%}.container .frame .inner{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;left:0;position:absolute;top:0;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:2px}.container .frame .media{background:var(--mm-gray-400);height:30px;width:100%}.container .frame.cover .media{height:100%;-o-object-fit:cover;object-fit:cover}.container .frame.contain .media{-o-object-fit:contain;object-fit:contain}.container .frame.fill .media{height:100%;-o-object-fit:fill;object-fit:fill}.container .frame.none .media{height:0;-o-object-fit:none;object-fit:none}
+.container{position:relative}.container .input::-webkit-inner-spin-button,.container .input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none}.container .input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;margin-left:auto;max-width:80px;padding-right:20px}.container .arrow{display:-ms-flexbox;display:flex;height:100%;pointer-events:none;position:absolute;right:4px;top:0;width:20px}.container .arrowIcon{font-size:10px;margin:auto}.container .clearButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:inherit;cursor:pointer;display:inline-block;font-family:inherit;padding:0;position:relative;position:absolute;right:8px;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);z-index:1}.container .dataListItems{background-color:var(--mm-gray-700);border-radius:4px;left:0;list-style-type:none;padding:2px 0;position:absolute;top:100%;width:100%;z-index:2}.container .dataListItem{padding:0 2px;width:100%}.container .dataListItemButton{background-color:rgba(28,28,28,0);border:0;color:var(--mm-white);text-align:left;width:100%}.container .dataListItemButton:hover{background-color:rgba(28,28,28,.1)}.container.fullWidth .input{max-width:none}
+.item{width:calc(50% - .5em)}.item+.item{margin-left:1em}.button{padding-left:.5em;padding-right:.5em}
+.container .autoComplete{margin-bottom:10px;position:relative}.container .address{text-align:left}.container .map{border-radius:4px;height:200px;margin-bottom:5px;overflow:hidden;position:relative}.container .pin{bottom:50%;left:50%;margin-left:-15px;pointer-events:none;position:absolute;width:30px}.container .infos{margin-bottom:20px}.container .coords{display:-ms-flexbox;display:flex;margin:0 -5px}.container .coord{margin:0 5px;width:100%}
+.container{width:100%}.container .button{padding:4px}.container .grid{border:2px solid var(--mm-gray-400);height:80px;width:50px}.container .column{background:var(--mm-gray-100);border:1px solid var(--mm-gray-400)}
+.container{margin:0}
+.keypad{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100px;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.keypad,.preview{position:relative}.preview{height:0;padding-bottom:100%}.oneColumn .preview{padding-bottom:25%}.buttonVisual{width:100%}.layoutLabelTop .buttonLabel{-ms-flex-order:1;order:1}.layoutLabelTop .buttonVisual{-ms-flex-order:2;order:2}.layoutLabelOver .buttonLabel,.layoutNoLabel .buttonLabel{display:none}.layoutLabelOver .buttonVisual,.layoutNoLabel .buttonVisual{height:100%;width:100%!important}.layoutLabelOver .thumbnail,.layoutNoLabel .thumbnail{max-height:none;width:100%!important}.withSquareItems .layoutLabelOver .thumbnail,.withSquareItems .layoutNoLabel .thumbnail{height:100%;left:0;position:absolute;top:0;width:100%}.layoutLabelOver .buttonVisual{z-index:1}.layoutLabelOver .buttonLabel{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(28,28,28,0)),to(rgba(28,28,28,.75)));background-image:linear-gradient(180deg,rgba(28,28,28,0),rgba(28,28,28,.75));bottom:0;display:block;height:100%;height:auto;left:0;position:absolute;top:0;top:auto;width:100%;z-index:2}
+.previewKeypad{width:30px}.previewKey{height:0;padding-bottom:100%;position:relative}.oneColumn .previewKey{padding-bottom:25%}.previewButton{background-color:var(--mm-white);height:100%;left:0;position:absolute;top:0;width:100%}
+.container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%;-ms-flex-align:center;align-items:center}.container .icon{margin-right:calc(var(--mm-spacer)/4)}.container .slider{-ms-flex-positive:1;flex-grow:1}
+.field-with-form{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;white-space:nowrap;&>*{display:block;margin-right:calc(var(--mm-spacer)/2);&:last-child{margin-right:0}}& .noValue{color:var(--mm-gray-400)}& .noValue,& .value{overflow:hidden;text-overflow:ellipsis}& .value{font-family:var(--mm-font-family-monospace);font-size:.75rem}}.container .value{font-family:var(--mm-font-family-monospace)}.panel{padding:calc(var(--mm-spacer)/2)}
+.container .radios{display:-ms-flexbox;display:flex}.container .thumbnail{width:100%}.container .button{-ms-flex-positive:1;flex-grow:1;padding:4px}
+.preview{@include background-grid(4px, var(--mm-gray-300));border:1px solid var(--mm-black);display:block}.preview .color{display:block;height:1em;width:1em}.spacing{width:auto!important}.spacing label{color:#fff!important}
+.container{border:1px solid var(--mm-gray-500);display:grid;grid-template-columns:1fr 1fr 1fr;scrollbar-width:none}.container::-webkit-scrollbar{display:none}.container .button{border:0;border-radius:0!important}.rotateLeft{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.rotateRight{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}
+.container{width:100%}.container .button{-ms-flex:none!important;flex:none!important;padding:4px}.container .layout{height:60px;mix-blend-mode:difference;position:relative;width:40px}.container .screen{height:120px;-webkit-transform:scale(.5);-ms-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:80px}
+.custom-select{color:var(--mm-white)}.custom-select option{color:var(--mm-black)}.lightCaret{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23FFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E")}
+.container{width:100%}.button{color:#ccc;-ms-flex:none!important;flex:none!important}.button.active{color:var(--mm-black)}.type{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.icon{height:1.5em;width:1.5em}
+.container{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center}.container .icon{background-color:grey;border-radius:50%;height:20px;margin-right:10px;width:20px}
+.container{padding:0}.container .ck.ck-editor__editable,.container .ck.ck-editor__main .ck-editor__editable{background:var(--mm-input-bg);border:var(--mm-input-border-width) solid var(--mm-input-border-color);outline:none}.container .ck.ck-editor__editable:not(.ck-editor__nested-editable),.container .ck.ck-editor__main .ck-editor__editable:not(.ck-editor__nested-editable){border:1px solid transparent}.container .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners,.container .ck.ck-editor__main .ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners{border-radius:var(--mm-input-border-radius)}.container .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused,.container .ck.ck-editor__main .ck-editor__editable:not(.ck-editor__nested-editable).ck-focused{border:1px solid transparent;-webkit-box-shadow:0 0 0 4px var(--mm-input-btn-focus-color);box-shadow:0 0 0 4px var(--mm-input-btn-focus-color);outline:none}.container .ck.ck-editor__editable_inline{padding:var(--mm-input-btn-padding-y) var(--mm-input-btn-padding-x)}.container .ck.ck-editor__editable_inline>:first-child{margin-top:0}.container .ck.ck-editor__editable_inline>:last-child{margin-bottom:0}.container .ck.ck-content{color:var(--mm-white);font-family:Helvetica,Arial,sans-serif;font-size:16px;font-size:var(--mm-input-font-size);font-weight:400;line-height:1.3;line-height:var(--mm-input-line-height)}.container .ck.ck-content em,.container .ck.ck-content i{font-style:italic}.container .ck.ck-content b,.container .ck.ck-content strong{font-weight:700}.container .ck.ck-content p{margin-bottom:.5em;margin-top:.5em}.container .ck.ck-content mark{-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0}.container .ck.ck-content h2{font-size:2em}.container .ck.ck-content h3{font-size:1.75em}.container .ck.ck-content h4{font-size:1.5em}.container .ck.ck-content blockquote{padding:0 0 0 1em}.container .ck.ck-content img{display:block;height:auto;max-width:100%;width:auto}.container.size-sm .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners,.container.size-sm .ck.ck-editor__main .ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners{border-radius:var(--mm-input-border-radius-sm)}.container.size-sm .ck.ck-editor__editable_inline{padding:var(--mm-input-btn-padding-y-sm) var(--mm-input-btn-padding-x-sm)}.container.size-sm .ck.ck-content{font-size:var(--mm-input-font-size-sm)}.container.size-lg .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners,.container.size-lg .ck.ck-editor__main .ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners{border-radius:var(--mm-input-border-radius-lg)}.container.size-lg .ck.ck-editor__editable_inline{padding-bottom:var(--mm-input-btn-padding-y-lg);padding-top:var(--mm-input-btn-padding-y-lg)}.container.size-lg .ck.ck-content{font-size:var(--mm-input-font-size-lg)}
+.dialog{font-size:1rem;padding:.5rem;width:100vw!important}.dialog .selected{background-color:var(--mm-primary)}.dialog .editor{max-height:100%;position:relaive}.dialog .editor>div{min-height:100%;min-width:100%}.dialog .editor .ck.ck-editor__main{min-height:100%}.dialog .editor .ck.ck-editor__editable{min-height:260px}@media screen and (min-width:768px){.dialog{width:50vw!important}}.dialogBody>div{height:50vh;overflow:hidden;overflow-y:scroll}.previewButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;background-color:transparent;border:0;color:inherit;cursor:pointer;display:inline-block;font-family:inherit;padding:0;position:relative;width:100%}.preview{border-bottom:.4em solid var(--mm-input-bg);border-radius:var(--mm-input-border-radius);height:calc(1.4em + 1rem);overflow:hidden;pointer-events:none}.editor{--ck-color-base-background:#2b2b2b}.editor .ck.ck-editor__editable:not(.ck-editor__nested-editable){border:0}.editor .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused{border:0;-webkit-box-shadow:none;box-shadow:none;outline:none}
+.container{position:relative}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/fields",
-    "version": "0.3.824",
+    "version": "0.4.4",
     "private": false,
     "description": "",
     "keywords": [
@@ -35,16 +35,14 @@
     "style": "assets/css/styles.css",
     "exports": {
         ".": {
+            "types": "./es/index.d.ts",
             "import": "./es/index.js"
         },
         "./all": {
+            "types": "./es/all.d.ts",
             "require": "./lib/all.js",
             "import": "./es/all.js"
         },
-        "./scss/placeholders": "./scss/_placeholders.scss",
-        "./scss/placeholders.scss": "./scss/_placeholders.scss",
-        "./scss/styles": "./scss/styles.scss",
-        "./scss/styles.scss": "./scss/styles.scss",
         "./assets/css/styles": "./assets/css/styles.css",
         "./assets/css/styles.css": "./assets/css/styles.css"
     },
@@ -56,46 +54,44 @@
         "lib",
         "es",
         "assets",
-        "scss",
         "all.js"
     ],
     "scripts": {
-        "clean": "rm -rf es && rm -rf lib && rm -rf assets && rm -rf scss",
+        "clean": "rm -rf es && rm -rf lib && rm -rf assets",
         "prepublishOnly": "npm run build",
-        "build": "../../scripts/prepare-package.sh --scss"
+        "build": "../../scripts/prepare-package.sh --types"
     },
     "devDependencies": {
-        "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
-        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
+        "react": "^19.2.0",
+        "react-dom": "^18.3.0 || ^19.0.0"
     },
     "peerDependencies": {
-        "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
-        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
+        "react": "^19.2.0",
+        "react-dom": "^18.3.0 || ^19.0.0"
     },
     "dependencies": {
         "@babel/runtime": "^7.13.10",
-        "@ckeditor/ckeditor5-react": "^6.2.0",
+        "@ckeditor/ckeditor5-react": "^11.0.1",
         "@folklore/fetch": "^0.1.17",
         "@fortawesome/fontawesome-svg-core": "^6.5.2",
         "@fortawesome/free-solid-svg-icons": "^6.5.2",
         "@fortawesome/react-fontawesome": "^0.2.0",
-        "@micromag/ckeditor": "^0.3.811",
-        "@micromag/core": "^0.3.824",
-        "@micromag/data": "^0.3.824",
-        "@micromag/element-grid": "^0.3.824",
-        "@micromag/element-keypad": "^0.3.824",
-        "@micromag/element-map": "^0.3.824",
-        "@micromag/media-gallery": "^0.3.824",
-        "@panneau/uppy": "^3.0.162",
+        "@micromag/ckeditor": "^0.4.4",
+        "@micromag/core": "^0.4.4",
+        "@micromag/data": "^0.4.4",
+        "@micromag/element-grid": "^0.4.4",
+        "@micromag/element-keypad": "^0.4.4",
+        "@micromag/element-map": "^0.4.4",
+        "@micromag/media-gallery": "^0.4.4",
+        "@panneau/uppy": "^4.0.18",
         "classnames": "^2.2.6",
         "draft-js": "^0.11.7",
         "fuse.js": "^7.0.0",
-        "lodash": "^4.17.21",
-        "prop-types": "^15.7.2",
+        "lodash": "^4.17.23",
         "rc-slider": "^10.5.0",
         "rc-switch": "^4.1.0",
         "react-color": "^2.19.3",
-        "react-intl": "^6.6.4",
+        "react-intl": "^8.1.3",
         "react-select": "^5.8.0",
         "react-sortablejs": "^6.0.0",
         "tinycolor2": "^1.4.2",
@@ -105,5 +101,6 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "e266e480cdc5741c73160840affee2eac7e7c9de"
+    "gitHead": "04b8519c3a3ddace5a21497e22faa11865d57f6d",
+    "types": "es/index.d.ts"
 }

package/scss/_placeholders.scss

@@ -1,34 +0,0 @@
-@use 'sass:math';
-@import '~@micromag/core/scss/variables';
-@import '~@micromag/core/scss/mixins';
-
-%field-with-form {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-end;
-    width: 100%;
-    white-space: nowrap;
-
-    > * {
-        display: block;
-        margin-right: math.div($spacer, 2);
-
-        &:last-child {
-            margin-right: 0;
-        }
-    }
-
-    .noValue {
-        overflow: hidden;
-        color: $gray-400;
-        text-overflow: ellipsis;
-    }
-
-    .value {
-        overflow: hidden;
-        font-family: $font-family-monospace;
-        font-size: 0.75rem;
-        text-overflow: ellipsis;
-    }
-}

package/scss/styles.scss

@@ -1 +0,0 @@
-@import '~@micromag/fields/assets/css/styles.css';