wini-web-components 2.6.9 → 2.7.1

package/dist/component/calendar/calendar.js

@@ -1,357 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Calendar = exports.inRangeTime = exports.endDate = exports.startDate = exports.today = void 0;
-const react_1 = __importDefault(require("react"));
-const calendar_module_css_1 = __importDefault(require("./calendar.module.css"));
-const date_fns_1 = require("date-fns");
-const react_i18next_1 = require("react-i18next");
-const winicon_1 = require("../wini-icon/winicon");
-exports.today = new Date();
-exports.startDate = new Date(exports.today.getFullYear() - 100, exports.today.getMonth(), exports.today.getDate());
-exports.endDate = new Date(exports.today.getFullYear() + 100, exports.today.getMonth(), exports.today.getDate());
-const inRangeTime = (date, startDate, endDate) => ((0, date_fns_1.differenceInCalendarDays)(date, startDate) > -1 && (0, date_fns_1.differenceInCalendarDays)(endDate, date) > -1);
-exports.inRangeTime = inRangeTime;
-var CalendarTab;
-(function (CalendarTab) {
-    CalendarTab[CalendarTab["DATE"] = 0] = "DATE";
-    CalendarTab[CalendarTab["MONTH"] = 1] = "MONTH";
-    CalendarTab[CalendarTab["YEAR"] = 2] = "YEAR";
-})(CalendarTab || (CalendarTab = {}));
-const stateValue = (minDate, maxDate, value, range) => {
-    let defaultValue;
-    if (value) {
-        if (range) {
-            if (value instanceof Date)
-                defaultValue = { sTime: value, eTime: value };
-            else
-                defaultValue = value;
-            if (defaultValue.sTime.getTime() < minDate.getTime())
-                defaultValue.sTime = minDate;
-            if (defaultValue.eTime.getTime() > maxDate.getTime())
-                defaultValue.eTime = maxDate;
-        }
-        else {
-            if (value instanceof Date)
-                defaultValue = value;
-            else
-                defaultValue = value.sTime;
-            if (defaultValue.getTime() < minDate.getTime())
-                defaultValue = minDate;
-            if (defaultValue.getTime() > maxDate.getTime())
-                defaultValue = maxDate;
-        }
-    }
-    else {
-        defaultValue = range ? { sTime: exports.today, eTime: exports.today } : exports.today;
-    }
-    const defaultMonth = defaultValue instanceof Date ? defaultValue.getMonth() : defaultValue.sTime.getMonth();
-    const defaultYear = defaultValue instanceof Date ? defaultValue.getFullYear() : defaultValue.sTime.getFullYear();
-    return {
-        value: value ? defaultValue : undefined,
-        selectMonth: defaultMonth,
-        selectYear: defaultYear,
-        tab: CalendarTab.DATE,
-    };
-};
-class TCalendar extends react_1.default.Component {
-    constructor(props) {
-        super(props);
-        this.minDate = !this.props.min || this.props.min.getTime() < exports.startDate.getTime() ? exports.startDate : this.props.min;
-        this.maxDate = !this.props.max || this.props.max.getTime() > exports.endDate.getTime() ? exports.endDate : this.props.max;
-        this.state = stateValue(this.minDate, this.maxDate, this.props.value, this.props.range);
-        this.showDateInMonth = this.showDateInMonth.bind(this);
-        this.showMonthInYear = this.showMonthInYear.bind(this);
-        this.showYearInRange = this.showYearInRange.bind(this);
-        this.getTitle = this.getTitle.bind(this);
-    }
-    componentDidUpdate(prevProps, prevState, snapshot) {
-        if (prevProps.value !== this.props.value) {
-            this.setState(stateValue(this.minDate, this.maxDate, this.props.value, this.props.range));
-        }
-    }
-    showDateInMonth() {
-        let firstDayOfMonth = new Date(this.state.selectYear, this.state.selectMonth, 1);
-        return react_1.default.createElement(react_1.default.Fragment, null,
-            Array.from({ length: 7 }).map((_, i) => {
-                switch (i) {
-                    case 0:
-                        var weekdayTitle = this.props.t("su");
-                        break;
-                    case 1:
-                        weekdayTitle = this.props.t("mo");
-                        break;
-                    case 2:
-                        weekdayTitle = this.props.t("tu");
-                        break;
-                    case 3:
-                        weekdayTitle = this.props.t("we");
-                        break;
-                    case 4:
-                        weekdayTitle = this.props.t("th");
-                        break;
-                    case 5:
-                        weekdayTitle = this.props.t("fr");
-                        break;
-                    case 6:
-                        weekdayTitle = this.props.t("sa");
-                        break;
-                    default:
-                        weekdayTitle = '';
-                        break;
-                }
-                return react_1.default.createElement("div", { key: 'dtwk-' + i, className: `${calendar_module_css_1.default['date-picker-circle']} date-picker-circle` },
-                    react_1.default.createElement("span", { className: "label-4 row" }, weekdayTitle));
-            }),
-            Array.from({ length: 42 }).map((_, i) => {
-                var _a, _b, _c;
-                let dateNumber = (i % 7) + (Math.floor(i / 7) * 7) - firstDayOfMonth.getDay();
-                const timeValue = new Date(this.state.selectYear, this.state.selectMonth, dateNumber + 1);
-                let className = `${calendar_module_css_1.default['date-picker-circle']} date-picker-circle`;
-                let typoClassName = "body-3";
-                if (dateNumber + 1 === exports.today.getDate() && this.state.selectMonth === exports.today.getMonth() && this.state.selectYear === exports.today.getFullYear()) {
-                    className += ` ${calendar_module_css_1.default['today']}`;
-                }
-                let style;
-                if (!(0, exports.inRangeTime)(timeValue, this.minDate, this.maxDate)) {
-                    className += ` ${calendar_module_css_1.default['invalid']}`;
-                }
-                else if (this.state.value instanceof Date) {
-                    if (this.state.value.getTime() === timeValue.getTime())
-                        className += ` ${calendar_module_css_1.default['selected']}`;
-                }
-                else if ((((_a = this.state.value) === null || _a === void 0 ? void 0 : _a.sTime.getDate()) === timeValue.getDate() && (Math.abs((0, date_fns_1.differenceInCalendarDays)(timeValue, this.state.value.sTime))) < 1) || (((_b = this.state.value) === null || _b === void 0 ? void 0 : _b.eTime.getDate()) === timeValue.getDate() && (Math.abs((0, date_fns_1.differenceInCalendarDays)(timeValue, this.state.value.eTime))) < 1)) {
-                    className += ` ${calendar_module_css_1.default['selected']} ${calendar_module_css_1.default[`${((_c = this.state.value) === null || _c === void 0 ? void 0 : _c.sTime.getDate()) === timeValue.getDate() && (Math.abs((0, date_fns_1.differenceInCalendarDays)(timeValue, this.state.value.sTime))) < 1 ? "start" : "end"}-range`]}`;
-                }
-                else if (this.state.value && (0, exports.inRangeTime)(timeValue, this.state.value.sTime, this.state.value.eTime)) {
-                    className += ` ${calendar_module_css_1.default['in-range']}`;
-                }
-                if (timeValue.getMonth() !== this.state.selectMonth) {
-                    typoClassName = "placeholder-2";
-                }
-                return react_1.default.createElement("div", { key: timeValue.toString(), className: className, style: style },
-                    react_1.default.createElement("button", { type: "button", className: `${typoClassName} row`, onClick: () => {
-                            const currentValue = this.state.value;
-                            if (this.props.range) {
-                                const newValue = (!currentValue || timeValue.getTime() < currentValue.sTime.getTime()) ? { sTime: timeValue, eTime: timeValue } : { sTime: currentValue.sTime, eTime: timeValue };
-                                this.setState(Object.assign(Object.assign({}, this.state), { value: newValue }));
-                                if (this.props.onSelect)
-                                    this.props.onSelect(newValue);
-                            }
-                            else {
-                                this.setState(Object.assign(Object.assign({}, this.state), { value: timeValue }));
-                                if (this.props.onSelect)
-                                    this.props.onSelect(timeValue);
-                            }
-                        } }, timeValue.getDate()));
-            }));
-    }
-    showMonthInYear() {
-        return react_1.default.createElement(react_1.default.Fragment, null, Array.from({ length: 12 }).map((_, i) => {
-            switch (i) {
-                case 0:
-                    var monthTitle = this.props.i18n.language === "en" ? "Jan" : this.props.t('january');
-                    break;
-                case 1:
-                    monthTitle = this.props.i18n.language === "en" ? "Feb" : this.props.t('february');
-                    break;
-                case 2:
-                    monthTitle = this.props.i18n.language === "en" ? "Mar" : this.props.t('march');
-                    break;
-                case 3:
-                    monthTitle = this.props.i18n.language === "en" ? "Apr" : this.props.t('april');
-                    break;
-                case 4:
-                    monthTitle = this.props.i18n.language === "en" ? "May" : this.props.t('may');
-                    break;
-                case 5:
-                    monthTitle = this.props.i18n.language === "en" ? "Jun" : this.props.t('june');
-                    break;
-                case 6:
-                    monthTitle = this.props.i18n.language === "en" ? "Jul" : this.props.t('july');
-                    break;
-                case 7:
-                    monthTitle = this.props.i18n.language === "en" ? "Aug" : this.props.t('august');
-                    break;
-                case 8:
-                    monthTitle = this.props.i18n.language === "en" ? "Sep" : this.props.t('september');
-                    break;
-                case 9:
-                    monthTitle = this.props.i18n.language === "en" ? "Oct" : this.props.t('october');
-                    break;
-                case 10:
-                    monthTitle = this.props.i18n.language === "en" ? "Nov" : this.props.t('november');
-                    break;
-                case 11:
-                    monthTitle = this.props.i18n.language === "en" ? "Dec" : this.props.t('december');
-                    break;
-                default:
-                    monthTitle = '';
-                    break;
-            }
-            const timeValue = new Date(this.state.selectYear, i);
-            let className = `${calendar_module_css_1.default['month-picker-circle']} month-picker-circle`;
-            if (this.state.selectYear === exports.today.getFullYear() && exports.today.getMonth() === i) {
-                className += ` ${calendar_module_css_1.default['today']}`;
-            }
-            if (!(0, exports.inRangeTime)(timeValue, this.minDate, this.maxDate)) {
-                className += ` ${calendar_module_css_1.default['invalid']}`;
-            }
-            else if (this.state.value instanceof Date) {
-                if (this.state.selectYear === this.state.value.getFullYear() && i === this.state.value.getMonth())
-                    className += ` ${calendar_module_css_1.default['selected']}`;
-            }
-            else if (this.state.value && ((i === this.state.value.sTime.getMonth() && this.state.value.sTime.getFullYear() === this.state.selectYear) || (i === this.state.value.eTime.getMonth() && this.state.value.eTime.getFullYear() === this.state.selectYear))) {
-                className += ` ${calendar_module_css_1.default['selected']} ${calendar_module_css_1.default[`${i === this.state.value.sTime.getMonth() && this.state.value.sTime.getFullYear() === this.state.selectYear ? "start" : "end"}-range`]}`;
-            }
-            else if (this.state.value && (0, exports.inRangeTime)(timeValue, this.state.value.sTime, this.state.value.eTime)) {
-                className += ` ${calendar_module_css_1.default['in-range']}`;
-            }
-            return react_1.default.createElement("div", { key: timeValue.toString(), className: className },
-                react_1.default.createElement("button", { type: "button", className: "body-3 row", onClick: () => { this.setState(Object.assign(Object.assign({}, this.state), { selectMonth: i, tab: CalendarTab.DATE })); } }, monthTitle));
-        }));
-    }
-    showYearInRange() {
-        return Array.from({ length: 12 }).map((_, i) => {
-            var _a, _b, _c;
-            let firstYearInTable = this.state.selectYear - ((this.state.selectYear - exports.startDate.getFullYear()) % 12);
-            let yearNumber = i + firstYearInTable;
-            let className = `${calendar_module_css_1.default['year-picker-circle']} year-picker-circle`;
-            if (yearNumber === exports.today.getFullYear()) {
-                className += ` ${calendar_module_css_1.default['today']}`;
-            }
-            if (yearNumber < this.minDate.getFullYear() || yearNumber > this.maxDate.getFullYear()) {
-                className += ` ${calendar_module_css_1.default['invalid']}`;
-            }
-            else if (this.state.value instanceof Date) {
-                if (yearNumber === this.state.value.getFullYear())
-                    className += ` ${calendar_module_css_1.default['selected']}`;
-            }
-            else if (yearNumber === ((_a = this.state.value) === null || _a === void 0 ? void 0 : _a.sTime.getFullYear()) || yearNumber === ((_b = this.state.value) === null || _b === void 0 ? void 0 : _b.eTime.getFullYear())) {
-                className += ` ${calendar_module_css_1.default['selected']} ${calendar_module_css_1.default[`${yearNumber === ((_c = this.state.value) === null || _c === void 0 ? void 0 : _c.sTime.getFullYear()) ? "start" : "end"}-range`]}`;
-            }
-            else if (this.state.value && yearNumber > this.state.value.sTime.getFullYear() && yearNumber < this.state.value.eTime.getFullYear()) {
-                className += ` ${calendar_module_css_1.default['in-range']}`;
-            }
-            return react_1.default.createElement("div", { key: yearNumber.toString(), className: className },
-                react_1.default.createElement("button", { type: "button", className: "body-3 row", onClick: () => { this.setState(Object.assign(Object.assign({}, this.state), { tab: CalendarTab.MONTH, selectYear: yearNumber })); } }, yearNumber));
-        });
-    }
-    getTitle() {
-        switch (this.state.tab) {
-            case CalendarTab.YEAR:
-                let firstYearInTable = this.state.selectYear - ((this.state.selectYear - exports.startDate.getFullYear()) % 12);
-                return `${firstYearInTable}-${firstYearInTable + 11}`;
-            case CalendarTab.MONTH:
-                return this.state.selectYear;
-            default:
-                switch (this.state.selectMonth) {
-                    case 0:
-                        var monthName = this.props.t('january');
-                        break;
-                    case 1:
-                        monthName = this.props.t('february');
-                        break;
-                    case 2:
-                        monthName = this.props.t('march');
-                        break;
-                    case 3:
-                        monthName = this.props.t('april');
-                        break;
-                    case 4:
-                        monthName = this.props.t('may');
-                        break;
-                    case 5:
-                        monthName = this.props.t('june');
-                        break;
-                    case 6:
-                        monthName = this.props.t('july');
-                        break;
-                    case 7:
-                        monthName = this.props.t('august');
-                        break;
-                    case 8:
-                        monthName = this.props.t('september');
-                        break;
-                    case 9:
-                        monthName = this.props.t('october');
-                        break;
-                    case 10:
-                        monthName = this.props.t('november');
-                        break;
-                    case 11:
-                        monthName = this.props.t('december');
-                        break;
-                    default:
-                        monthName = '';
-                        break;
-                }
-                return `${monthName}${this.props.i18n.language === 'en' ? ' ' : '/'}${this.state.selectYear}`;
-        }
-    }
-    render() {
-        var _a;
-        return react_1.default.createElement("div", { className: `${calendar_module_css_1.default['calendar-container']} col ${(_a = this.props.className) !== null && _a !== void 0 ? _a : ""}`, style: this.props.style },
-            this.props.header,
-            react_1.default.createElement("div", { className: `${calendar_module_css_1.default['picker-date-header']} row` },
-                react_1.default.createElement("button", { type: 'button', onClick: () => {
-                        switch (this.state.tab) {
-                            case CalendarTab.YEAR:
-                                if (this.state.selectYear - 10 < exports.startDate.getFullYear()) {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectYear: exports.startDate.getFullYear() }));
-                                }
-                                else {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectYear: this.state.selectYear - 10 }));
-                                }
-                                break;
-                            case CalendarTab.MONTH:
-                                const newTime = new Date(this.state.selectYear, this.state.selectMonth - 1);
-                                if (newTime.getTime() >= exports.startDate.getTime()) {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectYear: this.state.selectYear - 1 }));
-                                }
-                                break;
-                            default:
-                                const newDataVl = new Date(this.state.selectYear, this.state.selectMonth - 1);
-                                if (newDataVl.getTime() >= exports.startDate.getTime()) {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectMonth: newDataVl.getMonth(), selectYear: newDataVl.getFullYear() }));
-                                }
-                                break;
-                        }
-                    } },
-                    react_1.default.createElement(winicon_1.Winicon, { src: "fill/arrows/left-arrow", size: '1.4rem' })),
-                react_1.default.createElement("span", { className: "heading-7", onClick: () => {
-                        if (this.state.tab !== CalendarTab.YEAR)
-                            this.setState(Object.assign(Object.assign({}, this.state), { tab: this.state.tab === CalendarTab.DATE ? CalendarTab.MONTH : CalendarTab.YEAR }));
-                    } }, this.getTitle()),
-                react_1.default.createElement("button", { type: 'button', onClick: () => {
-                        switch (this.state.tab) {
-                            case CalendarTab.YEAR:
-                                if (this.state.selectYear + 10 > exports.endDate.getFullYear()) {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectYear: exports.endDate.getFullYear() }));
-                                }
-                                else {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectYear: this.state.selectYear + 10 }));
-                                }
-                                break;
-                            case CalendarTab.MONTH:
-                                const newTime = new Date(this.state.selectYear, this.state.selectMonth + 1);
-                                if (newTime.getTime() <= exports.endDate.getTime()) {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectYear: this.state.selectYear + 1 }));
-                                }
-                                break;
-                            default:
-                                const newDataVl = new Date(this.state.selectYear, this.state.selectMonth + 1);
-                                if (newDataVl.getTime() <= exports.endDate.getTime()) {
-                                    this.setState(Object.assign(Object.assign({}, this.state), { selectMonth: newDataVl.getMonth(), selectYear: newDataVl.getFullYear() }));
-                                }
-                                break;
-                        }
-                    } },
-                    react_1.default.createElement(winicon_1.Winicon, { src: "fill/arrows/right-arrow", size: '1.4rem' }))),
-            react_1.default.createElement("div", { className: `${calendar_module_css_1.default['picker-date-body']} row` }, this.state.tab === CalendarTab.YEAR ? this.showYearInRange() : this.state.tab === CalendarTab.MONTH ? this.showMonthInYear() : this.showDateInMonth()),
-            this.props.footer);
-    }
-}
-exports.Calendar = (0, react_i18next_1.withTranslation)()(TCalendar);

package/dist/component/card/card-info.d.ts

@@ -1,15 +0,0 @@
-import React, { CSSProperties } from 'react';
-import './card-info.css';
-interface CardData {
-    Name: string;
-    Image: string;
-    Subtitle: string;
-    DateCreated: string;
-    Content: string;
-    style?: CSSProperties;
-    className?: string;
-    direction?: "col" | "row";
-    mediaType?: "contain" | "cover" | "hug";
-}
-export declare function CardInfo({ Name, Subtitle, Image, Content, className, style, direction }: CardData): React.JSX.Element;
-export {};

package/dist/component/card/card-info.js

@@ -1,51 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardInfo = void 0;
-var react_1 = __importDefault(require("react"));
-require("./card-info.css");
-function CardInfo(_a) {
-    var Name = _a.Name, Subtitle = _a.Subtitle, Image = _a.Image, Content = _a.Content, _b = _a.className, className = _b === void 0 ? '' : _b, style = _a.style, direction = _a.direction;
-    return react_1.default.createElement("div", { className: "card-media-position ".concat(className.split(' ').filter(function (e) { return e !== 'row' && e !== 'col'; }).join(' '), " ").concat(direction), style: style },
-        react_1.default.createElement("div", { className: "media-preview-card" }, Image !== null && Image !== void 0 ? Image : react_1.default.createElement("img", { className: "media-preview-child", src: Image !== null && Image !== void 0 ? Image : "https://via.placeholder.com/40x40" })),
-        react_1.default.createElement("div", { className: "des-info" },
-            react_1.default.createElement("div", { className: "content-title" },
-                react_1.default.createElement("div", { className: "content-title-parent" },
-                    react_1.default.createElement("div", { className: "content-title-text" },
-                        " ", Name !== null && Name !== void 0 ? Name : 'Lorem Ipsum is simply dummy text'),
-                    react_1.default.createElement("div", { className: "content-subtitle-text" }, Subtitle !== null && Subtitle !== void 0 ? Subtitle : 'Subtitle')),
-                react_1.default.createElement("div", { className: "body-content" }, Content !== null && Content !== void 0 ? Content : 'Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.')),
-            react_1.default.createElement("div", { className: "sub-content-list" }, Array.from({ length: 3 }).map(function (e, i) { return react_1.default.createElement("div", { className: "item-sub-content" },
-                react_1.default.createElement("div", { className: "media-sub-content" },
-                    react_1.default.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-                        react_1.default.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.7262 5.38462C11.9431 5.60157 11.9431 5.95333 11.7262 6.17029L7.28172 10.6147C7.06476 10.8317 6.713 10.8317 6.49605 10.6147L4.27382 8.39251C4.05687 8.17555 4.05687 7.8238 4.27382 7.60684C4.49078 7.38988 4.84254 7.38988 5.0595 7.60684L6.88888 9.43622L10.9405 5.38462C11.1574 5.16766 11.5092 5.16766 11.7262 5.38462Z", fill: "#61616B" }),
-                        react_1.default.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M8 2.44412C4.93175 2.44412 2.44444 4.93143 2.44444 7.99967C2.44444 11.0679 4.93175 13.5552 8 13.5552C11.0682 13.5552 13.5555 11.0679 13.5555 7.99967C13.5555 4.93143 11.0682 2.44412 8 2.44412ZM1.33333 7.99967C1.33333 4.31778 4.3181 1.33301 8 1.33301C11.6819 1.33301 14.6667 4.31778 14.6667 7.99967C14.6667 11.6816 11.6819 14.6663 8 14.6663C4.3181 14.6663 1.33333 11.6816 1.33333 7.99967Z", fill: "#61616B" }))),
-                react_1.default.createElement("div", { className: "title-sub-content" }, "Graphic design ".concat(i))); })),
-            react_1.default.createElement("button", { type: 'button', className: "btn-seemore", onClick: function () { } },
-                react_1.default.createElement("div", { className: "button2" }, "See more"),
-                react_1.default.createElement("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-                    react_1.default.createElement("path", { d: "M7.04222 3.27596C6.86471 3.09845 6.86471 2.81064 7.04222 2.63313C7.21974 2.45562 7.50754 2.45562 7.68505 2.63313L10.8665 5.81461L10.8698 5.81793C10.9503 5.89994 11 6.01235 11 6.13636C11 6.198 10.9877 6.25676 10.9655 6.31036C10.9433 6.36397 10.9104 6.4142 10.8669 6.45778L7.68505 9.6396C7.50754 9.81711 7.21974 9.81711 7.04222 9.6396C6.86471 9.46208 6.86471 9.17428 7.04222 8.99677L9.44809 6.59091H1.45455C1.20351 6.59091 1 6.3874 1 6.13636C1 5.88533 1.20351 5.68182 1.45455 5.68182H9.44808L7.04222 3.27596Z", fill: "#287CF0" }))),
-            react_1.default.createElement("div", { className: "number-card" }, Array.from({ length: 3 }).map(function (e, i) {
-                return react_1.default.createElement("div", { className: "card" },
-                    react_1.default.createElement("div", { className: "card-infomation" },
-                        react_1.default.createElement("div", { className: "content1" },
-                            react_1.default.createElement("div", { className: "content-title-parent" },
-                                react_1.default.createElement("div", { className: "content-title4" }, "".concat(e)),
-                                react_1.default.createElement("div", { className: "content-subtitle-text" }, "Time on desgin")))));
-            }))),
-        react_1.default.createElement("div", { className: "combo-action-view" },
-            react_1.default.createElement("div", { className: "combo" },
-                react_1.default.createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-                    react_1.default.createElement("path", { d: "M17.5261 1.67395C17.9407 1.73017 18.2312 2.11184 18.175 2.52645L17.5689 6.99614C17.5128 7.4101 17.1322 7.70049 16.7181 7.64528L12.1726 7.03922C11.7579 6.98393 11.4665 6.6029 11.5218 6.18817C11.5771 5.77344 11.9582 5.48207 12.3729 5.53736L15.2903 5.92636C14.0585 4.38085 12.1438 3.40919 10 3.40919C6.25174 3.40919 3.18182 6.47911 3.18182 10.2274C3.18182 10.6458 2.84265 10.985 2.42425 10.985C2.00585 10.985 1.66667 10.6458 1.66667 10.2274C1.66667 5.64231 5.41494 1.89404 10 1.89404C12.5318 1.89404 14.8177 3.00972 16.3361 4.81209L16.6736 2.32287C16.7298 1.90826 17.1115 1.61773 17.5261 1.67395Z", fill: "#61616B" }),
-                    react_1.default.createElement("path", { d: "M18.3333 10.2281C18.3333 9.80972 17.9941 9.47054 17.5757 9.47054C17.1573 9.47054 16.8182 9.80972 16.8182 10.2281C16.8182 13.9764 13.7482 17.0463 9.99997 17.0463C7.85595 17.0463 5.94105 16.0745 4.70926 14.5287L7.6271 14.9177C8.04182 14.973 8.42285 14.6816 8.47815 14.2669C8.53345 13.8522 8.24207 13.4712 7.82734 13.4159L3.28189 12.8098C2.86781 12.7546 2.48719 13.045 2.43106 13.4589L1.825 17.9286C1.76878 18.3432 2.05931 18.7249 2.47391 18.7811C2.88852 18.8373 3.27019 18.5468 3.32641 18.1322L3.66388 15.6433C5.18221 17.4458 7.46818 18.5615 9.99997 18.5615C14.585 18.5615 18.3333 14.8132 18.3333 10.2281Z", fill: "#61616B" }))),
-            react_1.default.createElement("div", { className: "combo-button" },
-                react_1.default.createElement("div", { className: "button3" },
-                    react_1.default.createElement("div", { className: "button4" },
-                        react_1.default.createElement("div", { className: "button5" }, "Button"))),
-                react_1.default.createElement("div", { className: "button6" },
-                    react_1.default.createElement("div", { className: "button4" },
-                        react_1.default.createElement("div", { className: "button5" }, "Button"))))));
-}
-exports.CardInfo = CardInfo;

package/dist/component/card/card.d.ts

@@ -1,13 +0,0 @@
-import React, { CSSProperties, ReactNode } from 'react';
-import './card.css';
-interface cardInfoProps {
-    avatar?: ReactNode;
-    heading?: ReactNode;
-    subHeading?: ReactNode;
-    content?: ReactNode;
-    action?: ReactNode;
-    style?: CSSProperties;
-    className?: string;
-}
-export declare function CardSimple({ avatar, heading, subHeading, content, action, style, className }: cardInfoProps): React.JSX.Element;
-export {};

package/dist/component/card/card.js

@@ -1,33 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardSimple = void 0;
-var react_1 = __importDefault(require("react"));
-require("./card.css");
-function CardSimple(_a) {
-    var avatar = _a.avatar, heading = _a.heading, subHeading = _a.subHeading, content = _a.content, action = _a.action, style = _a.style, className = _a.className;
-    return react_1.default.createElement("div", { className: "card-new-grid ".concat(className !== null && className !== void 0 ? className : ''), style: style },
-        react_1.default.createElement("div", { className: "list-item" },
-            react_1.default.createElement("div", { className: "media" },
-                react_1.default.createElement("div", { className: "media-styleimage-circle" }, avatar !== null && avatar !== void 0 ? avatar : react_1.default.createElement("img", { className: "media-styleimage-circle-child", src: "https://via.placeholder.com/40x40" }))),
-            react_1.default.createElement("div", { className: "content" },
-                react_1.default.createElement("div", { className: "content-title-parent" },
-                    heading ? react_1.default.createElement("div", { className: "content-title" }, heading) : react_1.default.createElement("div", { className: "content-title" }, "name"),
-                    subHeading ? react_1.default.createElement("div", { className: "subtitle" }, subHeading) : react_1.default.createElement("div", { className: "subtitle" }, "sub"))),
-            react_1.default.createElement("div", { className: "media1" },
-                react_1.default.createElement("svg", { onClick: function () { }, width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-                    react_1.default.createElement("path", { d: "M3.60698 5.34049C3.35391 5.10851 2.94912 5.10851 2.69605 5.34049C2.43465 5.58011 2.43465 5.97512 2.69605 6.21474L7.54454 10.6592C7.7976 10.8912 8.2024 10.8912 8.45546 10.6592L13.3039 6.21474C13.5654 5.97512 13.5654 5.58011 13.3039 5.34049C13.0509 5.10851 12.6461 5.10851 12.393 5.34049L8 9.36743L3.60698 5.34049Z", fill: "#61616B" })))),
-        react_1.default.createElement("div", { className: "frame-parent" }, content !== null && content !== void 0 ? content : react_1.default.createElement("div", { className: "content-parent" },
-            react_1.default.createElement("div", { className: "content1" },
-                react_1.default.createElement("div", { className: "content-title-wrapper" },
-                    react_1.default.createElement("div", { className: "content-title" }, "value1")),
-                react_1.default.createElement("div", { className: "body-content" }, "content1")),
-            react_1.default.createElement("div", { className: "content1" },
-                react_1.default.createElement("div", { className: "content-title-wrapper" },
-                    react_1.default.createElement("div", { className: "content-title" }, "value2")),
-                react_1.default.createElement("div", { className: "body-content" }, "content2")))),
-        react_1.default.createElement("div", null, action !== null && action !== void 0 ? action : react_1.default.createElement("div", null)));
-}
-exports.CardSimple = CardSimple;

package/dist/component/checkbox/checkbox.d.ts

@@ -1,24 +0,0 @@
-import React, { CSSProperties } from 'react';
-interface CheckboxProps {
-    id?: string;
-    onChange?: (value: boolean, target: HTMLInputElement) => void;
-    value?: boolean;
-    checkColor?: string;
-    disabled?: boolean;
-    className?: string;
-    style?: CSSProperties;
-    /** default 2.4rem **/
-    size?: number | string;
-    onClick?: React.MouseEventHandler<HTMLLabelElement>;
-}
-interface CheckboxState {
-    value?: boolean;
-}
-export declare class Checkbox extends React.Component<CheckboxProps, CheckboxState> {
-    private ref;
-    constructor(props: CheckboxProps);
-    componentDidUpdate(prevProps: Readonly<CheckboxProps>): void;
-    onChange: () => void;
-    render(): React.JSX.Element;
-}
-export {};

package/dist/component/checkbox/checkbox.js

@@ -1,90 +0,0 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Checkbox = void 0;
-const react_1 = __importStar(require("react"));
-const checkbox_module_css_1 = __importDefault(require("./checkbox.module.css"));
-class Checkbox extends react_1.default.Component {
-    constructor(props) {
-        var _a;
-        super(props);
-        this.ref = (0, react_1.createRef)();
-        this.onChange = () => {
-            const newValue = !this.state.value;
-            this.setState({ value: newValue });
-            if (this.props.onChange && this.ref.current)
-                this.props.onChange(newValue, this.ref.current.querySelector("input"));
-        };
-        this.state = {
-            value: (_a = this.props.value) !== null && _a !== void 0 ? _a : false
-        };
-    }
-    componentDidUpdate(prevProps) {
-        if (prevProps.value !== this.props.value) {
-            this.setState({ value: this.props.value });
-        }
-    }
-    render() {
-        var _a, _b, _c;
-        let convertStyle = {
-            width: (_a = this.props.size) !== null && _a !== void 0 ? _a : '2.4rem',
-            height: (_b = this.props.size) !== null && _b !== void 0 ? _b : '2.4rem',
-        };
-        if (this.props.style) {
-            delete this.props.style.width;
-            delete this.props.style.minWidth;
-            delete this.props.style.maxWidth;
-            delete this.props.style.height;
-            delete this.props.style.minHeight;
-            delete this.props.style.maxHeight;
-            convertStyle = Object.assign(Object.assign({}, this.props.style), convertStyle);
-        }
-        return react_1.default.createElement("label", { ref: this.ref, id: this.props.id, className: `${checkbox_module_css_1.default['checkbox-container']} row ${(_c = this.props.className) !== null && _c !== void 0 ? _c : ''}`, style: convertStyle, "is-null-value": `${this.state.value == undefined}`, onClick: this.props.onClick },
-            react_1.default.createElement("input", { type: "checkbox", checked: this.state.value ? true : false, disabled: this.props.disabled, onChange: (ev) => {
-                    ev.stopPropagation();
-                    const newValue = !this.state.value;
-                    this.setState({ value: newValue });
-                    if (this.props.onChange)
-                        this.props.onChange(newValue, ev.target);
-                } }),
-            react_1.default.createElement("svg", { width: "100%", height: "100%", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", style: { '--check-color': this.props.checkColor } }, this.state.value === undefined ?
-                react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.79199 9.95298C4.79199 9.69148 5.00398 9.47949 5.26548 9.47949H14.7352C14.9967 9.47949 15.2087 9.69148 15.2087 9.95298C15.2087 10.2145 14.9967 10.4265 14.7352 10.4265H5.26548C5.00398 10.4265 4.79199 10.2145 4.79199 9.95298Z" }) :
-                react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.07 6.49317C15.2549 6.67808 15.2549 6.97787 15.07 7.16278L8.91467 13.3181C8.72977 13.503 8.42997 13.503 8.24507 13.3181L4.93067 10.0037C4.74577 9.81878 4.74577 9.51899 4.93067 9.33408C5.11558 9.14917 5.41537 9.14917 5.60028 9.33408L8.57987 12.3137L14.4004 6.49317C14.5853 6.30827 14.8851 6.30827 15.07 6.49317Z" })));
-    }
-}
-exports.Checkbox = Checkbox;

package/dist/component/ck-editor/ckeditor.d.ts

@@ -1,36 +0,0 @@
-import React, { CSSProperties } from 'react';
-import { ClassicEditor, EventInfo } from 'ckeditor5';
-import './ck-editor.css';
-/**
- * Please update the following values with your tokens.
- * Instructions on how to obtain them: https://ckeditor.com/docs/trial/latest/guides/real-time/quick-start.html
- */
-interface Props {
-    style?: CSSProperties;
-    className?: string;
-    value?: string;
-    placeholder?: string;
-    disabled?: boolean;
-    menuBar?: boolean;
-    onChange?: (event: EventInfo, editor: ClassicEditor) => void;
-    onFocus?: (event: EventInfo, editor: ClassicEditor) => void;
-    onBlur?: (event: EventInfo, editor: ClassicEditor) => void;
-    onError?: (error: Error, details: any) => void;
-    onReady?: (editor: ClassicEditor) => void;
-    onAfterDestroy?: (editor: ClassicEditor) => void;
-    extraPlugins?: Array<any>;
-    fontFamily?: Array<string>;
-    fontSize?: Array<number | "default">;
-    fontColors?: Array<{
-        color: string;
-        label: string;
-    }>;
-    fontBgColors?: Array<{
-        color: string;
-        label: string;
-    }>;
-    helperText?: string;
-    helperTextColor?: string;
-}
-export declare function CustomCkEditor5(props: Props): React.JSX.Element;
-export {};