oolib 2.163.2 → 2.163.3

package/dist/index.d.ts

@@ -73,7 +73,7 @@ export { default as TableCellResizerPlugin } from "./components/Lexical/Plugins/
 export { TabBarStyle1 as TabBarV2 } from "./v2/components/TabBar";
 export { colors as colors2 } from "./v2/themes";
 export { HintsProvider } from "./v2/components/Hints/contextApi";
-export { DateRangePicker as DateRangePicker2 } from "./v2/components/DateRangePicker";
+export { DateRangePicker as DateRangePickerV2 } from "./v2/components/DateRangePicker";
 export { LoaderCircle, ProgressBar, LoaderCircle as Loader, LoaderOverlay } from "./components/LoadersAndProgress";
 export { TagClear, TagLink, TagSelect } from "./components/Tags";
 export { BannerAlert, BannerInfo } from "./components/Banners";

package/dist/index.js

@@ -18,7 +18,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PDFInput = exports.AudioInput = exports.VideoInput = exports.ProfileImageInput = exports.ImageInput = exports.MetaBlock = exports.genTagComp = exports.generateOptions = exports.OptionsSingle = exports.DropdownMulti = exports.DropdownSingle = exports.parseCardConfig = exports.ListProfile = exports.CardProfile = exports.CardEmbed = exports.DataVizAccordion = exports.BarChart = exports.DateTimeRangePicker = exports.DateTimePicker = exports.TimeRangePicker = exports.TimePicker = exports.DateRangePicker = exports.DatePicker = exports.TextLoader = exports.PageScrollIndicator = exports.HomeCover = exports.EmptyStates = exports.ModalSmall = exports.Modal = exports.ModalForms = exports.ModalConfirm = exports.SkeletonLoader = exports.Divider = exports.PercentCompletedPie = exports.Accordion = exports.ActionMenu = exports.Tooltip = exports.OKELink = exports.UserRoleBadge = exports.Section = exports.TagSelect = exports.TagLink = exports.TagClear = exports.LoaderOverlay = exports.Loader = exports.ProgressBar = exports.LoaderCircle = exports.icons = exports.colors = exports.GlobalStyles = void 0;
-exports.DateRangePicker2 = exports.HintsProvider = exports.colors2 = exports.TabBarV2 = exports.TableCellResizerPlugin = exports.styledOKELinkCSS = exports.SimpleTable = exports.ModalConfirmAction = exports.BannerProvider = exports.useBannerContext = exports.BannerContext = exports.BannerInfo = exports.BannerAlert = exports.GroupQuestionsInputSingle = exports.ResourceInput = exports.IFrameInput = void 0;
+exports.DateRangePickerV2 = exports.HintsProvider = exports.colors2 = exports.TabBarV2 = exports.TableCellResizerPlugin = exports.styledOKELinkCSS = exports.SimpleTable = exports.ModalConfirmAction = exports.BannerProvider = exports.useBannerContext = exports.BannerContext = exports.BannerInfo = exports.BannerAlert = exports.GroupQuestionsInputSingle = exports.ResourceInput = exports.IFrameInput = void 0;
 var TabBar_1 = require("./v2/components/TabBar");
 //css and styling related ( styled-components )
 var globalStyles_1 = require("./globalStyles");
@@ -192,6 +192,6 @@ Object.defineProperty(exports, "colors2", { enumerable: true, get: function () {
 var contextApi_1 = require("./v2/components/Hints/contextApi");
 Object.defineProperty(exports, "HintsProvider", { enumerable: true, get: function () { return contextApi_1.HintsProvider; } });
 var DateRangePicker_2 = require("./v2/components/DateRangePicker");
-Object.defineProperty(exports, "DateRangePicker2", { enumerable: true, get: function () { return DateRangePicker_2.DateRangePicker; } });
+Object.defineProperty(exports, "DateRangePickerV2", { enumerable: true, get: function () { return DateRangePicker_2.DateRangePicker; } });
 // V2 new ready components
 // export * from './v2/components/TextInputs';

package/dist/stories/v2/components/Date.stories.d.ts

@@ -39,5 +39,6 @@ export namespace DateRangePicker_ {
         export let debug: boolean;
         export let startDateLabel: string;
         export let endDateLabel: string;
+        export let withPortal: boolean;
     }
 }

package/dist/stories/v2/components/Date.stories.js

@@ -58,4 +58,5 @@ exports.DateRangePicker_.args = {
     debug: false,
     startDateLabel: "",
     endDateLabel: "",
+    withPortal: false
 };

package/dist/v2/components/DateRangePicker/index.d.ts

@@ -13,6 +13,7 @@ interface DateRangePickerProps {
     debug?: boolean;
     startDateLabel?: string;
     endDateLabel?: string;
+    withPortal?: boolean;
 }
 declare function DateRangePicker_(props: DateRangePickerProps): React.JSX.Element;
 export declare const DateRangePicker: React.MemoExoticComponent<typeof DateRangePicker_>;

package/dist/v2/components/DateRangePicker/index.js

@@ -54,9 +54,9 @@ var styled_1 = require("./styled");
 var TextInputs_1 = require("../TextInputs");
 var __1 = require("../../..");
 function DateRangePicker_(props) {
-    var onChange = props.onChange, value = props.value, id = props.id, readOnly = props.readOnly, futureDateOnly = props.futureDateOnly, previousDateOnly = props.previousDateOnly, allowPresentlyOngoing = props.allowPresentlyOngoing, invert = props.invert, disabled = props.disabled, debug = props.debug, startDateLabel = props.startDateLabel, endDateLabel = props.endDateLabel;
-    var _a = (0, react_1.useState)(value[0] || null), startDate = _a[0], setStartDate = _a[1];
-    var _b = (0, react_1.useState)(value[1] || null), endDate = _b[0], setEndDate = _b[1];
+    var onChange = props.onChange, value = props.value, id = props.id, readOnly = props.readOnly, futureDateOnly = props.futureDateOnly, previousDateOnly = props.previousDateOnly, allowPresentlyOngoing = props.allowPresentlyOngoing, invert = props.invert, disabled = props.disabled, debug = props.debug, startDateLabel = props.startDateLabel, endDateLabel = props.endDateLabel, _a = props.withPortal, withPortal = _a === void 0 ? false : _a;
+    var _b = (0, react_1.useState)(value[0] || null), startDate = _b[0], setStartDate = _b[1];
+    var _c = (0, react_1.useState)(value[1] || null), endDate = _c[0], setEndDate = _c[1];
     (0, react_1.useEffect)(function () {
         setStartDate(value[0] || null);
         setEndDate(value[1] || null);
@@ -104,7 +104,7 @@ function DateRangePicker_(props) {
         react_1.default.createElement(styled_1.StyledDateRangeInputWrapper, { invert: invert, readOnly: readOnly },
             react_1.default.createElement("div", { style: { display: "flex", flexDirection: "column" } },
                 react_1.default.createElement(Typo2_1.UI_CAPTION, null, startDateLabel),
-                react_1.default.createElement(styled_1.StyledDatePicker, { locale: "es", className: 'UI_BODY_SM', selected: startDate, onChange: function (date) { return handleOnChange(0, date); }, selectsStart: true, startDate: startDate, endDate: endDate, minDate: getMinDate(false), maxDate: getMaxDate(), readOnly: readOnly, disabled: disabled, dateFormat: "MM/dd/yyyy" })),
+                react_1.default.createElement(styled_1.StyledDatePicker, { locale: "es", className: 'UI_BODY_SM', selected: startDate, onChange: function (date) { return handleOnChange(0, date); }, selectsStart: true, startDate: startDate, endDate: endDate, minDate: getMinDate(false), maxDate: getMaxDate(), readOnly: readOnly, disabled: disabled, dateFormat: "MM/dd/yyyy", withPortal: withPortal })),
             react_1.default.createElement(styled_1.StyledDateRangeInputDivider, null),
             react_1.default.createElement("div", { style: { display: "flex", flexDirection: "column" } },
                 react_1.default.createElement(Typo2_1.UI_CAPTION, null, endDateLabel),
@@ -112,7 +112,7 @@ function DateRangePicker_(props) {
                     react_1.default.createElement("div", { style: { border: "1px solid ".concat(__1.colors2.grey20), padding: '8px 20px', borderRadius: '5px', width: '120px', background: "".concat(__1.colors2.grey5) } },
                         react_1.default.createElement(TextInputs_1.TextInput, { value: "OnGoing", readOnly: true }))
                     :
-                        react_1.default.createElement(styled_1.StyledDatePicker, { locale: "es", className: 'UI_BODY_SM', selected: endDate, onChange: function (date) { return handleOnChange(1, date); }, selectsEnd: true, startDate: startDate, endDate: endDate, minDate: getMinDate(true), maxDate: getMaxDate(), readOnly: readOnly, disabled: disabled || (value && value[1] === null), dateFormat: "MM/dd/yyyy" }))),
+                        react_1.default.createElement(styled_1.StyledDatePicker, { locale: "es", className: 'UI_BODY_SM', selected: endDate, onChange: function (date) { return handleOnChange(1, date); }, selectsEnd: true, startDate: startDate, endDate: endDate, minDate: getMinDate(true), maxDate: getMaxDate(), readOnly: readOnly, disabled: disabled || (value && value[1] === null), dateFormat: "MM/dd/yyyy", withPortal: withPortal }))),
         !readOnly && allowPresentlyOngoing && (react_1.default.createElement("div", { style: { marginTop: '0.5rem' } },
             react_1.default.createElement(RadioAndCheckbox_1.CheckboxInput, { option: { display: 'Presently Ongoing', value: 'Ongoing' }, value: value && value[1] === null
                     ? [{ display: 'Presently Ongoing', value: 'Ongoing' }]

package/dist/v2/components/DateRangePicker/styled.js

@@ -12,7 +12,7 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var themes_1 = require("../../themes");
 var __1 = require("../../..");
 var react_datepicker_1 = __importDefault(require("react-datepicker"));
-exports.StyledDateRangeInputWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  /* gap: 8px; */\n  ", "\n  ", "\n\n  .react-datepicker{\n    margin-left: 3rem;\n  }\n\n  .react-datepicker__header{\n    font-family: ", ";\n    background-color: ", ";\n    \n    .react-datepicker__current-month{\n      font-family: ", ";    \n      margin-bottom: 0.5rem;\n    }\n  }\n\n  .react-datepicker__month{\n    font-family: ", ";\n    .react-datepicker__day{\n      width: 20px;\n      margin: 0.2rem;\n    }\n  }\n  .react-datepicker__day-name{\n      margin: 0.2rem;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  /* gap: 8px; */\n  ", "\n  ", "\n\n  .react-datepicker{\n    margin-left: 3rem;\n  }\n\n  .react-datepicker__header{\n    font-family: ", ";\n    background-color: ", ";\n    \n    .react-datepicker__current-month{\n      font-family: ", ";    \n      margin-bottom: 0.5rem;\n    }\n  }\n\n  .react-datepicker__month{\n    font-family: ", ";\n    .react-datepicker__day{\n      width: 20px;\n      margin: 0.2rem;\n    }\n  }\n  .react-datepicker__day-name{\n      margin: 0.2rem;\n  }\n"])), function (_a) {
+exports.StyledDateRangeInputWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  /* gap: 8px; */\n  ", "\n  ", "\n\n  .react-datepicker{\n    margin-left: 3rem;\n  }\n\n  .react-datepicker__header{\n    font-family: ", ";\n    background-color: ", ";\n    \n    .react-datepicker__current-month{\n      font-family: ", ";    \n      margin-bottom: 0.5rem;\n    }\n  }\n\n  .react-datepicker__month{\n    font-family: ", ";\n    .react-datepicker__day{\n      /* width: 20px; */\n      margin: 0.2rem;\n    }\n  }\n  .react-datepicker__day-name{\n      margin: 0.2rem;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  /* gap: 8px; */\n  ", "\n  ", "\n\n  .react-datepicker{\n    margin-left: 3rem;\n  }\n\n  .react-datepicker__header{\n    font-family: ", ";\n    background-color: ", ";\n    \n    .react-datepicker__current-month{\n      font-family: ", ";    \n      margin-bottom: 0.5rem;\n    }\n  }\n\n  .react-datepicker__month{\n    font-family: ", ";\n    .react-datepicker__day{\n      /* width: 20px; */\n      margin: 0.2rem;\n    }\n  }\n  .react-datepicker__day-name{\n      margin: 0.2rem;\n  }\n"])), function (_a) {
     var invert = _a.invert;
     return invert && "\n    background-color: #333;\n    color: #fff;\n  ";
 }, function (_a) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oolib",
-  "version": "2.163.2",
+  "version": "2.163.3",
   "description": " OKE Component Library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",