@alxgrn/telefrag-ui 0.0.2 → 0.0.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.
- package/dist/assets/Button.css +1 -1
- package/dist/assets/DatePicker.css +1 -1
- package/dist/assets/Fieldset.css +1 -1
- package/dist/assets/Files.css +1 -1
- package/dist/assets/Form.css +1 -1
- package/dist/assets/Input.css +1 -1
- package/dist/assets/Modal.css +1 -1
- package/dist/assets/Popup.css +1 -1
- package/dist/assets/Select.css +1 -1
- package/dist/components/input/Input.js +9 -9
- package/package.json +1 -1
package/dist/assets/Button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-button-bg: var(--alxgrn-
|
|
1
|
+
:root{--alxgrn-button-bg: var(--alxgrn-border-dark);--alxgrn-button-color: white;--alxgrn-button-border: var(--alxgrn-border-dark);--alxgrn-button-bg-error: var(--alxgrn-border-error);--alxgrn-button-color-error: white;--alxgrn-button-border-error: var(--alxgrn-border-error);--alxgrn-button-bg-success: var(--alxgrn-border-success);--alxgrn-button-color-success: white;--alxgrn-button-border-success: var(--alxgrn-border-success);--alxgrn-button-bg-accent: var(--alxgrn-border-accent);--alxgrn-button-color-accent: white;--alxgrn-button-border-accent: var(--alxgrn-border-accent)}[data-theme=dark]{--alxgrn-button-color: #ccc;--alxgrn-button-color-error: #ccc;--alxgrn-button-color-success: #ccc;--alxgrn-button-color-accent: #ccc}.Button,.Button.Default{cursor:pointer;color:var(--alxgrn-button-color);background-color:var(--alxgrn-button-bg);display:inline-block;margin:0;padding:var(--alxgrn-unit-half) var(--alxgrn-unit-double);text-align:center;width:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--alxgrn-unit-small);opacity:.9}.Button:hover{opacity:1}.Button.Disabled,.Button.Disabled:hover{cursor:default;opacity:.5}.Button.Success{color:var(--alxgrn-button-color-success);border-color:var(--alxgrn-button-border-success);background-color:var(--alxgrn-button-bg-success)}.Button.Error{color:var(--alxgrn-button-color-error);border-color:var(--alxgrn-button-border-error);background-color:var(--alxgrn-button-bg-error)}.Button.Accent{color:var(--alxgrn-button-color-accent);border-color:var(--alxgrn-button-border-accent);background-color:var(--alxgrn-button-bg-accent)}.Button.Small{font-size:var(--alxgrn-font-small);padding:var(--alxgrn-unit-small) var(--alxgrn-unit)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-datepicker-bg: transparent;--alxgrn-datepicker-bg-day: var(--alxgrn-bg-light);--alxgrn-datepicker-bg-menu: var(--alxgrn-bg-
|
|
1
|
+
:root{--alxgrn-datepicker-bg: transparent;--alxgrn-datepicker-bg-day: var(--alxgrn-bg-light);--alxgrn-datepicker-bg-menu: var(--alxgrn-bg-light);--alxgrn-datepicker-bg-hover: var(--alxgrn-bg-active);--alxgrn-datepicker-bg-select: var(--alxgrn-bg-dark);--alxgrn-datepicker-color: var(--alxgrn-color-text);--alxgrn-datepicker-color-accent: var(--alxgrn-color-accent);--alxgrn-datepicker-color-select: white;--alxgrn-datepicker-border: transparent}.FormDatePicker{display:grid;gap:var(--alxgrn-unit-smallest);width:fit-content;overflow:hidden;border:1px solid var(--alxgrn-datepicker-border);border-radius:var(--alxgrn-unit-small);padding:var(--alxgrn-unit-small)}.FormDatePicker *{margin:0;padding:0;text-align:center;color:var(--alxgrn-datepicker-color);background-color:var(--alxgrn-datepicker-bg);line-height:var(--alxgrn-unit-double);-webkit-user-select:none;user-select:none}.FormDatePicker .FormDatePickerMenu{display:grid;grid-template-columns:repeat(7,var(--alxgrn-unit-double));text-transform:capitalize;background-color:var(--alxgrn-datepicker-bg-menu);gap:var(--alxgrn-unit-smallest);border-radius:var(--alxgrn-unit-small);overflow:hidden}.FormDatePicker .FormDatePickerMenu .FormDatePickerText{grid-column:span 5;font-size:smaller}.FormDatePicker .FormDatePickerMenu .FormDatePickerPrev,.FormDatePicker .FormDatePickerMenu .FormDatePickerNext{color:var(--alxgrn-datepicker-color-accent);cursor:pointer}.FormDatePicker .FormDatePickerMenu .FormDatePickerPrev:hover,.FormDatePicker .FormDatePickerMenu .FormDatePickerNext:hover{background-color:var(--alxgrn-datepicker-bg-hover)}.FormDatePicker .FormDatePickerDays{display:grid;grid-template-columns:repeat(7,var(--alxgrn-unit-double));gap:var(--alxgrn-unit-smallest);font-size:smaller}.FormDatePicker .FormDatePickerDays span{background-color:var(--alxgrn-datepicker-bg-day);overflow:hidden;cursor:pointer;border-radius:var(--alxgrn-unit-small)}.FormDatePicker .FormDatePickerDays span:hover{background-color:var(--alxgrn-datepicker-bg-hover)}.FormDatePicker .FormDatePickerDays span.Empty{cursor:default;background-color:var(--alxgrn-datepicker-bg)}.FormDatePicker .FormDatePickerDays span.Selected{color:var(--alxgrn-datepicker-color-select);background-color:var(--alxgrn-datepicker-bg-select)}.FormDatePicker .FormDatePickerDays span.Current{color:var(--alxgrn-datepicker-color-accent);font-weight:700}
|
package/dist/assets/Fieldset.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-fieldset-color: var(--alxgrn-color-accent);--alxgrn-fieldset-color-error: var(--alxgrn-color-error);--alxgrn-fieldset-color-top: var(--alxgrn-color-light);--alxgrn-fieldset-color-bottom: var(--alxgrn-color-light);--alxgrn-fieldset-color-disabled: var(--alxgrn-color-light);--alxgrn-fieldset-border: var(--alxgrn-
|
|
1
|
+
:root{--alxgrn-fieldset-color: var(--alxgrn-color-accent);--alxgrn-fieldset-color-error: var(--alxgrn-color-error);--alxgrn-fieldset-color-top: var(--alxgrn-color-light);--alxgrn-fieldset-color-bottom: var(--alxgrn-color-light);--alxgrn-fieldset-color-disabled: var(--alxgrn-color-light);--alxgrn-fieldset-border: var(--alxgrn-border-accent);--alxgrn-fieldset-border-error: var(--alxgrn-border-error);--alxgrn-fieldset-border-disabled: var(--alxgrn-border-light)}.Form .Fieldset{display:block;margin:var(--alxgrn-unit) 0}.Form .Fieldset .FormItem{margin:0 0 var(--alxgrn-unit-half) 0}.Form .Fieldset .FormItem:last-child{margin-bottom:0}.Form .Fieldset .Label{color:var(--alxgrn-fieldset-color);margin-bottom:var(--alxgrn-unit-small)}.Form .Fieldset .Inner{border:1px solid var(--alxgrn-fieldset-border);padding:var(--alxgrn-unit-half);border-radius:var(--alxgrn-unit-small)}.Form .Fieldset .Top,.Form .Fieldset .Bottom{font-size:smaller}.Form .Fieldset .Top{color:var(--alxgrn-fieldset-color-top);margin-bottom:var(--alxgrn-unit-small)}.Form .Fieldset .Bottom{color:var(--alxgrn-fieldset-color-bottom);margin-top:var(--alxgrn-unit-small)}.Form .Fieldset.Disabled .Label,.Form .Fieldset.Disabled .Top,.Form .Fieldset.Disabled .Bottom{color:var(--alxgrn-fieldset-color-disabled)}.Form .Fieldset.Disabled .Inner{border-color:var(--alxgrn-fieldset-border-disabled)}.Form .Fieldset.Error .Label,.Form .Fieldset.Error .Top,.Form .Fieldset.Error .Bottom{color:var(--alxgrn-fieldset-color-error)}.Form .Fieldset.Error .Inner{border-color:var(--alxgrn-fieldset-border-error)}
|
package/dist/assets/Files.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-files-bg: var(--alxgrn-
|
|
1
|
+
:root{--alxgrn-files-bg: var(--alxgrn-border-accent);--alxgrn-files-color: white;--alxgrn-files-bg-error: var(--alxgrn-border-error)}[data-theme=dark]{--alxgrn-files-color: #ccc}.Form ul.FileList{color:var(--alxgrn-color-text);margin:0 0 var(--alxgrn-unit-half) 0;padding:0 0 0 var(--alxgrn-unit)}.Form ul.FileList li{cursor:pointer}.Form ul.FileList li div{display:flex;align-items:baseline;flex-wrap:nowrap;gap:var(--alxgrn-unit);justify-content:space-between;padding-left:var(--alxgrn-unit-small);margin-bottom:var(--alxgrn-unit-small)}.Form ul.FileList li div span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.Form ul.FileList li div span:last-child{white-space:nowrap;font-size:smaller;color:var(--alxgrn-color-light)}.Form ul.FileList.Disabled li{cursor:default}.Form ul.FileList.Disabled li div span{cursor:default;color:var(--alxgrn-color-light)}.Form ul.FileList li::marker{content:"■";color:var(--alxgrn-color-accent)}.Form ul.FileList li:hover::marker{content:"✖︎";color:var(--alxgrn-color-error)}.Form ul.FileList.Disabled li::marker{content:"■";color:var(--alxgrn-color-light)}.Form .FileLabel{display:flex;align-items:center;gap:var(--alxgrn-unit);flex-wrap:nowrap}.Form .FileLabel input[type=file]{display:none}.Form .FileLabel label{flex:0 0 auto;padding:var(--alxgrn-unit-half) var(--alxgrn-unit);border-radius:var(--alxgrn-unit-small);margin:0;cursor:pointer;color:var(--alxgrn-files-color);background-color:var(--alxgrn-files-bg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.Form .FileLabel span{flex:1 1 auto;color:var(--alxgrn-color-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.Form .FileLabel.Disabled label{cursor:default;opacity:.5}.Form .FileLabel.Disabled span{color:var(--alxgrn-color-light)}.Form .FileLabel.Error label{background-color:var(--alxgrn-files-bg-error)}
|
package/dist/assets/Form.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
*{box-sizing:border-box;overflow-wrap:anywhere}:root{--alxgrn-unit: 16px;--alxgrn-unit-half: 8px;--alxgrn-unit-small: 4px;--alxgrn-unit-double: 32px;--alxgrn-unit-smallest: 2px;--alxgrn-font-size: 16px;--alxgrn-font-small: 12px;--alxgrn-line-height: 1.3;--alxgrn-font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;--alxgrn-color-text: #555;--alxgrn-color-dark: var(--alxgrn-color-text);--alxgrn-color-light: lightslategrey;--alxgrn-color-error: firebrick;--alxgrn-color-accent: steelblue;--alxgrn-color-active:
|
|
1
|
+
*{box-sizing:border-box;overflow-wrap:anywhere}:root{--alxgrn-unit: 16px;--alxgrn-unit-half: 8px;--alxgrn-unit-small: 4px;--alxgrn-unit-double: 32px;--alxgrn-unit-smallest: 2px;--alxgrn-font-size: 16px;--alxgrn-font-small: 12px;--alxgrn-line-height: 1.3;--alxgrn-font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;--alxgrn-color-text: #555;--alxgrn-color-dark: var(--alxgrn-color-text);--alxgrn-color-light: lightslategrey;--alxgrn-color-error: firebrick;--alxgrn-color-accent: steelblue;--alxgrn-color-active: var(--alxgrn-color-text);--alxgrn-color-success: forestgreen;--alxgrn-bg-main: #eee;--alxgrn-bg-panel: #fff;--alxgrn-bg-modal: var(--alxgrn-bg-panel);--alxgrn-bg-popup: var(--alxgrn-bg-panel);--alxgrn-bg-dark: #888;--alxgrn-bg-light: rgba(119, 136, 153, .1);--alxgrn-bg-error: rgba(178, 34, 34, .1);--alxgrn-bg-accent: rgba(70, 130, 180, .1);--alxgrn-bg-active: moccasin;--alxgrn-bg-success: rgba(34, 139, 34, .1);--alxgrn-border-dark: rgba(136, 136, 136, 1);--alxgrn-border-light: rgba(119, 136, 153, 1);--alxgrn-border-error: rgba(178, 34, 34, 1);--alxgrn-border-accent: rgba(70, 130, 180, 1);--alxgrn-border-active: moccasin;--alxgrn-border-success: rgba(34, 139, 34, 1)}[data-theme=dark]{--alxgrn-color-text: #999;--alxgrn-color-light: #666;--alxgrn-bg-main: #111;--alxgrn-bg-panel: #222;--alxgrn-bg-modal: #222;--alxgrn-bg-popup: #333;--alxgrn-bg-active: #444;--alxgrn-border-dark: rgba(136, 136, 136, .5);--alxgrn-border-light: rgba(119, 136, 153, .5);--alxgrn-border-error: rgba(178, 34, 34, .5);--alxgrn-border-accent: rgba(70, 130, 180, .5);--alxgrn-border-active: rgba(255, 228, 181, .5);--alxgrn-border-success: rgba(34, 139, 34, .5)}:root{--alxgrn-form-width: 512px;--alxgrn-form-width-wide: 1024px}.Form{max-width:var(--alxgrn-form-width)}.Form.FormWide{max-width:var(--alxgrn-form-width-wide)}.Form *{font-size:inherit;line-height:inherit;font-family:inherit;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.Form .FormItem{display:block;margin:var(--alxgrn-unit) 0}.FormSubmitButtons{margin-top:var(--alxgrn-unit-double);margin-bottom:0;display:flex;flex-wrap:nowrap;justify-content:space-between;gap:var(--alxgrn-unit)}
|
package/dist/assets/Input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-input-bg: var(--alxgrn-bg-accent);--alxgrn-input-color: var(--alxgrn-color-text);--alxgrn-input-
|
|
1
|
+
:root{--alxgrn-input-bg: var(--alxgrn-bg-accent);--alxgrn-input-color: var(--alxgrn-color-text);--alxgrn-input-caret: var(--alxgrn-color-text);--alxgrn-input-border: var(--alxgrn-border-accent);--alxgrn-input-bg-focus: var(--alxgrn-bg-active);--alxgrn-input-color-focus: var(--alxgrn-color-text);--alxgrn-input-caret-focus: var(--alxgrn-color-accent);--alxgrn-input-border-focus: var(--alxgrn-border-accent);--alxgrn-input-bg-error: var(--alxgrn-bg-error);--alxgrn-input-color-error: var(--alxgrn-color-error);--alxgrn-input-caret-error: var(--alxgrn-color-error);--alxgrn-input-border-error: var(--alxgrn-border-error);--alxgrn-input-bg-success: var(--alxgrn-bg-success);--alxgrn-input-color-success: var(--alxgrn-color-success);--alxgrn-input-caret-success: var(--alxgrn-color-success);--alxgrn-input-border-success: var(--alxgrn-border-success);--alxgrn-input-bg-disabled: var(--alxgrn-bg-light);--alxgrn-input-color-disabled: var(--alxgrn-color-light);--alxgrn-input-caret-disabled: var(--alxgrn-color-light);--alxgrn-input-border-disabled: var(--alxgrn-border-light);--alxgrn-input-color-placeholder: lightslategrey}.FormItem input[type=text],.FormItem input[type=password],.FormItem textarea{color:var(--alxgrn-input-color);padding:var(--alxgrn-unit-half);margin:0;font-size:inherit;line-height:inherit;font-family:inherit;caret-color:var(--alxgrn-input-caret);border-radius:var(--alxgrn-unit-small);border:1px solid var(--alxgrn-input-border);width:100%;display:block;background-color:var(--alxgrn-input-bg);appearance:none;-moz-appearance:none;-webkit-appearance:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.FormItem textarea{resize:vertical}.FormItem input[type=text]:focus,.FormItem input[type=password]:focus,.FormItem textarea:focus{outline:none;color:var(--alxgrn-input-color-focus);background-color:var(--alxgrn-input-bg-focus);border:1px solid var(--alxgrn-input-border-focus);caret-color:var(--alxgrn-input-caret-focus)}.FormItem input[type=text]::placeholder,.FormItem input[type=password]::placeholder,.FormItem textarea::placeholder{color:var(--alxgrn-input-color-placeholder);font-size:var(--alxgrn-unit)}.FormItem input[type=text]:disabled,.FormItem input[type=password]:disabled,.FormItem textarea:disabled{color:var(--alxgrn-input-color-disabled);border-color:var(--alxgrn-input-border-disabled);background-color:var(--alxgrn-input-bg-disabled);cursor:default;caret-color:var(--alxgrn-input-caret-disabled)}.FormItem input:read-only{cursor:pointer}
|
package/dist/assets/Modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-modal-zindex: 1000;--alxgrn-modal-shadow: 0 0 var(--alxgrn-unit-half) rgba(0,0,0,.1);--alxgrn-modal-bg-color: var(--alxgrn-bg-
|
|
1
|
+
:root{--alxgrn-modal-zindex: 1000;--alxgrn-modal-shadow: 0 0 var(--alxgrn-unit-half) rgba(0,0,0,.1);--alxgrn-modal-color: var(--alxgrn-color-text);--alxgrn-modal-bg-color: var(--alxgrn-bg-modal);--alxgrn-modal-animation-length: .1s;--alxgrn-modal-width: 512px;--alxgrn-modal-color-close: var(--alxgrn-color-light);--alxgrn-modal-color-accent: var(--alxgrn-color-accent);--alxgrn-modal-color-scroll: var(--alxgrn-color-light)}.Modal{z-index:var(--alxgrn-modal-zindex);position:fixed;top:0;left:0;right:0;bottom:0;padding:var(--alxgrn-unit);background-color:#00000080;overflow:hidden;display:flex;align-items:center;justify-content:center}.Modal *{color:var(--alxgrn-modal-color);font-size:inherit;line-height:inherit;font-family:inherit;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.Modal .ModalInner{display:flex;padding:var(--alxgrn-unit-double) var(--alxgrn-unit) var(--alxgrn-unit-double) var(--alxgrn-unit-double);position:relative;background-color:var(--alxgrn-modal-bg-color);width:var(--alxgrn-modal-width);max-height:100%;border-radius:var(--alxgrn-unit-half);overflow:auto}.Modal .ModalInner .ModalContent{width:100%;overflow:auto;padding-right:var(--alxgrn-unit)}.Modal .ModalInner .ModalContent .Form{max-width:100%;margin-bottom:0}.Modal .ModalInner .ModalClose{position:absolute;top:var(--alxgrn-unit);right:var(--alxgrn-unit);width:var(--alxgrn-unit);height:var(--alxgrn-unit);cursor:pointer}.Modal .ModalInner .ModalClose span{position:absolute;background-color:var(--alxgrn-modal-color-close);display:inline-block;border-radius:2px;width:2px;height:var(--alxgrn-unit);top:0;left:0;transform:translate(var(--alxgrn-unit-half)) rotate(45deg)}.Modal .ModalInner .ModalClose span:nth-child(2){transform:translate(var(--alxgrn-unit-half)) rotate(135deg)}.Modal .ModalInner .ModalClose:hover span{background-color:var(--alxgrn-modal-color-accent)}@media (max-width: 512px){.Modal .ModalInner{width:100%;border-radius:var(--alxgrn-unit-half);padding:calc(var(--alxgrn-unit-half) * 3) var(--alxgrn-unit-half) var(--alxgrn-unit) var(--alxgrn-unit)}.Modal .ModalInner .ModalClose{top:var(--alxgrn-unit-half);right:var(--alxgrn-unit-half)}.Modal .ModalInner .ModalContent{padding-right:var(--alxgrn-unit-half)}}.Modal-enter{pointer-events:none;background-color:#0000}.Modal-enter-active{pointer-events:none;background-color:#00000080;transition:background-color var(--alxgrn-modal-animation-length) ease-in}.Modal-enter-done{pointer-events:auto;background-color:#00000080}.Modal-exit{pointer-events:none;background-color:#00000080}.Modal-exit-active{pointer-events:none;background-color:#0000;transition:background-color var(--alxgrn-modal-animation-length) ease-out}.Modal-exit-done{pointer-events:auto;background-color:#0000}.Modal-enter .ModalInner{pointer-events:none;opacity:0;transform:scale(.8)}.Modal-enter-active .ModalInner{pointer-events:none;opacity:1;transform:scale(1);transition:opacity var(--alxgrn-modal-animation-length) ease-in,transform var(--alxgrn-modal-animation-length) ease-in}.Modal-exit .ModalInner{pointer-events:none;opacity:1;transform:scale(1)}.Modal-exit-active .ModalInner{pointer-events:none;opacity:0;transform:scale(.8);transition:opacity var(--alxgrn-modal-animation-length) ease-out,transform var(--alxgrn-modal-animation-length) ease-out}.Modal .ModalInner .ModalContent{scrollbar-color:transparent var(--alxgrn-modal-color-scroll);scrollbar-width:thin}.Modal .ModalInner .ModalContent::-webkit-scrollbar{width:var(--alxgrn-unit-small);height:var(--alxgrn-unit-small)}.Modal .ModalInner .ModalContent::-webkit-scrollbar-track{background-color:transparent;border-radius:var(--alxgrn-unit-small)}.Modal .ModalInner .ModalContent::-webkit-scrollbar-thumb{background-color:var(--alxgrn-modal-color-scroll);border-radius:var(--alxgrn-unit-small)}.Modal .ModalInner .ModalContent::-webkit-scrollbar-corner{background-color:transparent}
|
package/dist/assets/Popup.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-popup-zindex: 2000;--alxgrn-popup-shadow: 0 0 var(--alxgrn-unit-half) rgba(0,0,0,.1);--alxgrn-popup-bg-color:
|
|
1
|
+
:root{--alxgrn-popup-zindex: 2000;--alxgrn-popup-shadow: 0 0 var(--alxgrn-unit-half) rgba(0,0,0,.1);--alxgrn-popup-color: var(--alxgrn-color-text);--alxgrn-popup-bg-color: var(--alxgrn-bg-popup);--alxgrn-popup-animation-length: .1s}.Popup{z-index:var(--alxgrn-popup-zindex);position:absolute}.Popup *{color:var(--alxgrn-popup-color);font-size:inherit;line-height:inherit;font-family:inherit;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.Popup .PopupInner{position:absolute;background-color:var(--alxgrn-popup-bg-color);border-radius:var(--alxgrn-unit-half);box-shadow:var(--alxgrn-popup-shadow);overflow:hidden;display:flex}.Popup-enter{pointer-events:none;opacity:0;transform:scale(.8)}.Popup-enter-active{pointer-events:none;opacity:1;transform:scale(1);transition:opacity var(--alxgrn-popup-animation-length) ease-in,transform var(--alxgrn-popup-animation-length) ease-in}.Popup-exit{pointer-events:none;opacity:1;transform:scale(1)}.Popup-exit-active{pointer-events:none;opacity:0;transform:scale(.8);transition:opacity var(--alxgrn-popup-animation-length) ease-out,transform var(--alxgrn-popup-animation-length) ease-out}
|
package/dist/assets/Select.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--alxgrn-select-bg: var(--alxgrn-bg-accent);--alxgrn-select-color: var(--alxgrn-color-text);--alxgrn-select-border: var(--alxgrn-
|
|
1
|
+
:root{--alxgrn-select-bg: var(--alxgrn-bg-accent);--alxgrn-select-color: var(--alxgrn-color-text);--alxgrn-select-border: var(--alxgrn-border-accent);--alxgrn-select-bg-focus: var(--alxgrn-bg-active);--alxgrn-select-color-focus: var(--alxgrn-color-text);--alxgrn-select-border-focus: var(--alxgrn-border-accent);--alxgrn-select-bg-error: var(--alxgrn-bg-error);--alxgrn-select-color-error: var(--alxgrn-color-error);--alxgrn-select-border-error: var(--alxgrn-border-error);--alxgrn-select-bg-success: var(--alxgrn-bg-success);--alxgrn-select-color-success: var(--alxgrn-color-success);--alxgrn-select-border-success: var(--alxgrn-border-success);--alxgrn-select-bg-disabled: var(--alxgrn-bg-light);--alxgrn-select-color-disabled: var(--alxgrn-color-light);--alxgrn-select-border-disabled: var(--alxgrn-border-light)}.FormItem select{color:var(--alxgrn-select-color);padding:var(--alxgrn-unit-half);margin:0;font-size:inherit;line-height:inherit;font-family:inherit;border-radius:var(--alxgrn-unit-small);border:1px solid var(--alxgrn-select-border);width:100%;display:block;background-color:var(--alxgrn-select-bg);appearance:none;-moz-appearance:none;-webkit-appearance:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.FormItem select:focus{outline:none;color:var(--alxgrn-select-color-focus);background-color:var(--alxgrn-select-bg-focus);border:1px solid var(--alxgrn-select-border-focus)}.FormItem select:disabled{color:var(--alxgrn-select-color-disabled);border-color:var(--alxgrn-select-border-disabled);background-color:var(--alxgrn-select-bg-disabled);cursor:default}.FormItem select{padding-right:var(--alxgrn-unit-double);cursor:pointer}.FormItem .SelectWrap{position:relative}.FormItem .SelectWrap:before{content:"";position:absolute;width:0;height:0;border:var(--alxgrn-unit-small) solid transparent;border-top-color:var(--alxgrn-select-border);top:var(--alxgrn-unit);right:calc(var(--alxgrn-unit) - var(--alxgrn-unit-small));cursor:pointer;pointer-events:none}.FormItem .SelectWrap.Disabled:before{border-top-color:var(--alxgrn-select-border-disabled);cursor:default}.FormItem .SelectWrap.Error:before{border-top-color:var(--alxgrn-select-border-error)}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { jsx as a, jsxs as
|
|
1
|
+
import { jsx as a, jsxs as b } from "react/jsx-runtime";
|
|
2
2
|
import C from "../label/Label.js";
|
|
3
3
|
import '../../assets/Input.css';const F = ({
|
|
4
4
|
id: s,
|
|
5
5
|
type: e = "text",
|
|
6
6
|
value: t,
|
|
7
7
|
onChange: x,
|
|
8
|
-
label:
|
|
8
|
+
label: h,
|
|
9
9
|
placeholder: n,
|
|
10
10
|
rows: l = 5,
|
|
11
|
-
top:
|
|
12
|
-
bottom:
|
|
11
|
+
top: m,
|
|
12
|
+
bottom: p,
|
|
13
13
|
autoFocus: u = !1,
|
|
14
14
|
required: f = !1,
|
|
15
15
|
disabled: o = !1,
|
|
@@ -17,19 +17,19 @@ import '../../assets/Input.css';const F = ({
|
|
|
17
17
|
}) => {
|
|
18
18
|
const i = () => !!(f && !t.trim().length), c = () => {
|
|
19
19
|
if (i()) return {
|
|
20
|
-
caretColor: "var(--alxgrn-input-
|
|
20
|
+
caretColor: "var(--alxgrn-input-caret-error)",
|
|
21
21
|
borderColor: "var(--alxgrn-input-border-error)",
|
|
22
22
|
backgroundColor: "var(--alxgrn-input-bg-error)"
|
|
23
23
|
};
|
|
24
24
|
}, d = (r) => {
|
|
25
25
|
g && (r = r.substring(0, g)), x(r);
|
|
26
26
|
};
|
|
27
|
-
return /* @__PURE__ */ a("div", { className: "FormItem", children: /* @__PURE__ */
|
|
27
|
+
return /* @__PURE__ */ a("div", { className: "FormItem", children: /* @__PURE__ */ b(
|
|
28
28
|
C,
|
|
29
29
|
{
|
|
30
|
-
top:
|
|
31
|
-
bottom:
|
|
32
|
-
label:
|
|
30
|
+
top: m,
|
|
31
|
+
bottom: p,
|
|
32
|
+
label: h,
|
|
33
33
|
required: f,
|
|
34
34
|
disabled: o,
|
|
35
35
|
error: i(),
|
package/package.json
CHANGED