@steroidsjs/bootstrap 3.0.0-beta.9 → 3.0.0-beta.91

package/form/TimeField/TimePanelView.scss

@@ -1,85 +1,82 @@
-.TimePanelView {
-
-  font-weight: 500;
-  user-select: none;
-
-  &__header {
-    height: 45px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    border-left: 1px solid $border-default;
-    border-bottom: 1px solid $border-default;
-  }
-
-  &__body {
-    display: flex;
-    flex-flow: row nowrap;
-    border-radius: $input-border-radius;
-  }
+@use "../../scss/variables";
+@use '../../scss/mixins';
 
-  &__column {
-    height: 220px;
-    overflow-y: auto;
-    list-style: none;
-    padding: 0;
-    margin: 0;
-
-    border-bottom: 1px solid $border-default;
-    &:not(:last-child) {
-      border-right: 1px solid $border-default;
-    }
-  }
+.TimePanelView {
+    font-weight: 500;
+    user-select: none;
 
-  &__cell {
-    padding: 5px 20px;
-    cursor: pointer;
+    &__header {
+        height: 45px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
 
-    &_selected {
-      background-color: $primary-light;
+        border-left: 1px solid variables.$border-default;
+        border-bottom: 1px solid variables.$border-default;
     }
 
-    transition: background-color .1s ease-in;
-    &:hover {
-      background-color: $back-disabled;
+    &__body {
+        display: flex;
+        flex-flow: row nowrap;
+        border-radius: variables.$input-border-radius;
     }
-  }
 
-  &__footer {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 10px;
-
-    &_to-end {
-      justify-content: flex-end;
+    &__column {
+        height: 220px;
+        overflow-y: auto;
+        list-style: none;
+        padding: 0;
+        margin: 0;
+        @include mixins.scrollWrapper(298px, 0, variables.$scroll-thumb-color, variables.$scroll-track-color);
     }
-  }
 
-  &__button {
-    border: none;
+    &__cell {
+        padding: 5px 20px;
+        cursor: pointer;
 
-    &_now {
-      color: $primary;
-      background-color: unset;
+        &_selected {
+            background-color: variables.$primary-light;
+        }
 
-      transition: color .1s ease-in;
-      &:hover {
-        color: $primary-dark;
-      }
+        transition: background-color 0.1s ease-in;
+        &:hover {
+            background-color: variables.$back-disabled;
+        }
     }
 
-    &_ok {
-      color: #fff;
-      border-radius: 4px;
-      background-color: $primary;
+    &__footer {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 10px;
 
-      transition: background-color .1s ease-in;
-      &:hover {
-        background-color: $primary-dark;
-      }
+        &_to-end {
+            justify-content: flex-end;
+        }
     }
-  }
 
+    &__button {
+        border: none;
+
+        &_now {
+            color: variables.$primary;
+            background-color: unset;
+
+            transition: color 0.1s ease-in;
+            &:hover {
+                color: variables.$primary-dark;
+            }
+        }
+
+        &_ok {
+            color: #fff;
+            border-radius: 4px;
+            background-color: variables.$primary;
+
+            transition: background-color 0.1s ease-in;
+            &:hover {
+                background-color: variables.$primary-dark;
+            }
+        }
+    }
 }

package/form/TimeRangeField/TimeRangeFieldView.d.ts

@@ -0,0 +1,2 @@
+import { ITimeRangeFieldViewProps } from '@steroidsjs/core/ui/form/TimeRangeField/TimeRangeField';
+export default function TimeRangeFieldView(props: ITimeRangeFieldViewProps): JSX.Element;

package/form/TimeRangeField/TimeRangeFieldView.js

@@ -0,0 +1,67 @@
+"use strict";
+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 __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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var react_1 = __importStar(require("react"));
+var useBem_1 = __importDefault(require("@steroidsjs/core/hooks/useBem"));
+var content_1 = require("@steroidsjs/core/ui/content");
+var TimePanelView_1 = __importDefault(require("../TimeField/TimePanelView"));
+function TimeRangeFieldView(props) {
+    var bem = (0, useBem_1["default"])('TimeRangeFieldView');
+    var hasValue = props.inputPropsFrom.value || props.inputPropsTo.value;
+    var renderTimeRange = (0, react_1.useCallback)(function () { return (react_1["default"].createElement("div", { className: bem.element('panel-container') },
+        react_1["default"].createElement(TimePanelView_1["default"], __assign({}, props.timePanelFromViewProps)),
+        react_1["default"].createElement(TimePanelView_1["default"], __assign({}, props.timePanelToViewProps)))); }, [bem, props.timePanelFromViewProps, props.timePanelToViewProps]);
+    return (react_1["default"].createElement(content_1.DropDown, { position: "bottomLeft", content: renderTimeRange, onClose: props.onClose, visible: props.isOpened, className: bem.element('dropdown'), hasArrow: false },
+        react_1["default"].createElement("div", { className: bem(bem.block({
+                disabled: props.disabled,
+                size: props.size,
+                'is-invalid': !!props.errors
+            }), props.className), style: props.style },
+            react_1["default"].createElement("div", { className: bem.element('body') },
+                react_1["default"].createElement("input", __assign({}, props.inputPropsFrom, { className: bem(bem.element('input')), onChange: function (e) { return props.inputPropsFrom.onChange(e.target.value); } })),
+                react_1["default"].createElement("input", __assign({}, props.inputPropsTo, { className: bem.element('input'), onChange: function (e) { return props.inputPropsTo.onChange(e.target.value); } })),
+                react_1["default"].createElement("div", { className: bem.element('icon-container') },
+                    props.icon && !hasValue && (react_1["default"].createElement(content_1.Icon, { className: bem.element('date-icon'), name: typeof props.icon === 'string' ? props.icon : 'calendar_range', tabIndex: -1 })),
+                    props.showRemove && hasValue && (react_1["default"].createElement(content_1.Icon, { className: bem.element('close-icon'), onClick: function (e) {
+                            e.preventDefault();
+                            props.onClear();
+                        }, name: 'cross_8x8' }))),
+                react_1["default"].createElement("span", { className: bem.element('effect') })))));
+}
+exports["default"] = TimeRangeFieldView;

package/form/TimeRangeField/TimeRangeFieldView.scss

@@ -0,0 +1,81 @@
+@use "sass:map";
+@use "../../scss/variables";
+@use '../../scss/mixins';
+
+.TimeRangeFieldView {
+    $root: &;
+    
+    @include mixins.icon-container($root);
+
+    @include mixins.date-range-body($root);
+
+    &__body {
+        > * {
+            &:nth-child(1) {
+                width: 140px;
+            }
+        }
+    }
+
+    &_size {
+        @each $size, $size-map in mixins.$date-sizes {
+            &_#{$size} {
+                #{$root}__body {
+                    #{$root}__input {
+                        &:nth-child(1) {
+                            width: calc(map.get($size-map, first-input-width) + 60px);
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    @include mixins.date-range-input();
+
+    @include mixins.date-range-sizes($root);
+
+    @include mixins.date-range-effects($root);
+
+    @include mixins.date-time-panel($root);
+
+    &__dropdown { 
+        background-color: variables.$element-background-color;
+
+        display: flex;
+    }
+
+    &__panel-container {
+        display: flex;
+        flex-flow: row nowrap;
+        column-gap: 47px;
+
+        .TimePanelView__footer { 
+            padding: 0;
+            padding-top: 10px;
+            display: flex;
+            flex-flow: row nowrap;
+            column-gap: 10px;
+        }
+
+        .TimePanelView:nth-child(1) {
+            position: relative;
+
+            &::before {
+                content: "";
+                position: absolute;
+                display: block;
+                top: 0;
+                right: -23px;
+                transform: translateX(-50%);
+                height: 100%;
+                width: 1px;
+                background-color: mixins.$date-range-separator-color;
+            }
+        }
+
+        .TimePanelView__button_ok { 
+            display: none;
+        }
+    }
+}

package/icons/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (customIcons: Record<string, any>) => {};
+export default _default;

package/icons/index.js

@@ -0,0 +1,110 @@
+"use strict";
+/* eslint-disable import/no-dynamic-require */
+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);
+};
+exports.__esModule = true;
+exports["default"] = (function (customIcons) {
+    // All icons
+    var icons = {};
+    var steroidsIcons = [
+        'add',
+        'add_square',
+        'arrow_down_18x18',
+        'arrow_down_24x24',
+        'arrow_drop_down_10x10',
+        'arrow_left_18x18',
+        'arrow_left_24x24',
+        'arrow_right_18x18',
+        'arrow_right_24x24',
+        'arrow_up_18x18',
+        'arrow_up_24x24',
+        'blank',
+        'calendar_check',
+        'chart',
+        'checkmark_12x12',
+        'checkmark_8x8',
+        'circle_cross_12x12',
+        'circle_cross_16x16',
+        'circle_cross_18x18',
+        'copy',
+        'cross_12x12',
+        'cross_8x8',
+        'default_16x16',
+        'default_24x24',
+        'cut',
+        'error_16x16',
+        'error_24x24',
+        'calendar_range',
+        'double_arrow_down',
+        'double_arrow_left',
+        'double_arrow_right',
+        'double_arrow_up',
+        'doughnut_chart',
+        'edit',
+        'expand_down',
+        'expand_left',
+        'expand_left_double',
+        'expand_right',
+        'expand_right_double',
+        'file_dock',
+        'filter',
+        'fluid',
+        'folder',
+        'group',
+        'home',
+        'img_box',
+        'import',
+        'info_16x16',
+        'info_24x24',
+        'loading_purple',
+        'loading_default',
+        'loading_icon_thick',
+        'map',
+        'menu_dots',
+        'menu_left',
+        'minis_sq',
+        'paste',
+        'pie_chart',
+        'pin',
+        'sad',
+        'search',
+        'setting_line',
+        'share',
+        'star',
+        'success_16x16',
+        'success_24x24',
+        'support',
+        'trash',
+        'upload',
+        'user',
+        'view_hide',
+        'warning_16x16',
+        'warning_24x24',
+        'clip',
+        'view',
+        'cross_4x4',
+        'expand_up',
+        'left_12x12',
+        'cancel_ellips',
+        'facebook',
+        'instagram',
+        'telegram',
+        'vk',
+        'whatsapp',
+        'burger',
+        'sort',
+    ];
+    steroidsIcons.forEach(function (iconName) {
+        icons[iconName] = require("./svgs/".concat(iconName, ".svg"));
+    });
+    return __assign(__assign({}, icons), customIcons);
+});

package/icons/svgs/add.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 6L12 18" stroke="#323232" stroke-linecap="round"/>
+<path d="M18 12L6 12" stroke="#323232" stroke-linecap="round"/>
+</svg>

package/icons/svgs/add_square.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.5 11C3.5 9.10025 3.50106 7.72573 3.64199 6.67754C3.78098 5.64373 4.04772 5.00253 4.52513 4.52513C5.00253 4.04772 5.64373 3.78098 6.67754 3.64199C7.72573 3.50106 9.10025 3.5 11 3.5H13C14.8998 3.5 16.2743 3.50106 17.3225 3.64199C18.3563 3.78098 18.9975 4.04772 19.4749 4.52513C19.9523 5.00253 20.219 5.64373 20.358 6.67754C20.4989 7.72573 20.5 9.10025 20.5 11V13C20.5 14.8998 20.4989 16.2743 20.358 17.3225C20.219 18.3563 19.9523 18.9975 19.4749 19.4749C18.9975 19.9523 18.3563 20.219 17.3225 20.358C16.2743 20.4989 14.8998 20.5 13 20.5H11C9.10025 20.5 7.72573 20.4989 6.67754 20.358C5.64373 20.219 5.00253 19.9523 4.52513 19.4749C4.04772 18.9975 3.78098 18.3563 3.64199 17.3225C3.50106 16.2743 3.5 14.8998 3.5 13V11Z" stroke="#323232"/>
+<path d="M12 8L12 16" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16 12L8 12" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_down_18x18.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="3.86768" width="18" height="18" rx="6" fill="white"/>
+<path d="M8 10.8677L12 14.8677L16 10.8677" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_down_24x24.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect y="0.867676" width="24" height="24" rx="8" fill="white"/>
+<path d="M8 10.8677L12 14.8677L16 10.8677" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_drop_down_10x10.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.2318 14.0781L8.36682 10.6402C7.82405 9.98886 8.2872 9 9.13504 9L14.865 9C15.7128 9 16.176 9.98886 15.6332 10.6402L12.7682 14.0781C12.3684 14.5579 11.6316 14.5579 11.2318 14.0781Z" fill="#323232"/>
+</svg>

package/icons/svgs/arrow_left_18x18.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="3.86768" width="18" height="18" rx="6" fill="white"/>
+<path d="M14 8.86768L10 12.8677L14 16.8677" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_left_24x24.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect y="0.867676" width="24" height="24" rx="8" fill="white"/>
+<path d="M14 8.86768L10 12.8677L14 16.8677" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_right_18x18.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="3.86768" width="18" height="18" rx="6" fill="white"/>
+<path d="M10 16.8677L14 12.8677L10 8.86768" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_right_24x24.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+
+<rect y="0.867676" width="24" height="24" rx="8" fill="white"/>
+<path d="M10 16.8677L14 12.8677L10 8.86768" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_up_18x18.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="3.86768" width="18" height="18" rx="6" fill="white"/>
+<path d="M16 14.8677L12 10.8677L8 14.8677" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/arrow_up_24x24.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect y="0.867676" width="24" height="24" rx="8" fill="white"/>
+<path d="M16 14.8677L12 10.8677L8 14.8677" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/blank.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.1716 21H9C7.11438 21 6.17157 21 5.58579 20.4142C5 19.8284 5 18.8856 5 17V7C5 5.11438 5 4.17157 5.58579 3.58579C6.17157 3 7.11438 3 9 3H15C16.8856 3 17.8284 3 18.4142 3.58579C19 4.17157 19 5.11438 19 7V14.1716C19 14.5803 19 14.7847 18.9239 14.9685C18.8478 15.1522 18.7032 15.2968 18.4142 15.5858L13.5858 20.4142C13.2968 20.7032 13.1522 20.8478 12.9685 20.9239C12.7847 21 12.5803 21 12.1716 21Z" stroke="#323232"/>
+<path d="M12 21V16.3333C12 15.2334 12 14.6834 12.3417 14.3417C12.6834 14 13.2334 14 14.3333 14H19" stroke="#323232"/>
+</svg>

package/icons/svgs/burger.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 7.44922H19" stroke="#323232" stroke-linecap="round"/>
+<path d="M5 12.4492H15" stroke="#323232" stroke-linecap="round"/>
+<path d="M5 17.4492H11" stroke="#323232" stroke-linecap="round"/>
+</svg>

package/icons/svgs/calendar_check.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.5 9.5V8.7C19.5 7.57989 19.5 7.01984 19.282 6.59202C19.0903 6.21569 18.7843 5.90973 18.408 5.71799C17.9802 5.5 17.4201 5.5 16.3 5.5H7.7C6.5799 5.5 6.01984 5.5 5.59202 5.71799C5.21569 5.90973 4.90973 6.21569 4.71799 6.59202C4.5 7.01984 4.5 7.57989 4.5 8.7V9.5M19.5 9.5V16.3C19.5 17.4201 19.5 17.9802 19.282 18.408C19.0903 18.7843 18.7843 19.0903 18.408 19.282C17.9802 19.5 17.4201 19.5 16.3 19.5H7.7C6.57989 19.5 6.01984 19.5 5.59202 19.282C5.21569 19.0903 4.90973 18.7843 4.71799 18.408C4.5 17.9802 4.5 17.4201 4.5 16.3V9.5M19.5 9.5H4.5" stroke="#323232"/>
+<path d="M8.5 3.5L8.5 7.5M15.5 3.5L15.5 7.5" stroke="#323232" stroke-linecap="round"/>
+<path d="M9 15.6364L10.8462 17L15 12" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/calendar_range.svg

@@ -0,0 +1,8 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.5 9.5V8.7C19.5 7.57989 19.5 7.01984 19.282 6.59202C19.0903 6.21569 18.7843 5.90973 18.408 5.71799C17.9802 5.5 17.4201 5.5 16.3 5.5H7.7C6.5799 5.5 6.01984 5.5 5.59202 5.71799C5.21569 5.90973 4.90973 6.21569 4.71799 6.59202C4.5 7.01984 4.5 7.57989 4.5 8.7V9.5M19.5 9.5V16.3C19.5 17.4201 19.5 17.9802 19.282 18.408C19.0903 18.7843 18.7843 19.0903 18.408 19.282C17.9802 19.5 17.4201 19.5 16.3 19.5H7.7C6.57989 19.5 6.01984 19.5 5.59202 19.282C5.21569 19.0903 4.90973 18.7843 4.71799 18.408C4.5 17.9802 4.5 17.4201 4.5 16.3V9.5M19.5 9.5H4.5" stroke="#323232"/>
+<path d="M8.5 3.5L8.5 7.5M15.5 3.5L15.5 7.5" stroke="#323232" stroke-linecap="round"/>
+<path d="M8 12.5H10" stroke="#323232" stroke-linecap="round"/>
+<path d="M14 12.5H16" stroke="#323232" stroke-linecap="round"/>
+<path d="M8 16.5H10" stroke="#323232" stroke-linecap="round"/>
+<path d="M14 16.5H16" stroke="#323232" stroke-linecap="round"/>
+</svg>

package/icons/svgs/cancel_ellips.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="9" stroke="#323232"/>
+<path d="M18 18L6 6" stroke="#323232"/>
+</svg>

package/icons/svgs/chart.svg

@@ -0,0 +1,6 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 10L8 16" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12 12V16" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16 8V16" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+<rect x="3" y="4" width="18" height="16" rx="2" stroke="#323232"/>
+</svg>

package/icons/svgs/checkmark_12x12.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="3.86768" width="18" height="18" rx="9" fill="white"/>
+<path d="M15 10.8677L10.875 14.8677L9 13.0495" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/checkmark_8x8.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="6" y="6.86768" width="12" height="12" rx="6" fill="white"/>
+<path d="M15 10.8677L10.875 14.8677L9 13.0495" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/circle_cross_12x12.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="6" y="6.86768" width="12" height="12" rx="6" fill="white"/>
+<path d="M10 10.8677L14 14.8533M10 14.8677L14 10.8821" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/circle_cross_16x16.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="4.5" y="4" width="16" height="16" rx="8" fill="#323232"/>
+<path d="M9.5 9L15.5 14.9784M9.5 15L15.5 9.02161" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/circle_cross_18x18.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="3.86768" width="18" height="18" rx="9" fill="white"/>
+<path d="M9 9.86768L15 15.8461M9 15.8677L15 9.88928" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/clip.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.88872 14.0017C8.88872 14.0017 13.832 9.12047 14.8208 8.09069C15.8096 7.06091 16.7991 8.09069 16.7991 8.09069C16.7991 8.09069 17.7872 9.12063 16.7984 10.1505C15.8096 11.1803 9.03457 18.2456 9.03457 18.2456C7.86986 19.418 6.09749 19.5617 4.93279 18.3894C3.76809 17.2176 3.65356 15.4415 4.81826 14.2697L12.8439 6.03086C14.4744 4.38971 17.1486 4.38982 18.7767 6.03097C20.4084 7.67271 20.4072 10.569 18.7767 12.2101L12.8439 18.2456" stroke="#323232" stroke-linecap="round"/>
+</svg>

package/icons/svgs/copy.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.78125 4.48496C4.78125 3.64488 4.78125 3.22484 4.94474 2.90398C5.08855 2.62173 5.31802 2.39226 5.60026 2.24845C5.92113 2.08496 6.34117 2.08496 7.18125 2.08496H8.74178C9.09734 2.08496 9.27513 2.08496 9.44302 2.12407C9.5919 2.15875 9.73461 2.21598 9.86619 2.29379C10.0146 2.38153 10.1431 2.50438 10.4001 2.75007L12.0396 4.31721C12.3131 4.5786 12.4498 4.70929 12.5477 4.86353C12.6345 5.00025 12.6985 5.15013 12.7374 5.30734C12.7813 5.48468 12.7813 5.67382 12.7813 6.05211V9.68496C12.7813 10.525 12.7813 10.9451 12.6178 11.2659C12.474 11.5482 12.2445 11.7777 11.9622 11.9215C11.6414 12.085 11.2213 12.085 10.3813 12.085H7.18125C6.34117 12.085 5.92113 12.085 5.60026 11.9215C5.31802 11.7777 5.08855 11.5482 4.94474 11.2659C4.78125 10.9451 4.78125 10.525 4.78125 9.68496V4.48496Z" stroke="#323232"/>
+<path d="M2.94922 3.91504V9.91504C2.94922 11.3152 2.94922 12.0152 3.2217 12.55C3.46139 13.0204 3.84384 13.4029 4.31424 13.6426C4.84902 13.915 5.54909 13.915 6.94922 13.915H10.9492" stroke="#323232" stroke-linecap="round"/>
+<path d="M9.05078 2.08496V3.68496C9.05078 4.52504 9.05078 4.94508 9.21427 5.26595C9.35808 5.54819 9.58755 5.77766 9.8698 5.92147C10.1907 6.08496 10.6107 6.08496 11.4508 6.08496H13.0508" stroke="#323232"/>
+</svg>

package/icons/svgs/cross_12x12.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 6L6 18" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6 6L18 18" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/cross_4x4.svg

@@ -0,0 +1,3 @@
+<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.28906 6.5L10.2891 10.4856M6.28906 10.5L10.2891 6.51441" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/cross_8x8.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 8L8 16" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8 8L16 16" stroke="#323232" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/cut.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.744 10.8572C5.84 11.0477 5.84 11.2382 5.84 11.4287C5.84 12.4763 4.976 13.3334 3.92 13.3334C2.864 13.3334 2 12.4763 2 11.4287C2 10.381 2.864 9.52389 3.92 9.52389C4.112 9.52389 4.208 9.52389 4.304 9.61913M7.184 9.42865L11.216 13.3334H13.904L5.744 5.23818C5.84 5.0477 5.84 4.95246 5.84 4.76199C5.84 3.71437 4.976 2.85722 3.92 2.85722C2.864 2.85722 2 3.71437 2 4.76199C2 5.80961 2.864 6.66675 3.92 6.66675C4.112 6.66675 4.304 6.66675 4.4 6.57151L5.84 8.09532M7.184 9.42865L5.84 8.09532M7.184 9.42865L5.168 10.0953L5.84 8.09532M8.144 5.71437L11.312 2.66675H14L9.584 7.14294" stroke="#323232" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/date_range.svg

@@ -0,0 +1,8 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.5 9.94916V9.14916C19.5 8.02905 19.5 7.469 19.282 7.04118C19.0903 6.66485 18.7843 6.35889 18.408 6.16714C17.9802 5.94916 17.4201 5.94916 16.3 5.94916H7.7C6.5799 5.94916 6.01984 5.94916 5.59202 6.16714C5.21569 6.35889 4.90973 6.66485 4.71799 7.04118C4.5 7.469 4.5 8.02905 4.5 9.14916V9.94916M19.5 9.94916V16.7492C19.5 17.8693 19.5 18.4293 19.282 18.8571C19.0903 19.2335 18.7843 19.5394 18.408 19.7312C17.9802 19.9492 17.4201 19.9492 16.3 19.9492H7.7C6.57989 19.9492 6.01984 19.9492 5.59202 19.7312C5.21569 19.5394 4.90973 19.2335 4.71799 18.8571C4.5 18.4293 4.5 17.8693 4.5 16.7492V9.94916M19.5 9.94916H4.5" stroke="white"/>
+<path d="M8.5 3.94916L8.5 7.94916M15.5 3.94916L15.5 7.94916" stroke="white" stroke-linecap="round"/>
+<path d="M8 12.9492H10" stroke="white" stroke-linecap="round"/>
+<path d="M14 12.9492H16" stroke="white" stroke-linecap="round"/>
+<path d="M8 16.9492H10" stroke="white" stroke-linecap="round"/>
+<path d="M14 16.9492H16" stroke="white" stroke-linecap="round"/>
+</svg>

package/icons/svgs/default_16x16.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12.8677" r="8" fill="#CBD5DB"/>
+<path d="M14.2747 10.4196H14.2253M15.7582 10.4196L16.5 10.7657L15.7582 11.1119M13.4341 12.4965C13.4341 13.3371 12.7912 13.98 11.9505 13.98C11.1099 13.98 8.83516 13.98 7.5 13.98M13.9286 8.93604C14.8681 8.93604 15.6593 9.72724 15.6593 10.7163C15.6593 11.2602 15.4121 11.8042 15.0165 12.1009C15.4121 12.5954 15.6593 13.2382 15.6593 13.9305C15.6593 15.513 14.4231 16.7987 12.8901 16.7987C11.3571 16.7987 9.97253 15.3646 8.73626 13.9305C9.67582 12.5954 12.5934 8.93604 13.9286 8.93604Z" stroke="white" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/icons/svgs/default_24x24.svg

@@ -0,0 +1,11 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_413_9689)">
+<circle cx="12" cy="12.8677" r="12" fill="#CBD5DB"/>
+<path d="M15.033 9.60351H14.967M17.011 9.60351L18 10.065L17.011 10.5266M13.9121 12.3727C13.9121 13.4936 13.0549 14.3508 11.9341 14.3508C10.8132 14.3508 7.78022 14.3508 6 14.3508M14.5714 7.62549C15.8242 7.62549 16.8791 8.68043 16.8791 9.99911C16.8791 10.7244 16.5494 11.4497 16.022 11.8453C16.5494 12.5046 16.8791 13.3618 16.8791 14.2848C16.8791 16.3947 15.2308 18.109 13.1868 18.109C11.1429 18.109 9.2967 16.1969 7.64835 14.2848C8.9011 12.5046 12.7912 7.62549 14.5714 7.62549Z" stroke="white" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_413_9689">
+<rect width="24" height="24" fill="white" transform="translate(0 0.867676)"/>
+</clipPath>
+</defs>
+</svg>