@ltht-react/input 2.0.194 → 2.0.198

package/lib/atoms/checkbox.d.ts

@@ -0,0 +1,8 @@
+import { FC, HTMLAttributes, InputHTMLAttributes } from 'react';
+declare const Checkbox: FC<Props>;
+interface Props extends InputHTMLAttributes<HTMLInputElement> {
+    children: React.ReactNode;
+    parentDivAttributes?: HTMLAttributes<HTMLDivElement>;
+    labelAttributes?: HTMLAttributes<HTMLLabelElement>;
+}
+export default Checkbox;

package/lib/atoms/checkbox.js

@@ -0,0 +1,47 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = __importDefault(require("@emotion/styled"));
+var styles_1 = require("@ltht-react/styles");
+var react_1 = require("@emotion/react");
+var StyledCheckbox = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  ", "\n"], ["\n  display: flex;\n  align-items: center;\n  ", "\n"])), function (props) {
+    return props.checked && (0, react_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      background-color: ", ";\n    "], ["\n      background-color: ", ";\n    "])), styles_1.INPUT_COLOURS.RADIO_SELECTED);
+});
+var StyledInput = styled_1.default.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  appearance: none;\n  height: 1.2em;\n  margin: 0;\n  margin-right: 0.5em;\n  position: relative;\n  width: 1em;\n\n  &:before {\n    border: solid 1px grey;\n    border-radius: 3px;\n    content: '';\n    display: inline-block;\n    height: 1em;\n    width: 1em;\n  }\n\n  &:checked:before {\n    background-color: ", ";\n    content: '';\n    color: white;\n  }\n\n  &:checked:after {\n    color: white;\n    content: '\\2714';\n    font-size: 0.8em;\n    height: 1em;\n    left: 0.25em;\n    position: absolute;\n    top: 0;\n    width: 1em;\n  }\n"], ["\n  appearance: none;\n  height: 1.2em;\n  margin: 0;\n  margin-right: 0.5em;\n  position: relative;\n  width: 1em;\n\n  &:before {\n    border: solid 1px grey;\n    border-radius: 3px;\n    content: '';\n    display: inline-block;\n    height: 1em;\n    width: 1em;\n  }\n\n  &:checked:before {\n    background-color: ", ";\n    content: '';\n    color: white;\n  }\n\n  &:checked:after {\n    color: white;\n    content: '\\\\2714';\n    font-size: 0.8em;\n    height: 1em;\n    left: 0.25em;\n    position: absolute;\n    top: 0;\n    width: 1em;\n  }\n"])), styles_1.BADGE_COLOURS.PRIMARY);
+var StyledLabel = styled_1.default.label(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: inline-block;\n  margin-bottom: 0;\n"], ["\n  display: inline-block;\n  margin-bottom: 0;\n"])));
+var Checkbox = function (_a) {
+    var id = _a.id, _b = _a.checked, checked = _b === void 0 ? false : _b, onChange = _a.onChange, children = _a.children, name = _a.name, _c = _a.parentDivAttributes, parentDivAttributes = _c === void 0 ? {} : _c, _d = _a.labelAttributes, labelAttributes = _d === void 0 ? {} : _d, rest = __rest(_a, ["id", "checked", "onChange", "children", "name", "parentDivAttributes", "labelAttributes"]);
+    return ((0, jsx_runtime_1.jsxs)(StyledCheckbox, __assign({ checked: checked }, parentDivAttributes, { children: [(0, jsx_runtime_1.jsx)(StyledInput, __assign({ id: id, onChange: onChange, type: "checkbox", checked: checked, "aria-checked": checked, role: "checkbox", name: name }, rest)), (0, jsx_runtime_1.jsx)(StyledLabel, __assign({ htmlFor: id }, labelAttributes, { children: children }))] })));
+};
+exports.default = Checkbox;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+//# sourceMappingURL=checkbox.js.map

package/lib/atoms/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../src/atoms/checkbox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,2DAAoC;AACpC,6CAAiE;AACjE,wCAAoC;AAEpC,IAAM,cAAc,GAAG,gBAAM,CAAC,GAAG,yHAAmB,gDAGhD,EAIC,IACJ,KALG,UAAC,KAAK;IACN,OAAA,KAAK,CAAC,OAAO,QACb,WAAG,2GAAA,4BACmB,EAA4B,SACjD,KADqB,sBAAa,CAAC,cAAc,CACjD;AAHD,CAGC,CACJ,CAAA;AAED,IAAM,WAAW,GAAG,gBAAM,CAAC,KAAK,+mBAAA,iUAkBR,EAAqB,2OAe5C,KAfuB,sBAAa,CAAC,OAAO,CAe5C,CAAA;AAED,IAAM,WAAW,GAAG,gBAAM,CAAC,KAAK,sHAAA,mDAG/B,IAAA,CAAA;AAED,IAAM,QAAQ,GAAc,UAAC,EAS5B;IARC,IAAA,EAAE,QAAA,EACF,eAAe,EAAf,OAAO,mBAAG,KAAK,KAAA,EACf,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,IAAI,UAAA,EACJ,2BAAwB,EAAxB,mBAAmB,mBAAG,EAAE,KAAA,EACxB,uBAAoB,EAApB,eAAe,mBAAG,EAAE,KAAA,EACjB,IAAI,cARoB,2FAS5B,CADQ;IACH,OAAA,CACJ,wBAAC,cAAc,aAAC,OAAO,EAAE,OAAO,IAAM,mBAAmB,eACvD,uBAAC,WAAW,aACV,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,OAAO,kBACF,OAAO,EACrB,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,IACN,IAAI,EACR,EACF,uBAAC,WAAW,aAAC,OAAO,EAAE,EAAE,IAAM,eAAe,cAC1C,QAAQ,IACG,KACC,CAClB,CAAA;CAAA,CAAA;AAWD,kBAAe,QAAQ,CAAA"}

package/lib/atoms/daypicker.d.ts

@@ -0,0 +1,24 @@
+import { FC, HTMLAttributes } from 'react';
+declare const Daypicker: FC<DaypickerProps>;
+export interface DaypickerProps extends HTMLAttributes<HTMLDivElement> {
+    initialDate?: Date;
+    pickerOpen?: boolean | undefined;
+    showIcon: boolean;
+    dayFormat: string;
+    label?: string;
+    minDate?: Date | undefined;
+    maxDate?: Date | undefined;
+    /**
+     * The number of displayed months in navigation. Defaults to `1`.
+     */
+    navigationNumberOfMonths?: number | undefined;
+    /**
+     * Executes whenever a day is selected from picker
+     */
+    changeHandler?: (day: Date | undefined) => void | undefined;
+    /**
+     * Executes when the button icon clicked
+     */
+    buttonHandler?: (datepickerOpen: boolean) => void | undefined;
+}
+export default Daypicker;

package/lib/atoms/daypicker.js

@@ -0,0 +1,113 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = __importDefault(require("@emotion/styled"));
+var react_day_picker_1 = require("react-day-picker");
+var styles_1 = require("@ltht-react/styles");
+var button_1 = require("@ltht-react/button");
+var react_popper_1 = require("react-popper");
+var date_fns_1 = require("date-fns");
+var focus_trap_react_1 = __importDefault(require("focus-trap-react"));
+var icon_1 = __importDefault(require("@ltht-react/icon"));
+var StyledDialogSheet = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  z-index: 1;\n  background: white;\n  border-radius: 4px;\n  box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.04), 0px 4px 5px rgba(0, 0, 0, 0.06), 0px 2px 4px -1px rgba(0, 0, 0, 0.09);\n"], ["\n  z-index: 1;\n  background: white;\n  border-radius: 4px;\n  box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.04), 0px 4px 5px rgba(0, 0, 0, 0.06), 0px 2px 4px -1px rgba(0, 0, 0, 0.09);\n"])));
+var DayPickerLabel = styled_1.default.small(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), styles_1.TEXT_COLOURS.SECONDARY.LIGHTER25);
+var DayPickerInput = styled_1.default.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  :focus-visible {\n    outline-color: ", ";\n    outline-style: auto;\n    outline-width: 1px;\n  }\n"], ["\n  :focus-visible {\n    outline-color: ", ";\n    outline-style: auto;\n    outline-width: 1px;\n  }\n"])), styles_1.BTN_COLOURS.PRIMARY.VALUE);
+var InputContainer = styled_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  margin-right: ", ";\n  height: 1.5rem;\n"], ["\n  display: flex;\n  margin-right: ", ";\n  height: 1.5rem;\n"])), function (_a) {
+    var showIcon = _a.showIcon;
+    return (showIcon ? '0rem;' : '2rem;');
+});
+var StyledButton = (0, styled_1.default)(button_1.Button)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: relative;\n  right: 2rem;\n  width: 2rem !important;\n"], ["\n  position: relative;\n  right: 2rem;\n  width: 2rem !important;\n"])));
+var StyledDayPicker = (0, styled_1.default)(react_day_picker_1.DayPicker)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  button.rdp-button:hover:not([aria-disabled='true']) {\n    background-color: ", ";\n  }\n\n  button.rdp-day_selected: not([aria-disabled= 'true' ]), button.rdp-day_selected:not([aria-disabled='true']),\n  button.rdp-day_selected:focus:not([aria-disabled='true']),\n  button.rdp-day_selected:active:not([aria-disabled='true']),\n  button.rdp-day_selected:hover:not([aria-disabled='true']) {\n    color: white;\n    background-color: ", ";\n  }\n\n  button.rdp-button:focus, button.rdp-button:active {\n    border-color: ", ";\n  }\n"], ["\n  button.rdp-button:hover:not([aria-disabled='true']) {\n    background-color: ", ";\n  }\n\n  button.rdp-day_selected: not([aria-disabled= 'true' ]), button.rdp-day_selected:not([aria-disabled='true']),\n  button.rdp-day_selected:focus:not([aria-disabled='true']),\n  button.rdp-day_selected:active:not([aria-disabled='true']),\n  button.rdp-day_selected:hover:not([aria-disabled='true']) {\n    color: white;\n    background-color: ", ";\n  }\n\n  button.rdp-button:focus, button.rdp-button:active {\n    border-color: ", ";\n  }\n"])), styles_1.TRANSLUCENT_DARK_BLUE, styles_1.BTN_COLOURS.PRIMARY.VALUE, styles_1.BTN_COLOURS.PRIMARY.VALUE);
+var Daypicker = function (_a) {
+    var initialDate = _a.initialDate, pickerOpen = _a.pickerOpen, showIcon = _a.showIcon, dayFormat = _a.dayFormat, label = _a.label, minDate = _a.minDate, maxDate = _a.maxDate, _b = _a.navigationNumberOfMonths, navigationNumberOfMonths = _b === void 0 ? 1 : _b, changeHandler = _a.changeHandler, buttonHandler = _a.buttonHandler;
+    var _c = (0, react_1.useState)(initialDate), selected = _c[0], setSelected = _c[1];
+    var _d = (0, react_1.useState)((0, date_fns_1.format)(initialDate !== null && initialDate !== void 0 ? initialDate : new Date(), dayFormat)), inputValue = _d[0], setInputValue = _d[1];
+    var _f = (0, react_1.useState)(pickerOpen !== null && pickerOpen !== void 0 ? pickerOpen : false), isPopperOpen = _f[0], setIsPopperOpen = _f[1];
+    var disabledDays = [];
+    if (minDate) {
+        var disabledBefore = {
+            before: minDate,
+        };
+        disabledDays.push(disabledBefore);
+    }
+    if (maxDate) {
+        var disabledAfter = {
+            after: maxDate,
+        };
+        disabledDays.push(disabledAfter);
+    }
+    var popperRef = (0, react_1.useRef)(null);
+    var _g = (0, react_1.useState)(null), popperElement = _g[0], setPopperElement = _g[1];
+    var popper = (0, react_popper_1.usePopper)(popperRef.current, popperElement, {
+        placement: 'bottom-start',
+    });
+    var closePopper = function () {
+        setIsPopperOpen(false);
+    };
+    var selectDate = function (date) {
+        setSelected(date);
+        changeHandler && changeHandler(date);
+    };
+    var handleInputChange = function (e) {
+        setInputValue(e.currentTarget.value);
+        var date = (0, date_fns_1.parse)(e.currentTarget.value, dayFormat, new Date());
+        if ((0, date_fns_1.isValid)(date)) {
+            selectDate(date);
+        }
+        else {
+            selectDate(undefined);
+        }
+    };
+    var handleSelect = function (_day, selectedDay, _activeModifiers, _e) {
+        if (_activeModifiers.disabled) {
+            return;
+        }
+        selectDate(selectedDay);
+        if (selectedDay) {
+            setInputValue((0, date_fns_1.format)(selectedDay, dayFormat));
+            closePopper();
+        }
+        else {
+            setInputValue('');
+        }
+    };
+    var onInputClick = function () {
+        setIsPopperOpen(true);
+    };
+    var onButtonClick = function () {
+        var popperOpen = !isPopperOpen;
+        setIsPopperOpen(popperOpen);
+        buttonHandler && buttonHandler(popperOpen);
+    };
+    return ((0, jsx_runtime_1.jsx)(focus_trap_react_1.default, { active: isPopperOpen, focusTrapOptions: {
+            tabbableOptions: {
+                displayCheck: 'none',
+            },
+            initialFocus: false,
+            allowOutsideClick: false,
+            clickOutsideDeactivates: true,
+            onDeactivate: closePopper,
+        }, children: (0, jsx_runtime_1.jsxs)("div", { children: [label && (0, jsx_runtime_1.jsx)(DayPickerLabel, { children: label }), (0, jsx_runtime_1.jsxs)(InputContainer, { ref: popperRef, showIcon: showIcon, children: [(0, jsx_runtime_1.jsx)(DayPickerInput, { type: "text", readOnly: true, placeholder: (0, date_fns_1.format)(initialDate !== null && initialDate !== void 0 ? initialDate : new Date(), dayFormat), value: inputValue, onChange: handleInputChange, onClick: !showIcon ? onInputClick : undefined }), showIcon && ((0, jsx_runtime_1.jsx)(StyledButton, { type: "button", icon: (0, jsx_runtime_1.jsx)(icon_1.default, { type: "calendar", size: "medium" }), iconPlacement: "center", onClick: onButtonClick }))] }), isPopperOpen && ((0, jsx_runtime_1.jsx)(StyledDialogSheet, __assign({ tabIndex: -1, style: popper.styles.popper }, popper.attributes.popper, { ref: setPopperElement, role: "dialog", children: (0, jsx_runtime_1.jsx)(StyledDayPicker, { initialFocus: isPopperOpen, mode: "single", defaultMonth: selected, selected: selected, onSelect: handleSelect, fromMonth: minDate, toMonth: maxDate, disabled: disabledDays, numberOfMonths: navigationNumberOfMonths, pagedNavigation: true }) })))] }) }));
+};
+exports.default = Daypicker;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+//# sourceMappingURL=daypicker.js.map

package/lib/atoms/daypicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"daypicker.js","sourceRoot":"","sources":["../../src/atoms/daypicker.tsx"],"names":[],"mappings":"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"}

package/lib/atoms/index.d.ts

@@ -0,0 +1,5 @@
+export { default as RadioButton } from './radio';
+export { default as Checkbox } from './checkbox';
+export { default as TextInput } from './text';
+export { default as Daypicker, DaypickerProps } from './daypicker';
+export { default as Toggle } from './toggle';

package/lib/atoms/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Toggle = exports.Daypicker = exports.TextInput = exports.Checkbox = exports.RadioButton = void 0;
+var radio_1 = require("./radio");
+Object.defineProperty(exports, "RadioButton", { enumerable: true, get: function () { return __importDefault(radio_1).default; } });
+var checkbox_1 = require("./checkbox");
+Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return __importDefault(checkbox_1).default; } });
+var text_1 = require("./text");
+Object.defineProperty(exports, "TextInput", { enumerable: true, get: function () { return __importDefault(text_1).default; } });
+var daypicker_1 = require("./daypicker");
+Object.defineProperty(exports, "Daypicker", { enumerable: true, get: function () { return __importDefault(daypicker_1).default; } });
+var toggle_1 = require("./toggle");
+Object.defineProperty(exports, "Toggle", { enumerable: true, get: function () { return __importDefault(toggle_1).default; } });
+//# sourceMappingURL=index.js.map

package/lib/atoms/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/atoms/index.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAAgD;AAAvC,qHAAA,OAAO,OAAe;AAC/B,uCAAgD;AAAvC,qHAAA,OAAO,OAAY;AAC5B,+BAA6C;AAApC,kHAAA,OAAO,OAAa;AAC7B,yCAAkE;AAAzD,uHAAA,OAAO,OAAa;AAC7B,mCAA4C;AAAnC,iHAAA,OAAO,OAAU"}

package/lib/atoms/radio.d.ts

@@ -0,0 +1,10 @@
+import { ChangeEvent, FC, HTMLAttributes } from 'react';
+declare const RadioButton: FC<Props>;
+interface Props extends HTMLAttributes<HTMLDivElement> {
+    id: string;
+    value: string;
+    checked?: boolean;
+    label: string;
+    changeHandler(e: ChangeEvent<HTMLInputElement>): void;
+}
+export default RadioButton;

package/lib/atoms/radio.js

@@ -0,0 +1,48 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = __importDefault(require("@emotion/styled"));
+var react_1 = require("@emotion/react");
+var styles_1 = require("@ltht-react/styles");
+var StyledRadioButton = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding-left: 1.25rem;\n\n  ", "\n"], ["\n  padding-left: 1.25rem;\n\n  ", "\n"])), function (_a) {
+    var checked = _a.checked;
+    return checked && (0, react_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      background-color: ", ";\n    "], ["\n      background-color: ", ";\n    "])), styles_1.INPUT_COLOURS.RADIO_SELECTED);
+});
+var StyledInput = styled_1.default.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: absolute;\n  margin-top: 0.15rem;\n  margin-left: -1.25rem;\n"], ["\n  position: absolute;\n  margin-top: 0.15rem;\n  margin-left: -1.25rem;\n"])));
+var StyledLabel = styled_1.default.label(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: inline-block;\n  margin-bottom: 0;\n"], ["\n  display: inline-block;\n  margin-bottom: 0;\n"])));
+var RadioButton = function (_a) {
+    var id = _a.id, value = _a.value, _b = _a.checked, checked = _b === void 0 ? false : _b, label = _a.label, changeHandler = _a.changeHandler, rest = __rest(_a, ["id", "value", "checked", "label", "changeHandler"]);
+    return ((0, jsx_runtime_1.jsxs)(StyledRadioButton, __assign({ checked: checked }, rest, { children: [(0, jsx_runtime_1.jsx)(StyledInput, { id: id, onChange: changeHandler, value: value, type: "radio", checked: checked }), (0, jsx_runtime_1.jsx)(StyledLabel, { htmlFor: id, children: label })] })));
+};
+exports.default = RadioButton;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+//# sourceMappingURL=radio.js.map

package/lib/atoms/radio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio.js","sourceRoot":"","sources":["../../src/atoms/radio.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,2DAAoC;AACpC,wCAAsD;AACtD,6CAAkD;AAElD,IAAM,iBAAiB,GAAG,gBAAM,CAAC,GAAG,2GAAwB,kCAGxD,EAIC,IACJ,KALG,UAAC,EAAW;QAAT,OAAO,aAAA;IACV,OAAA,OAAO,QACP,WAAG,2GAAA,4BACmB,EAA4B,SACjD,KADqB,sBAAa,CAAC,cAAc,CACjD;AAHD,CAGC,CACJ,CAAA;AAED,IAAM,WAAW,GAAG,gBAAM,CAAC,KAAK,gJAAA,6EAI/B,IAAA,CAAA;AAED,IAAM,WAAW,GAAG,gBAAM,CAAC,KAAK,sHAAA,mDAG/B,IAAA,CAAA;AAED,IAAM,WAAW,GAAc,UAAC,EAA6D;IAA3D,IAAA,EAAE,QAAA,EAAE,KAAK,WAAA,EAAE,eAAe,EAAf,OAAO,mBAAG,KAAK,KAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA,EAAK,IAAI,cAA3D,oDAA6D,CAAF;IAAO,OAAA,CAChG,wBAAC,iBAAiB,aAAC,OAAO,EAAE,OAAO,IAAM,IAAI,eAC3C,uBAAC,WAAW,IAAC,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,GAAI,EAC7F,uBAAC,WAAW,IAAC,OAAO,EAAE,EAAE,YAAG,KAAK,GAAe,KAC7B,CACrB,CAAA;CAAA,CAAA;AAeD,kBAAe,WAAW,CAAA"}

package/lib/atoms/text.d.ts

@@ -0,0 +1,7 @@
+import { FC, InputHTMLAttributes } from 'react';
+import { IconProps } from '@ltht-react/icon';
+declare const TextInput: FC<ITextInputProps>;
+interface ITextInputProps extends InputHTMLAttributes<HTMLInputElement> {
+    icon?: IconProps;
+}
+export default TextInput;

package/lib/atoms/text.js

@@ -0,0 +1,48 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = __importDefault(require("@emotion/styled"));
+var styles_1 = require("@ltht-react/styles");
+var icon_1 = __importDefault(require("@ltht-react/icon"));
+var TextInputContainer = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  display: inline-block;\n  position: relative;\n\n  ", " {\n    width: auto;\n  }\n"], ["\n  width: 100%;\n  display: inline-block;\n  position: relative;\n\n  ", " {\n    width: auto;\n  }\n"])), styles_1.DESKTOP_MINIMUM_MEDIA_QUERY);
+var StyledTextInput = styled_1.default.input(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  ", "\n  padding: 0.5rem 1rem 0.5rem 1.75rem;\n  padding-left: ", ";\n  &::placeholder {\n    color: #98a4ad;\n  }\n\n  ", " {\n    width: auto;\n  }\n"], ["\n  width: 100%;\n  ", "\n  padding: 0.5rem 1rem 0.5rem 1.75rem;\n  padding-left: ", ";\n  &::placeholder {\n    color: #98a4ad;\n  }\n\n  ", " {\n    width: auto;\n  }\n"])), styles_1.inputBaseStyles, function (_a) {
+    var hasIcon = _a.hasIcon;
+    return (hasIcon ? '1.75rem' : '0.5rem');
+}, styles_1.DESKTOP_MINIMUM_MEDIA_QUERY);
+var StyledIcon = (0, styled_1.default)(icon_1.default)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: absolute;\n  left: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #98a4ad;\n\n  ", " {\n    width: auto;\n  }\n"], ["\n  position: absolute;\n  left: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #98a4ad;\n\n  ", " {\n    width: auto;\n  }\n"])), styles_1.DESKTOP_MINIMUM_MEDIA_QUERY);
+var TextInput = function (_a) {
+    var placeholder = _a.placeholder, icon = _a.icon, rest = __rest(_a, ["placeholder", "icon"]);
+    return ((0, jsx_runtime_1.jsxs)(TextInputContainer, { children: [icon && (0, jsx_runtime_1.jsx)(StyledIcon, __assign({}, icon)), (0, jsx_runtime_1.jsx)(StyledTextInput, __assign({ type: "text", placeholder: placeholder }, rest, { hasIcon: icon !== undefined }))] }));
+};
+exports.default = TextInput;
+var templateObject_1, templateObject_2, templateObject_3;
+//# sourceMappingURL=text.js.map

package/lib/atoms/text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","sourceRoot":"","sources":["../../src/atoms/text.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,2DAAoC;AACpC,6CAAiF;AACjF,0DAAkD;AAElD,IAAM,kBAAkB,GAAG,gBAAM,CAAC,GAAG,2KAAA,yEAKjC,EAA2B,6BAG9B,KAHG,oCAA2B,CAG9B,CAAA;AAED,IAAM,eAAe,GAA8B,gBAAM,CAAC,KAAK,+OAAA,sBAE3D,EAAe,4DAED,EAAwE,uDAKtF,EAA2B,6BAG9B,KAVG,wBAAe,EAED,UAAC,EAAkC;QAAhC,OAAO,aAAA;IAA8B,OAAA,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC;AAAhC,CAAgC,EAKtF,oCAA2B,CAG9B,CAAA;AAED,IAAM,UAAU,GAAG,IAAA,gBAAM,EAAC,cAAI,CAAC,+MAAA,6GAO3B,EAA2B,6BAG9B,KAHG,oCAA2B,CAG9B,CAAA;AAED,IAAM,SAAS,GAAwB,UAAC,EAA8B;IAA5B,IAAA,WAAW,iBAAA,EAAE,IAAI,UAAA,EAAK,IAAI,cAA5B,uBAA8B,CAAF;IAAO,OAAA,CACzE,wBAAC,kBAAkB,eAChB,IAAI,IAAI,uBAAC,UAAU,eAAK,IAAI,EAAI,EACjC,uBAAC,eAAe,aAAC,IAAI,EAAC,MAAM,EAAC,WAAW,EAAE,WAAW,IAAM,IAAI,IAAE,OAAO,EAAE,IAAI,KAAK,SAAS,IAAI,IAC7E,CACtB,CAAA;CAAA,CAAA;AAUD,kBAAe,SAAS,CAAA"}

package/lib/atoms/toggle.d.ts

@@ -0,0 +1,7 @@
+import { FC, HTMLAttributes } from 'react';
+declare const ToggleInput: FC<ToggleInputProps>;
+interface ToggleInputProps extends HTMLAttributes<HTMLInputElement> {
+    checked: boolean;
+    disabled?: boolean;
+}
+export default ToggleInput;

package/lib/atoms/toggle.js

@@ -0,0 +1,41 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = __importDefault(require("@emotion/styled"));
+var StyledInput = styled_1.default.input(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  appearance: none;\n  border: solid 1px black;\n  border-radius: 1rem;\n  content: '';\n  cursor: pointer;\n  height: 1rem;\n  width: 2rem;\n  min-width: 2rem;\n  background: white;\n  transition: all linear 0.1s;\n\n  &::before {\n    align-self: baseline;\n    background: black;\n    outline: 1px solid black;\n    border-radius: 0.4rem;\n    content: '';\n    display: block;\n    height: 0.6rem;\n    width: 0.6rem;\n    top: 0.25rem;\n    left: 0.22rem;\n    margin-top: -2px;\n    margin-left: -1px;\n    position: relative;\n    transition: left linear 0.1s, background linear 0.1s;\n  }\n\n  &:checked {\n    background: black;\n\n    // Style overrides for IE 11 (fallback to normal checkbox)\n    // Only IE 10 & 11 use these media queries\n    @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n      background: none;\n    }\n  }\n\n  &:checked::before {\n    left: 1.25rem;\n    background: white;\n  }\n\n  &:disabled {\n    background: white;\n    outline: grey;\n    border-color: grey;\n  }\n\n  &:disabled::before {\n    background: grey;\n    outline: grey;\n  }\n\n  &:checked:disabled {\n    background: grey;\n  }\n\n  &:checked:disabled::before {\n    outline: white;\n    background: white;\n    border-color: white;\n  }\n"], ["\n  appearance: none;\n  border: solid 1px black;\n  border-radius: 1rem;\n  content: '';\n  cursor: pointer;\n  height: 1rem;\n  width: 2rem;\n  min-width: 2rem;\n  background: white;\n  transition: all linear 0.1s;\n\n  &::before {\n    align-self: baseline;\n    background: black;\n    outline: 1px solid black;\n    border-radius: 0.4rem;\n    content: '';\n    display: block;\n    height: 0.6rem;\n    width: 0.6rem;\n    top: 0.25rem;\n    left: 0.22rem;\n    margin-top: -2px;\n    margin-left: -1px;\n    position: relative;\n    transition: left linear 0.1s, background linear 0.1s;\n  }\n\n  &:checked {\n    background: black;\n\n    // Style overrides for IE 11 (fallback to normal checkbox)\n    // Only IE 10 & 11 use these media queries\n    @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {\n      background: none;\n    }\n  }\n\n  &:checked::before {\n    left: 1.25rem;\n    background: white;\n  }\n\n  &:disabled {\n    background: white;\n    outline: grey;\n    border-color: grey;\n  }\n\n  &:disabled::before {\n    background: grey;\n    outline: grey;\n  }\n\n  &:checked:disabled {\n    background: grey;\n  }\n\n  &:checked:disabled::before {\n    outline: white;\n    background: white;\n    border-color: white;\n  }\n"])));
+var ToggleInput = function (_a) {
+    var checked = _a.checked, onChange = _a.onChange, disabled = _a.disabled, rest = __rest(_a, ["checked", "onChange", "disabled"]);
+    return ((0, jsx_runtime_1.jsx)(StyledInput, __assign({ type: "checkbox", checked: checked, disabled: disabled, onChange: function (e) { return !disabled && onChange && onChange(e); } }, rest, { title: checked ? 'On' : 'Off' })));
+};
+exports.default = ToggleInput;
+var templateObject_1;
+//# sourceMappingURL=toggle.js.map

package/lib/atoms/toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle.js","sourceRoot":"","sources":["../../src/atoms/toggle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2DAAoC;AAGpC,IAAM,WAAW,GAAG,gBAAM,CAAC,KAAK,40CAAA,ywCAgE/B,IAAA,CAAA;AAED,IAAM,WAAW,GAAyB,UAAC,EAAwC;IAAtC,IAAA,OAAO,aAAA,EAAE,QAAQ,cAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAAtC,mCAAwC,CAAF;IAAO,OAAA,CACtF,uBAAC,WAAW,aACV,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,CAAC,QAAQ,IAAI,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC,EAApC,CAAoC,IACjD,IAAI,IACR,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,IAC7B,CACH,CAAA;CAAA,CAAA;AAOD,kBAAe,WAAW,CAAA"}

package/lib/index.d.ts

@@ -0,0 +1,2 @@
+export * from './atoms';
+export * from './molecules';

package/lib/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./atoms"), exports);
+__exportStar(require("./molecules"), exports);
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,0CAAuB;AACvB,8CAA2B"}

package/lib/molecules/daypicker-range.d.ts

@@ -0,0 +1,10 @@
+import { FC, HTMLAttributes } from 'react';
+import { DaypickerProps } from '../atoms';
+declare const DaypickerRange: FC<Props>;
+export type fromDaypickerRangeProps = Omit<DaypickerProps, 'maxDate'>;
+export type toDaypickerRangeProps = Omit<DaypickerProps, 'minDate'>;
+interface Props extends HTMLAttributes<HTMLDivElement> {
+    fromProps: fromDaypickerRangeProps;
+    toProps: toDaypickerRangeProps;
+}
+export default DaypickerRange;

package/lib/molecules/daypicker-range.js

@@ -0,0 +1,48 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_1 = __importDefault(require("@emotion/styled"));
+var react_1 = require("react");
+var atoms_1 = require("../atoms");
+var RangeContainer = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
+var PickerContainer = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  flex: 1;\n"], ["\n  flex: 1;\n"])));
+var DaypickerRange = function (_a) {
+    var _b, _c, _d, _e;
+    var fromProps = _a.fromProps, toProps = _a.toProps;
+    if (fromProps.minDate && toProps.maxDate && fromProps.minDate > toProps.maxDate) {
+        throw new Error("Cannot initialise DaypickerRange where the minDate: ".concat((_b = fromProps.minDate) === null || _b === void 0 ? void 0 : _b.toDateString(), " > maxDate: ").concat((_c = toProps.maxDate) === null || _c === void 0 ? void 0 : _c.toDateString(), " "));
+    }
+    var _f = (0, react_1.useState)(fromProps.minDate), toMinDate = _f[0], setToMinDate = _f[1];
+    var _g = (0, react_1.useState)(toProps.maxDate), fromMaxDate = _g[0], setFromMaxDate = _g[1];
+    var _h = (0, react_1.useState)((_d = fromProps.pickerOpen) !== null && _d !== void 0 ? _d : false), fromPickerOpen = _h[0], setFromPickerOpen = _h[1];
+    var _j = (0, react_1.useState)((_e = toProps.pickerOpen) !== null && _e !== void 0 ? _e : false), toPickerOpen = _j[0], setToPickerOpen = _j[1];
+    var fromChangeHandler = function (date) {
+        fromProps.changeHandler && fromProps.changeHandler(date);
+        setToMinDate(date);
+    };
+    var toChangeHandler = function (date) {
+        toProps.changeHandler && toProps.changeHandler(date);
+        setFromMaxDate(date);
+    };
+    var toButtonHandler = function (toPickerOpen) {
+        if (toPickerOpen) {
+            setFromPickerOpen(false);
+        }
+    };
+    var fromButtonHandler = function (fromPickerOpen) {
+        if (fromPickerOpen) {
+            setToPickerOpen(false);
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)(RangeContainer, { children: [(0, jsx_runtime_1.jsx)(PickerContainer, { children: (0, jsx_runtime_1.jsx)(atoms_1.Daypicker, { initialDate: fromProps.initialDate, showIcon: fromProps.showIcon, pickerOpen: fromPickerOpen, dayFormat: fromProps.dayFormat, label: fromProps.label, minDate: fromProps.minDate, maxDate: fromMaxDate, navigationNumberOfMonths: fromProps.navigationNumberOfMonths, changeHandler: fromChangeHandler, buttonHandler: fromButtonHandler }) }), (0, jsx_runtime_1.jsx)(PickerContainer, { children: (0, jsx_runtime_1.jsx)(atoms_1.Daypicker, { initialDate: toProps.initialDate, pickerOpen: toPickerOpen, showIcon: toProps.showIcon, dayFormat: toProps.dayFormat, label: toProps.label, minDate: toMinDate, maxDate: toProps.maxDate, navigationNumberOfMonths: toProps.navigationNumberOfMonths, changeHandler: toChangeHandler, buttonHandler: toButtonHandler }) })] }));
+};
+exports.default = DaypickerRange;
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=daypicker-range.js.map

package/lib/molecules/daypicker-range.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"daypicker-range.js","sourceRoot":"","sources":["../../src/molecules/daypicker-range.tsx"],"names":[],"mappings":"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"}

package/lib/molecules/index.d.ts

@@ -0,0 +1 @@
+export { default as DaypickerRange, fromDaypickerRangeProps, toDaypickerRangeProps } from './daypicker-range';

package/lib/molecules/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DaypickerRange = void 0;
+var daypicker_range_1 = require("./daypicker-range");
+Object.defineProperty(exports, "DaypickerRange", { enumerable: true, get: function () { return __importDefault(daypicker_range_1).default; } });
+//# sourceMappingURL=index.js.map

package/lib/molecules/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/molecules/index.tsx"],"names":[],"mappings":";;;;;;AAAA,qDAA6G;AAApG,kIAAA,OAAO,OAAkB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ltht-react/input",
-  "version": "2.0.194",
+  "version": "2.0.198",
   "description": "ltht-react styled Input component.",
   "author": "LTHT",
   "homepage": "",
@@ -28,11 +28,11 @@
   "dependencies": {
     "@emotion/react": "^11.0.0",
     "@emotion/styled": "^11.0.0",
-    "@ltht-react/button": "^2.0.194",
-    "@ltht-react/icon": "^2.0.194",
-    "@ltht-react/styles": "^2.0.194",
-    "@ltht-react/types": "^2.0.194",
-    "@ltht-react/utils": "^2.0.194",
+    "@ltht-react/button": "^2.0.198",
+    "@ltht-react/icon": "^2.0.198",
+    "@ltht-react/styles": "^2.0.198",
+    "@ltht-react/types": "^2.0.198",
+    "@ltht-react/utils": "^2.0.198",
     "@popperjs/core": "^2.11.5",
     "date-fns": "^3.6.0",
     "focus-trap-react": "^9.0.2",
@@ -41,5 +41,5 @@
     "react-day-picker": "^8.9.1",
     "react-popper": "^2.3.0"
   },
-  "gitHead": "2eb4b88fa2bc19baa1be9433dbe29fe1a947dc62"
+  "gitHead": "c7731510acff36963dbb25779862543886ab39da"
 }