@ironsource/shared-ui 1.4.0-rc.10

package/components/chip/Chip.vue.js

@@ -0,0 +1,64 @@
+import { defineComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createElementVNode, toDisplayString, createVNode, unref } from 'vue';
+import Icon from '../icon/Icon.vue.js';
+/* empty css                                                      */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
+
+import "../../Chip.vue_vue_type_style_index_0_scoped_true_lang.css";
+const _hoisted_1 = ["disabled"];
+const _hoisted_2 = {
+  key: 0,
+  class: "icon icon--start"
+};
+const _hoisted_3 = {
+  key: 0,
+  class: "prefix"
+};
+const _hoisted_4 = {
+  key: 1,
+  class: "icon icon--end"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "Chip",
+  props: {
+    selected: { type: Boolean, default: false },
+    clearable: { type: Boolean, default: false },
+    prefix: { default: null },
+    disabled: { type: Boolean, default: false }
+  },
+  emits: ["cleared"],
+  setup(__props, { emit }) {
+    const cleared = (event) => {
+      event.stopPropagation();
+      emit("cleared");
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", {
+        class: normalizeClass(["chip-container", { selected: __props.selected, disabled: __props.disabled }]),
+        disabled: __props.disabled
+      }, [
+        _ctx.$slots["icon-start"] ? (openBlock(), createElementBlock("span", _hoisted_2, [
+          renderSlot(_ctx.$slots, "icon-start", {}, void 0, true)
+        ])) : createCommentVNode("", true),
+        createElementVNode("span", null, [
+          !!__props.prefix ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(__props.prefix) + ":", 1)) : createCommentVNode("", true),
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ]),
+        _ctx.$slots["icon-end"] ? (openBlock(), createElementBlock("span", _hoisted_4, [
+          renderSlot(_ctx.$slots, "icon-end", {}, void 0, true)
+        ])) : createCommentVNode("", true),
+        __props.clearable ? (openBlock(), createElementBlock("button", {
+          key: 2,
+          class: "clear-icon",
+          onClick: cleared
+        }, [
+          createVNode(unref(Icon), {
+            name: "close",
+            "font-size": "sm"
+          })
+        ])) : createCommentVNode("", true)
+      ], 10, _hoisted_1);
+    };
+  }
+});
+var Chip = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-68f9a601"]]);
+
+export { Chip as default };

package/components/chip/index.d.ts

@@ -0,0 +1,52 @@
+declare const ChipTypes: () => import("vue").DefineComponent<{
+    disabled: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    selected: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    clearable: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    prefix: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: any;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "cleared"[], "cleared", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    disabled: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    selected: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    clearable: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    prefix: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: any;
+    };
+}>> & {
+    onCleared?: (...args: any[]) => any;
+}, {
+    disabled: boolean;
+    selected: boolean;
+    clearable: boolean;
+    prefix: string;
+}>[];
+export { default as Chip } from './Chip.vue';
+export { ChipTypes };

package/components/chip/index.vue.js

@@ -0,0 +1,6 @@
+import Chip from './Chip.vue.js';
+export { default as Chip } from './Chip.vue.js';
+
+const ChipTypes = () => [Chip];
+
+export { ChipTypes };

package/components/cssBaseline/CssBaseline.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/components/cssBaseline/CssBaseline.vue.js

@@ -0,0 +1,12 @@
+import { renderSlot } from 'vue';
+/* empty css                                                             *//* empty css                                                 */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
+
+import "../../CssBaseline.vue_vue_type_style_index_0_scoped_true_lang.css";
+const _sfc_main = {};
+
+function _sfc_render(_ctx, _cache) {
+  return renderSlot(_ctx.$slots, "default", {}, undefined, true)
+}
+var CssBaseline = /*#__PURE__*/_export_sfc(_sfc_main, [['render',_sfc_render],['__scopeId',"data-v-dbb761f8"]]);
+
+export { CssBaseline as default };

package/components/cssBaseline/index.d.ts

@@ -0,0 +1,3 @@
+declare const CssBaselineTypes: () => any[];
+export { default as CssBaseline } from './CssBaseline.vue';
+export { CssBaselineTypes };

package/components/cssBaseline/index.vue.js

@@ -0,0 +1,6 @@
+import CssBaseline from './CssBaseline.vue.js';
+export { default as CssBaseline } from './CssBaseline.vue.js';
+
+const CssBaselineTypes = () => [CssBaseline];
+
+export { CssBaselineTypes };

package/components/datePicker/DatePicker.vue.d.ts

@@ -0,0 +1,50 @@
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    uniqueId?: string | number;
+    modelValue?: Date | string;
+    allowFutureDates?: boolean;
+    dateFormat?: string;
+    placeholder?: string;
+}>, {
+    uniqueId: number;
+    modelValue: any;
+    dateFormat: string;
+    placeholder: string;
+    allowFutureDates: boolean;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (val: string | Date) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    uniqueId?: string | number;
+    modelValue?: Date | string;
+    allowFutureDates?: boolean;
+    dateFormat?: string;
+    placeholder?: string;
+}>, {
+    uniqueId: number;
+    modelValue: any;
+    dateFormat: string;
+    placeholder: string;
+    allowFutureDates: boolean;
+}>>> & {
+    "onUpdate:modelValue"?: (val: string | Date) => any;
+}, {
+    modelValue: Date | string;
+    placeholder: string;
+    uniqueId: string | number;
+    allowFutureDates: boolean;
+    dateFormat: string;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};

package/components/datePicker/DatePicker.vue.js

@@ -0,0 +1,125 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, unref, createElementVNode, renderSlot, withDirectives, isRef, vModelText, normalizeClass, createVNode, createCommentVNode } from 'vue';
+import { onClickOutside } from '@vueuse/core';
+import { useToggle } from '../../composables/useToggle.vue.js';
+import DatePickerMonth from './DatePickerMonth.vue.js';
+import { isValid, format, parse, isFuture } from 'date-fns';
+/* empty css                                                            */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
+
+import "../../DatePicker.vue_vue_type_style_index_0_scoped_true_lang.css";
+const _hoisted_1 = ["id"];
+const _hoisted_2 = ["placeholder"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "DatePicker",
+  props: {
+    uniqueId: { default: Date.now() },
+    modelValue: { default: null },
+    allowFutureDates: { type: Boolean, default: false },
+    dateFormat: { default: "yyyy-MM-d" },
+    placeholder: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const datePicker = ref(null);
+    const popup = ref(null);
+    const input = ref(null);
+    const buttonRef = ref(null);
+    const [isOpen, toggle] = useToggle({ initialValue: false });
+    const close = () => {
+      toggle(false);
+    };
+    const handleInput = (event) => {
+      const value = event.target.value;
+      if (!isOpen) {
+        emit("update:modelValue", value);
+        return;
+      }
+      const parsedDate = parse(value, props.dateFormat, new Date());
+      if (!value.trim()) {
+        updateValue(null);
+      }
+      if (!isValid(parsedDate)) {
+        return;
+      }
+      if (!props.allowFutureDates && isFuture(parsedDate)) {
+        return;
+      }
+      updateValue(parsedDate);
+    };
+    const updateValue = (value) => {
+      close();
+      emit("update:modelValue", value);
+    };
+    const componentId = computed(() => {
+      return `datePicker${props.uniqueId || Math.random().toString().substring(2, 7)}`;
+    });
+    const formattedValue = computed(() => {
+      const date = new Date(props.modelValue);
+      return isValid(props.modelValue) ? format(date, props.dateFormat) : props.modelValue;
+    });
+    const nearTheEdge = computed(() => {
+      if (!datePicker.value || !isOpen)
+        return false;
+      const rect = datePicker.value.getBoundingClientRect();
+      const popupWidth = 232;
+      return window.innerWidth - (rect.x + popupWidth) < 0;
+    });
+    const valueAsDate = computed(() => {
+      if (!props.modelValue)
+        return null;
+      const parsedDate = new Date(props.modelValue);
+      return isValid(parsedDate) ? parsedDate : null;
+    });
+    onClickOutside(
+      popup,
+      () => {
+        close();
+      },
+      { ignore: [datePicker] }
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        id: unref(componentId),
+        ref_key: "datePicker",
+        ref: datePicker,
+        class: "date-picker"
+      }, [
+        createElementVNode("div", {
+          ref_key: "buttonRef",
+          ref: buttonRef,
+          onClick: _cache[2] || (_cache[2] = ($event) => unref(toggle)())
+        }, [
+          renderSlot(_ctx.$slots, "default", { formattedDate: unref(formattedValue) }, () => [
+            withDirectives(createElementVNode("input", {
+              ref_key: "input",
+              ref: input,
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(formattedValue) ? formattedValue.value = $event : null),
+              type: "text",
+              class: "input",
+              placeholder: __props.placeholder,
+              onInput: _cache[1] || (_cache[1] = ($event) => handleInput($event))
+            }, null, 40, _hoisted_2), [
+              [vModelText, unref(formattedValue)]
+            ])
+          ], true)
+        ], 512),
+        unref(isOpen) ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          ref_key: "popup",
+          ref: popup,
+          class: normalizeClass(["date-picker-popup", { "align-right": unref(nearTheEdge) }])
+        }, [
+          createVNode(DatePickerMonth, {
+            id: unref(componentId) + "-month",
+            "model-value": unref(valueAsDate),
+            "allow-future-dates": __props.allowFutureDates,
+            "onUpdate:modelValue": updateValue
+          }, null, 8, ["id", "model-value", "allow-future-dates"])
+        ], 2)) : createCommentVNode("", true)
+      ], 8, _hoisted_1);
+    };
+  }
+});
+var DatePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1f4328e0"]]);
+
+export { DatePicker as default };

package/components/datePicker/DatePickerMonth.vue.d.ts

@@ -0,0 +1,43 @@
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    uniqueId?: string | number;
+    modelValue?: Date;
+    includeToday?: boolean;
+    allowFutureDates?: boolean;
+}>, {
+    uniqueId: number;
+    modelValue: any;
+    includeToday: boolean;
+    allowFutureDates: boolean;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    uniqueId?: string | number;
+    modelValue?: Date;
+    includeToday?: boolean;
+    allowFutureDates?: boolean;
+}>, {
+    uniqueId: number;
+    modelValue: any;
+    includeToday: boolean;
+    allowFutureDates: boolean;
+}>>> & {
+    "onUpdate:modelValue"?: (...args: any[]) => any;
+}, {
+    modelValue: Date;
+    uniqueId: string | number;
+    includeToday: boolean;
+    allowFutureDates: boolean;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};

package/components/datePicker/DatePickerMonth.vue.js

@@ -0,0 +1,99 @@
+import { defineComponent, ref, watch, onMounted, computed, openBlock, createBlock, unref } from 'vue';
+import CalendarMonth from '../dateRange/CalendarMonth.vue.js';
+import dateServices from '../dateRange/DateServices.vue.js';
+import { navigateNext } from '../dateRange/consts.vue.js';
+import { startOfMonth, differenceInMonths, addMonths, subMonths } from 'date-fns';
+/* empty css                                                                 */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
+
+import "../../DatePickerMonth.vue_vue_type_style_index_0_scoped_true_lang.css";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "DatePickerMonth",
+  props: {
+    uniqueId: { default: Date.now() },
+    modelValue: { default: null },
+    includeToday: { type: Boolean, default: true },
+    allowFutureDates: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const getMonthDataFromDate = (date) => {
+      const month = date.getMonth();
+      const year = date.getFullYear();
+      return dateServices.createMonth(
+        month,
+        year,
+        props.includeToday,
+        !props.allowFutureDates
+      );
+    };
+    let monthData = ref(getMonthDataFromDate(dateServices.getCurrentTimeUTC()));
+    const resetMonth = () => {
+      const date = props.modelValue || dateServices.getCurrentTimeUTC();
+      monthData.value = getMonthDataFromDate(date);
+    };
+    const handleNavigation = (direction) => {
+      const date = new Date(monthData.value.year, monthData.value.month);
+      const newDate = direction === navigateNext ? addMonths(date, 1) : subMonths(date, 1);
+      monthData.value = getMonthDataFromDate(newDate);
+    };
+    watch(
+      () => props.modelValue,
+      () => {
+        resetMonth();
+      }
+    );
+    watch(
+      () => props.allowFutureDates,
+      () => {
+        monthData.value = getMonthDataFromDate(
+          new Date(monthData.value.year, monthData.value.month)
+        );
+      }
+    );
+    const getRangeFromDate = (date) => {
+      const d = date || null;
+      return {
+        fromStart: d,
+        fromEnd: d,
+        toStart: d,
+        toEnd: d
+      };
+    };
+    onMounted(() => {
+      resetMonth();
+    });
+    const navigation = computed(() => {
+      if (props.allowFutureDates)
+        return "all";
+      const current = startOfMonth(dateServices.getCurrentTimeUTC());
+      differenceInMonths(monthData.value.year, monthData.value.month);
+      const date = new Date(monthData.value.year, monthData.value.month);
+      return differenceInMonths(date, current) >= 0 ? "previous" : "all";
+    });
+    const selectedRange = computed(() => getRangeFromDate(props.modelValue));
+    const handleSelection = (day) => {
+      if (day.isFuture)
+        return;
+      emit("update:modelValue", day.date);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(CalendarMonth, {
+        id: __props.uniqueId,
+        type: "month",
+        class: "date-picker-month",
+        range: unref(selectedRange),
+        navigation: unref(navigation),
+        year: unref(monthData).year,
+        days: unref(monthData).days,
+        weeks: unref(monthData).weeks,
+        month: unref(monthData).month,
+        onSelectionChanged: handleSelection,
+        onNavigation: handleNavigation
+      }, null, 8, ["id", "range", "navigation", "year", "days", "weeks", "month"]);
+    };
+  }
+});
+var DatePickerMonth = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7dbe885c"]]);
+
+export { DatePickerMonth as default };

package/components/datePicker/index.d.ts

@@ -0,0 +1,65 @@
+declare const DatePickerTypes: () => import("vue").DefineComponent<{
+    modelValue: {
+        type: import("vue").PropType<string | Date>;
+    } & {
+        default: any;
+    };
+    placeholder: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
+    uniqueId: {
+        type: import("vue").PropType<string | number>;
+    } & {
+        default: number;
+    };
+    allowFutureDates: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    dateFormat: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (val: string | Date) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: import("vue").PropType<string | Date>;
+    } & {
+        default: any;
+    };
+    placeholder: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
+    uniqueId: {
+        type: import("vue").PropType<string | number>;
+    } & {
+        default: number;
+    };
+    allowFutureDates: {
+        type: import("vue").PropType<boolean>;
+    } & {
+        default: boolean;
+    };
+    dateFormat: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
+}>> & {
+    "onUpdate:modelValue"?: (val: string | Date) => any;
+}, {
+    modelValue: string | Date;
+    placeholder: string;
+    uniqueId: string | number;
+    allowFutureDates: boolean;
+    dateFormat: string;
+}>[];
+export { default as DatePicker } from './DatePicker.vue';
+export { DatePickerTypes };

package/components/datePicker/index.vue.js

@@ -0,0 +1,6 @@
+import DatePicker from './DatePicker.vue.js';
+export { default as DatePicker } from './DatePicker.vue.js';
+
+const DatePickerTypes = () => [DatePicker];
+
+export { DatePickerTypes };

package/components/dateRange/CalendarMonth.vue.d.ts

@@ -0,0 +1,64 @@
+import { Day } from './DateServices';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    year: number;
+    days: Record<string, Day>;
+    weeks: Day[][];
+    month: number;
+    navigation: 'next' | 'previous' | 'all';
+    range: {
+        fromStart: Date;
+        fromEnd: Date;
+        toEnd: Date;
+        toStart: Date;
+    };
+    type: 'date' | 'week' | 'month';
+    id?: string | number;
+    allowedDays?: number;
+    maxAllowedDate?: Date;
+}>, {
+    id: number;
+    allowedDays: any;
+    maxAllowedDate: any;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("navigation" | "selectionChanged")[], "navigation" | "selectionChanged", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    year: number;
+    days: Record<string, Day>;
+    weeks: Day[][];
+    month: number;
+    navigation: 'next' | 'previous' | 'all';
+    range: {
+        fromStart: Date;
+        fromEnd: Date;
+        toEnd: Date;
+        toStart: Date;
+    };
+    type: 'date' | 'week' | 'month';
+    id?: string | number;
+    allowedDays?: number;
+    maxAllowedDate?: Date;
+}>, {
+    id: number;
+    allowedDays: any;
+    maxAllowedDate: any;
+}>>> & {
+    onNavigation?: (...args: any[]) => any;
+    onSelectionChanged?: (...args: any[]) => any;
+}, {
+    id: string | number;
+    allowedDays: number;
+    maxAllowedDate: Date;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};