foxit-component 0.0.1-alpha.5 → 0.0.1-alpha.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/es/Button/Button.d.ts +2 -1
  2. package/es/Button/Button.js +4 -4
  3. package/es/Checkbox/Checkbox.d.ts +10 -2
  4. package/es/Checkbox/Checkbox.js +35 -5
  5. package/es/Empty/Empty.js +0 -1
  6. package/es/Form/Form.js +0 -1
  7. package/es/Form/FormItem.js +0 -1
  8. package/es/Form/FormProvider.js +95 -107
  9. package/es/Input/Input.js +3 -3
  10. package/es/Menu/Menu.js +0 -1
  11. package/es/Modal/Modal.js +95 -11
  12. package/es/Modal/ModalTemp.js +4 -1
  13. package/es/Pagination/Pagination.d.ts +1 -0
  14. package/es/Pagination/Pagination.js +19 -11
  15. package/es/Radio/Radio.js +0 -1
  16. package/es/Select/Select.d.ts +9 -0
  17. package/es/Select/Select.js +24 -10
  18. package/es/Switch/Switch.d.ts +9 -0
  19. package/es/Switch/Switch.js +20 -0
  20. package/es/Table/Table.d.ts +3 -1
  21. package/es/Table/Table.js +12 -8
  22. package/es/Tabs/Tabs.js +0 -1
  23. package/es/Tag/Tag.d.ts +1 -1
  24. package/es/Tag/Tag.js +1 -2
  25. package/es/Toast/Toast.js +0 -1
  26. package/es/Toast/ToastContainer.js +0 -1
  27. package/es/Tooltip/Tooltip.js +0 -1
  28. package/es/constants/icons.d.ts +1 -0
  29. package/es/constants/icons.js +1 -0
  30. package/es/index.css +1 -0
  31. package/es/index.d.ts +1 -0
  32. package/es/index.js +1 -0
  33. package/es/node_modules/tslib/tslib.es6.js +39 -1
  34. package/package.json +1 -1
  35. package/es/Button/button.css.js +0 -6
  36. package/es/Checkbox/checkbox.css.js +0 -6
  37. package/es/Empty/empty.css.js +0 -6
  38. package/es/Form/form.css.js +0 -6
  39. package/es/Input/input.css.js +0 -6
  40. package/es/Menu/menu.css.js +0 -6
  41. package/es/Modal/modal.css.js +0 -6
  42. package/es/Pagination/pagination.css.js +0 -6
  43. package/es/Radio/radio.css.js +0 -6
  44. package/es/Table/table.css.js +0 -6
  45. package/es/Tabs/tabs.css.js +0 -6
  46. package/es/Tag/tag.css.js +0 -6
  47. package/es/Toast/toast.css.js +0 -6
  48. package/es/Tooltip/tooltip.css.js +0 -6
  49. package/es/node_modules/style-inject/dist/style-inject.es.js +0 -28
@@ -1,15 +1,19 @@
1
1
  import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
2
  import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import { useState, useEffect } from 'react';
4
- import './pagination.css.js';
5
4
 
6
5
  var $_MORE = 9999999999;
7
6
  var Pagination = function (_a) {
8
- var total = _a.total, pageSize = _a.pageSize, onChange = _a.onChange, _b = _a.defaultCurrent, defaultCurrent = _b === void 0 ? 1 : _b;
9
- var _c = useState(defaultCurrent), current = _c[0], setCurrent = _c[1];
7
+ var total = _a.total, pageSize = _a.pageSize, onChange = _a.onChange, _b = _a.defaultCurrent, defaultCurrent = _b === void 0 ? 1 : _b, currentProp = _a.current;
8
+ var _c = useState(currentProp !== undefined ? currentProp : defaultCurrent), current = _c[0], setCurrent = _c[1];
10
9
  var _d = useState([]), pages = _d[0], setPages = _d[1];
11
10
  var maxButtons = 5;
12
11
  var totalPages = Math.ceil(total / pageSize);
12
+ useEffect(function () {
13
+ if (currentProp !== undefined && currentProp !== current) {
14
+ setCurrent(currentProp);
15
+ }
16
+ }, [currentProp, current]);
13
17
  useEffect(function () {
14
18
  var generatePages = function () {
15
19
  var pageArray = [];
@@ -49,14 +53,16 @@ var Pagination = function (_a) {
49
53
  var handleClick = function (page, index) {
50
54
  if (page === $_MORE) {
51
55
  if (index > 0 && pages[index - 1] !== null && pages[index - 1] !== 1) {
52
- setCurrent(pages[index - 1] + 1);
53
- onChange === null || onChange === void 0 ? void 0 : onChange(pages[index - 1] + 1);
56
+ var newPage = pages[index - 1] + 1;
57
+ setCurrent(newPage);
58
+ onChange === null || onChange === void 0 ? void 0 : onChange(newPage);
54
59
  }
55
60
  else if (index < pages.length - 1 &&
56
61
  pages[index + 1] !== null &&
57
62
  pages[index + 1] !== totalPages) {
58
- setCurrent(pages[index + 1] - 1);
59
- onChange === null || onChange === void 0 ? void 0 : onChange(pages[index + 1] - 1);
63
+ var newPage = pages[index + 1] - 1;
64
+ setCurrent(newPage);
65
+ onChange === null || onChange === void 0 ? void 0 : onChange(newPage);
60
66
  }
61
67
  }
62
68
  else if (page !== current) {
@@ -66,14 +72,16 @@ var Pagination = function (_a) {
66
72
  };
67
73
  var handlePrev = function () {
68
74
  if (current > 1) {
69
- setCurrent(current - 1);
70
- onChange === null || onChange === void 0 ? void 0 : onChange(current - 1);
75
+ var newPage = current - 1;
76
+ setCurrent(newPage);
77
+ onChange === null || onChange === void 0 ? void 0 : onChange(newPage);
71
78
  }
72
79
  };
73
80
  var handleNext = function () {
74
81
  if (current < totalPages) {
75
- setCurrent(current + 1);
76
- onChange === null || onChange === void 0 ? void 0 : onChange(current + 1);
82
+ var newPage = current + 1;
83
+ setCurrent(newPage);
84
+ onChange === null || onChange === void 0 ? void 0 : onChange(newPage);
77
85
  }
78
86
  };
79
87
  return total > pageSize ? (jsxs("div", __assign({ className: "foxit-pagination-container" }, { children: [jsx("button", __assign({ className: "foxit-pagination-prev", onClick: handlePrev, disabled: current === 1 }, { children: '<' })), pages.map(function (page, index) { return (jsx("button", __assign({ className: "foxit-pagination-button", onClick: function () { return handleClick(page, index); }, disabled: page === current }, { children: page === $_MORE ? '...' : page }), index)); }), jsx("button", __assign({ className: "foxit-pagination-next", onClick: handleNext, disabled: current === totalPages }, { children: '>' }))] }))) : null;
package/es/Radio/Radio.js CHANGED
@@ -1,7 +1,6 @@
1
1
  import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
2
  import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import { createContext, useContext, useState } from 'react';
4
- import './radio.css.js';
5
4
 
6
5
  var RadioContext = createContext({});
7
6
  var Radio = function (_a) {
@@ -12,6 +12,15 @@ export interface SelectProps {
12
12
  isMulti?: boolean;
13
13
  placeholder?: string;
14
14
  preIcon?: React.ReactNode;
15
+ value?: string | number | CustomOption | null;
16
+ onChange?: (v: unknown) => void;
17
+ }
18
+ interface CustomOption {
19
+ readonly value: string | number;
20
+ readonly label: string;
21
+ readonly color?: string;
22
+ readonly isFixed?: boolean;
23
+ readonly isDisabled?: boolean;
15
24
  }
16
25
  declare const Select: React.FC<SelectProps>;
17
26
  export default Select;
@@ -5,15 +5,18 @@ import classNames from 'classnames';
5
5
  import { Icon } from '../Icon/index.js';
6
6
 
7
7
  var Select = function (_a) {
8
- var options = _a.options, className = _a.className, defaultValue = _a.defaultValue, isDisabled = _a.isDisabled, isClearable = _a.isClearable, isSearchable = _a.isSearchable, isMulti = _a.isMulti, _b = _a.placeholder, placeholder = _b === void 0 ? 'Select...' : _b, preIcon = _a.preIcon, rest = __rest(_a, ["options", "className", "defaultValue", "isDisabled", "isClearable", "isSearchable", "isMulti", "placeholder", "preIcon"]);
8
+ var options = _a.options, className = _a.className, defaultValue = _a.defaultValue, isDisabled = _a.isDisabled, isClearable = _a.isClearable, isSearchable = _a.isSearchable, isMulti = _a.isMulti, _b = _a.placeholder, placeholder = _b === void 0 ? 'Select...' : _b, preIcon = _a.preIcon, value = _a.value, onChange = _a.onChange, rest = __rest(_a, ["options", "className", "defaultValue", "isDisabled", "isClearable", "isSearchable", "isMulti", "placeholder", "preIcon", "value", "onChange"]);
9
9
  var customStyles = {
10
- control: function (styles) { return (__assign(__assign({}, styles), { backgroundColor: 'white',
11
- // minWidth: 200,
12
- height: 48, borderRadius: 10, fontSize: 14, boxShadow: 'none', border: '1px solid #B3B3B3', ':hover': {
13
- border: '1px solid #757575'
14
- }, ':focus-within': {
15
- border: '1px solid #FF5F00'
16
- } })); },
10
+ control: function (styles, _a) {
11
+ var isDisabled = _a.isDisabled;
12
+ return (__assign(__assign({}, styles), { backgroundColor: isDisabled ? '#f8f8f8' : 'white',
13
+ // minWidth: 200,
14
+ height: 48, paddingLeft: 8, borderRadius: 10, fontSize: 14, boxShadow: 'none', border: '1px solid #D9D9D9', ':hover': {
15
+ border: '1px solid #757575'
16
+ }, ':focus-within': {
17
+ border: '1px solid #FF5F00'
18
+ } }));
19
+ },
17
20
  option: function (styles, _a) {
18
21
  var isSelected = _a.isSelected, isFocused = _a.isFocused;
19
22
  return __assign(__assign({}, styles), { backgroundColor: isFocused ? '#FFF6F0' : 'white', color: isSelected ? '#FF5F00' : '#666', ':hover': {
@@ -26,7 +29,7 @@ var Select = function (_a) {
26
29
  };
27
30
  var CustomControl = function (props) { return (jsxs(components.Control, __assign({}, props, { children: [preIcon && (jsx("div", __assign({ style: {
28
31
  display: 'flex',
29
- paddingLeft: 16,
32
+ paddingLeft: 8,
30
33
  marginRight: -4,
31
34
  color: props.hasValue ? '#525252' : '#B3B3B3'
32
35
  } }, { children: preIcon }))), props.children] }))); };
@@ -36,7 +39,18 @@ var Select = function (_a) {
36
39
  return Array.isArray(defaultValue) &&
37
40
  defaultValue.includes(option.value);
38
41
  })
39
- : options.find(function (option) { return option.value === defaultValue; }), isDisabled: isDisabled, isClearable: isClearable, isSearchable: isSearchable, isMulti: isMulti, components: { Control: CustomControl, Option: CustomOptionComp } }, rest)));
42
+ : options.find(function (option) { return option.value === defaultValue; }), isDisabled: isDisabled, isClearable: isClearable, isSearchable: isSearchable, isMulti: isMulti, components: { Control: CustomControl, Option: CustomOptionComp }, onChange: onChange }, rest, {
43
+ // value={
44
+ // isMulti
45
+ // ? options.filter(
46
+ // (option) =>
47
+ // Array.isArray(value) && (value as (string | number)[]).includes(option.value)
48
+ // )
49
+ // : options.find((option) => option.value === value) || value as CustomOption || null
50
+ // }
51
+ value: isMulti && Array.isArray(value)
52
+ ? value.map(function (v) { return options.find(function (option) { return option.value === v; }); })
53
+ : options.find(function (option) { return option.value === value; }) || value })));
40
54
  };
41
55
 
42
56
  export { Select as default };
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import './switch.css';
3
+ interface FoxitSwitchProps {
4
+ value?: boolean;
5
+ onChange?: (value: boolean) => void;
6
+ size?: 'small' | 'large';
7
+ }
8
+ declare const Switch: React.FC<FoxitSwitchProps>;
9
+ export { Switch };
@@ -0,0 +1,20 @@
1
+ import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import { useState } from 'react';
4
+
5
+ var Switch = function (_a) {
6
+ var value = _a.value, onChange = _a.onChange, _b = _a.size, size = _b === void 0 ? 'large' : _b;
7
+ var _c = useState(value || false), internalValue = _c[0], setInternalValue = _c[1];
8
+ var isControlled = value !== undefined;
9
+ var handleToggle = function () {
10
+ if (onChange) {
11
+ onChange(!isControlled ? !internalValue : !value);
12
+ }
13
+ if (!isControlled) {
14
+ setInternalValue(!internalValue);
15
+ }
16
+ };
17
+ return (jsx("div", __assign({ className: "foxit-switch ".concat(size, " ").concat(isControlled ? (value ? 'checked' : '') : internalValue ? 'checked' : ''), onClick: handleToggle }, { children: jsx("div", { className: "foxit-switch-handle" }) })));
18
+ };
19
+
20
+ export { Switch };
@@ -10,6 +10,8 @@ export interface Column<T> {
10
10
  interface TableProps<T> {
11
11
  columns: Column<T>[];
12
12
  data: T[];
13
+ loading?: boolean;
14
+ emptyText?: React.ReactNode;
13
15
  }
14
- declare const Table: <T>({ columns, data }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
16
+ declare const Table: <T>({ columns, data, loading, emptyText }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
15
17
  export default Table;
package/es/Table/Table.js CHANGED
@@ -1,15 +1,19 @@
1
1
  import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
2
  import { jsx, jsxs } from 'react/jsx-runtime';
3
- import './table.css.js';
3
+ import Empty from '../Empty/Empty.js';
4
+ import { Icon } from '../Icon/index.js';
4
5
 
5
6
  var Table = function (_a) {
6
- var columns = _a.columns, data = _a.data;
7
- return (jsx("div", __assign({ className: "foxit-table" }, { children: jsxs("table", __assign({ className: "foxit-table-container" }, { children: [jsx("thead", { children: jsx("tr", { children: columns.map(function (column, index) { return (jsx("th", __assign({ style: {
8
- width: column.width ? "".concat(column.width, "px") : 'auto',
9
- textAlign: column.align || 'left'
10
- } }, { children: column.title }), index)); }) }) }), jsx("tbody", { children: data.map(function (record, rowIndex) { return (jsx("tr", __assign({ className: rowIndex % 2 === 0 ? 'foxit-even-row' : 'foxit-odd-row' }, { children: columns.map(function (column, colIndex) { return (jsx("td", __assign({ style: { textAlign: column.align || 'left' } }, { children: column.render
11
- ? column.render(record[column.dataIndex], record)
12
- : record[column.dataIndex] }), colIndex)); }) }), rowIndex)); }) })] })) })));
7
+ var columns = _a.columns, data = _a.data, loading = _a.loading, emptyText = _a.emptyText;
8
+ return !loading && data.length === 0 ? (jsx(Empty, { description: emptyText || 'No Data' })) : (jsxs("div", __assign({ className: "foxit-table" }, { children: [loading ? (jsx("div", __assign({ className: "foxit-table-loading" }, { children: jsx(Icon, { name: "LoadingOutlined", className: "foxit-table-icon-loading" }) }))) : null, jsxs("table", __assign({ className: "foxit-table-container" }, { children: [jsx("thead", { children: jsx("tr", { children: columns.map(function (column, index) { return (jsx("th", __assign({ style: {
9
+ width: column.width ? "".concat(column.width, "px") : 'auto',
10
+ textAlign: column.align || 'left'
11
+ } }, { children: column.title }), index)); }) }) }), jsx("tbody", { children: data.map(function (record, rowIndex) { return (jsx("tr", __assign({ className: rowIndex % 2 === 0 ? 'foxit-even-row' : 'foxit-odd-row' }, { children: columns.map(function (column, colIndex) { return (jsx("td", __assign({ style: { textAlign: column.align || 'left' } }, { children: column.render
12
+ ? column.render(record[column.dataIndex], record)
13
+ : typeof record[column.dataIndex] === 'object'
14
+ ? JSON.stringify(record[column.dataIndex]) // 将对象转换为字符串
15
+ : String(record[column.dataIndex]) // 确保它是一个字符串
16
+ }), colIndex)); }) }), rowIndex)); }) })] }))] })));
13
17
  };
14
18
 
15
19
  export { Table as default };
package/es/Tabs/Tabs.js CHANGED
@@ -1,7 +1,6 @@
1
1
  import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
2
  import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import { useState } from 'react';
4
- import './tabs.css.js';
5
4
 
6
5
  var ButtonTabs = function (_a) {
7
6
  var _b;
package/es/Tag/Tag.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import './tag.css';
3
3
  interface TagProps {
4
- color: 'active' | 'canceled' | 'pending' | 'offline' | 'trial' | 'expired';
4
+ color?: 'active' | 'canceled' | 'pending' | 'offline' | 'trial' | 'expired' | string;
5
5
  children: React.ReactNode;
6
6
  }
7
7
  declare const Tag: React.FC<TagProps>;
package/es/Tag/Tag.js CHANGED
@@ -1,9 +1,8 @@
1
1
  import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
2
  import { jsx } from 'react/jsx-runtime';
3
- import './tag.css.js';
4
3
 
5
4
  var Tag = function (_a) {
6
- var color = _a.color, children = _a.children;
5
+ var _b = _a.color, color = _b === void 0 ? 'active' : _b, children = _a.children;
7
6
  var className = "foxit-tag foxit-tag-".concat(color);
8
7
  return jsx("span", __assign({ className: className }, { children: children }));
9
8
  };
package/es/Toast/Toast.js CHANGED
@@ -3,7 +3,6 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
3
3
  import { useState, useRef, useEffect } from 'react';
4
4
  import { CSSTransition } from 'react-transition-group';
5
5
  import classNames from 'classnames';
6
- import './toast.css.js';
7
6
  import { Icon } from '../Icon/index.js';
8
7
 
9
8
  var Toast = function (_a) {
@@ -2,7 +2,6 @@ import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
2
  import { jsx, Fragment } from 'react/jsx-runtime';
3
3
  import { useState, useEffect } from 'react';
4
4
  import { createRoot } from 'react-dom/client';
5
- import './toast.css.js';
6
5
  import Toast from './Toast.js';
7
6
 
8
7
  var createToastContainer = function (toastManager, duration, unique) {
@@ -1,7 +1,6 @@
1
1
  import { __assign } from '../node_modules/tslib/tslib.es6.js';
2
2
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
3
3
  import { useState, useRef } from 'react';
4
- import './tooltip.css.js';
5
4
 
6
5
  var Tooltip = function (_a) {
7
6
  var title = _a.title, children = _a.children;
@@ -19,6 +19,7 @@ export declare const ICONS: Readonly<{
19
19
  QuestionCircleOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
20
20
  EditorOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
21
21
  DateOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
22
+ DownLoadOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
22
23
  SuccessColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
23
24
  ErrorColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
24
25
  WarningColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
@@ -21,6 +21,7 @@ var ICONS = Object.freeze({
21
21
  QuestionCircleOutlined: function (className) { return (jsx("svg", __assign({ width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M6.99961 1.11328C5.85742 1.11328 4.74089 1.45198 3.79119 2.08654C2.8415 2.72111 2.1013 3.62304 1.66421 4.67828C1.22711 5.73353 1.11275 6.89469 1.33558 8.01493C1.55841 9.13517 2.10842 10.1642 2.91607 10.9718C3.72372 11.7795 4.75272 12.3295 5.87296 12.5523C6.99321 12.7751 8.15437 12.6608 9.20961 12.2237C10.2649 11.7866 11.1668 11.0464 11.8013 10.0967C12.4359 9.14701 12.7746 8.03047 12.7746 6.88828C12.7746 5.35666 12.1662 3.88776 11.0832 2.80474C10.0001 1.72172 8.53124 1.11328 6.99961 1.11328ZM7.36361 9.72328C7.24823 9.83218 7.09527 9.89236 6.93661 9.89128C6.85726 9.89282 6.77843 9.87809 6.70499 9.84799C6.63155 9.81789 6.56506 9.77307 6.50961 9.71628C6.45336 9.6619 6.40881 9.59659 6.37872 9.52436C6.34862 9.45214 6.33361 9.37452 6.33461 9.29628C6.33139 9.21775 6.34539 9.13946 6.37562 9.06691C6.40585 8.99436 6.45158 8.92929 6.50961 8.87628C6.56565 8.82076 6.63241 8.77722 6.70582 8.74834C6.77924 8.71946 6.85776 8.70583 6.93661 8.70828C7.01658 8.70528 7.09631 8.71863 7.17094 8.74752C7.24557 8.7764 7.31351 8.82022 7.37061 8.87628C7.42864 8.92929 7.47437 8.99436 7.5046 9.06691C7.53483 9.13946 7.54883 9.21775 7.54561 9.29628C7.5468 9.37725 7.53124 9.4576 7.49993 9.53228C7.46861 9.60697 7.4222 9.67437 7.36361 9.73028V9.72328ZM8.55361 6.50328C8.33257 6.73093 8.09886 6.94594 7.85361 7.14728C7.70967 7.26306 7.59264 7.40876 7.51061 7.57428C7.42001 7.7418 7.3742 7.92987 7.37761 8.12028V8.26028H6.50261V8.12028C6.4928 7.84907 6.55053 7.57966 6.67061 7.33628C6.91984 6.94271 7.23199 6.59272 7.59461 6.30028L7.73461 6.14628C7.8778 5.9777 7.95927 5.76537 7.96561 5.54428C7.96151 5.30371 7.86647 5.07362 7.69961 4.90028C7.60526 4.81469 7.49469 4.7489 7.37445 4.70681C7.25421 4.66473 7.12675 4.64721 6.99961 4.65528C6.84625 4.64246 6.69213 4.66844 6.55145 4.73083C6.41077 4.79322 6.28806 4.89001 6.19461 5.01228C6.0327 5.26142 5.95425 5.55561 5.97061 5.85228H5.13061C5.119 5.59615 5.15885 5.34028 5.24782 5.09982C5.3368 4.85935 5.47308 4.63917 5.64861 4.45228C5.8393 4.27146 6.06499 4.13159 6.31179 4.0413C6.55858 3.95101 6.82125 3.91221 7.08361 3.92728C7.5572 3.88677 8.02826 4.02959 8.39961 4.32628C8.56609 4.47339 8.69724 4.65617 8.78329 4.86099C8.86934 5.06581 8.90808 5.28741 8.89661 5.50928C8.89943 5.87224 8.77845 6.22533 8.55361 6.51028V6.50328Z", fill: "currentColor" }) }))); },
22
22
  EditorOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { d: "M8.39447 12.9991C8.38198 13.0151 8.36948 13.0318 8.36392 13.0519L7.40054 16.5839C7.34427 16.7896 7.40193 17.0111 7.55406 17.1674C7.66798 17.2785 7.818 17.3396 7.97776 17.3396C8.03054 17.3396 8.08333 17.3334 8.13542 17.3195L11.6424 16.363C11.648 16.363 11.6508 16.3679 11.6549 16.3679C11.6952 16.3679 11.7348 16.3533 11.7647 16.3227L21.1424 6.94643C21.4209 6.66757 21.5737 6.28762 21.5737 5.87434C21.5737 5.40584 21.375 4.9377 21.027 4.59073L20.1414 3.70374C19.7942 3.35573 19.3253 3.15674 18.8571 3.15674C18.4439 3.15674 18.0639 3.30956 17.7847 3.58773L8.40836 12.9665C8.39867 12.9755 8.40143 12.9887 8.39447 12.9991ZM20.2248 6.02819L19.2933 6.95898L17.7833 5.42495L18.7016 4.50669C18.8467 4.36084 19.128 4.38204 19.2947 4.5494L20.181 5.43642C20.2734 5.5288 20.3262 5.65172 20.3262 5.77327C20.3255 5.87297 20.29 5.96327 20.2248 6.02819ZM10.0622 13.1464L16.8289 6.37931L18.3397 7.91437L11.5855 14.6682L10.0622 13.1464ZM8.8293 15.89L9.31828 14.0952L10.6227 15.3997L8.8293 15.89Z", fill: "currentColor" }), jsx("path", { d: "M20.8187 9.74373C20.4638 9.74373 20.1727 10.0323 20.1714 10.3921V19.1339C20.1714 19.5923 19.7991 19.9646 19.3399 19.9646H4.55207C4.09364 19.9646 3.71993 19.5924 3.71993 19.1339V4.86561C3.71993 4.4068 4.09364 4.03416 4.55207 4.03416H14.0763C14.4333 4.03416 14.723 3.7442 14.723 3.38713C14.723 3.03083 14.4333 2.74048 14.0763 2.74048H4.45345C3.33585 2.74048 2.42627 3.64937 2.42627 4.76766V19.2326C2.42627 20.3509 3.33585 21.2594 4.45345 21.2594H19.4378C20.5562 21.2594 21.4654 20.3509 21.4654 19.2326V10.388C21.4639 10.0323 21.1737 9.74373 20.8187 9.74373Z", fill: "currentColor" })] }))); },
23
23
  DateOutlined: function (className) { return (jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M9 6H15V5H17V6H20V19H4V6H7V5H9V6ZM18 8H6V17H18V8ZM10 10V12H8V10H10ZM13 10V12H11V10H13ZM16 10V12H14V10H16ZM10 13V15H8V13H10ZM13 13V15H11V13H13ZM16 13V15H14V13H16Z", fill: "currentColor" }) }))); },
24
+ DownLoadOutlined: function (className) { return (jsx("svg", __assign({ width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M11.9969 5.21521H9.14154V0.932129H4.85844V5.21521H2.00307L6.99999 10.2121L11.9969 5.21521ZM2.00307 11.6398V13.0675H11.9969V11.6398H2.00307Z", fill: "currentColor" }) }))); },
24
25
  // ColoursOutlined 带颜色的图标
25
26
  SuccessColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("rect", { width: "24", height: "24", rx: "12", fill: "#30DC6B" }), jsx("path", { d: "M7.33337 12.6665L10 15.3332L16.6667 8.6665", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] }))); },
26
27
  ErrorColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("rect", { width: "24", height: "24", rx: "12", fill: "#FF3C3C" }), jsx("path", { d: "M15.9854 7.75732L7.50007 16.2426", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }), jsx("path", { d: "M7.5 7.75732L15.9853 16.2426", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })] }))); },
package/es/index.css ADDED
@@ -0,0 +1 @@
1
+ .foxit-checkbox-container{cursor:pointer;display:inline-block;padding-left:25px;position:relative;-webkit-user-select:none;user-select:none}.foxit-checkbox-container input{cursor:pointer;opacity:0;position:absolute}.foxit-checkbox-checkmark{background-color:#fff;border:1px solid #b3b3b3;border-radius:4px;height:20px;left:0;position:absolute;top:0;width:20px}.foxit-checkbox-content{line-height:20px}.foxit-checkbox-container input:checked~.foxit-checkbox-checkmark{background-color:#ff5f00;border:none}.foxit-checkbox-checkmark:after{content:"";display:none;position:absolute}.foxit-checkbox-container input:checked~.foxit-checkbox-checkmark:after{display:block}.foxit-checkbox-container .foxit-checkbox-checkmark:after{border:solid #fff;border-width:0 2px 2px 0;height:10px;left:7px;top:4px;transform:rotate(45deg);width:6px}.foxit-checkbox-container.disabled{color:#00000040;cursor:not-allowed;opacity:.6}.foxit-checkbox-checkmark.disabled{background-color:#f5f5f5;border:1px solid #d9d9d9}.foxit-empty{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:20px;text-align:center}.foxit-empty-image{margin-bottom:16px}.foxit-empty-description{color:#757575;font-size:14px}.foxit-form-item{margin-bottom:16px}.foxit-form-item label{color:#525252;display:block;font-size:14px;font-weight:500;margin-bottom:8px}.foxit-form-error-text{color:#e22727;font-size:12px;margin-top:8px}.foxit-form-warning-text{color:orange;margin-top:8px}.foxit-form-item>.foxit-form-error-component .foxit-checkbox-container,.foxit-form-item>.foxit-form-error-component .foxit-input-wrapper,.foxit-form-item>.foxit-form-error-component .foxit-radio-container,.foxit-form-item>.foxit-form-error-component .foxit-select-wrapper>:nth-child(3){border:1px solid #e22727!important}.foxit-form-item>.foxit-form-warning-component .foxit-checkbox-container,.foxit-form-item>.foxit-form-warning-component .foxit-input-wrapper,.foxit-form-item>.foxit-form-warning-component .foxit-radio-container,.foxit-form-item>.foxit-form-warning-component .foxit-select-wrapper>:nth-child(3){border-color:orange!important}.foxit-input-wrapper{align-items:center;border:1px solid #d9d9d9;border-radius:10px;display:flex;font-size:14px;font-weight:400;padding:11px 16px;transition:border-color .3s}.foxit-input-wrapper:focus-within{border-color:#ff5f00!important}.foxit-input-wrapper:hover{border-color:#757575}.foxit-input-element{border:none;color:#525252;flex:1;line-height:24px;outline:none}.foxit-input-element::placeholder{color:#b3b3b3}.foxit-input-addon{align-items:center;color:#b3b3b3;cursor:pointer;display:flex;padding:0 8px;transition:color .3s}.foxit-input-wrapper:focus-within .foxit-input-addon{color:#ff5f00!important}.foxit-input-wrapper:hover .foxit-input-addon{color:#757575}.foxit-input-wrapper :disabled,.foxit-input-wrapper-disabled{background-color:#f8f8f8}.foxit-input-wrapper-disabled:hover{border-color:#d9d9d9}.foxit-input-wrapper-disabled .foxit-input-element{color:#b3b3b3}.foxit-pagination-container{align-items:center;display:flex;justify-content:center}.foxit-pagination-button,.foxit-pagination-next,.foxit-pagination-prev{background-color:initial;border:none;border-radius:10px;color:#757575;cursor:pointer;font-size:16px;font-weight:500;height:48px;margin:0 4px;min-width:48px;padding:0 12px;transition:background-color .3s ease,color .3s ease}.foxit-pagination-next:hover,.foxit-pagination-prev:hover{color:#ff5f00}.foxit-pagination-button:hover{background-color:#ff5f001a}.foxit-pagination-button:disabled{background-color:#ff5f00;color:#fff;cursor:default}.foxit-radio-container{cursor:pointer;display:inline-block;padding-left:25px;position:relative;-webkit-user-select:none;user-select:none}.foxit-radio-container input{cursor:pointer;opacity:0;position:absolute}.foxit-radio-checkmark{background-color:#fff;border:1px solid #b3b3b3;border-radius:50%;height:20px;left:0;position:absolute;top:0;width:20px}.foxit-radio-content{line-height:20px}.foxit-radio-container input:checked~.foxit-radio-checkmark{background-color:#fff;border:1px solid #ff5f00}.foxit-radio-checkmark:after{content:"";display:none;position:absolute}.foxit-radio-container input:checked~.foxit-radio-checkmark:after{display:block}.foxit-radio-container .foxit-radio-checkmark:after{background:#ff5f00;border-radius:50%;height:10px;left:4px;top:4px;width:10px}.foxit-radio-container.disabled{cursor:not-allowed;opacity:.6}.foxit-table{border:1px solid #ff5f00;border-radius:10px;color:#373737;min-height:200px;overflow:hidden;position:relative}.foxit-table-loading{align-items:center;background-color:#ffffffb3;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.foxit-table-icon-loading{animation:spin 1s linear infinite;color:#ff5f00}.foxit-table-container{border-collapse:collapse;width:100%}.foxit-table-container td,.foxit-table-container th{height:70px;min-height:70px;padding:24px}.foxit-table-container th{background-color:#fff6f0;font-size:16px;font-weight:700}.foxit-table-container td{font-size:14px;font-weight:400}.foxit-table-container .foxit-even-row{background-color:#fff}.foxit-table-container .foxit-odd-row{background-color:#fff6f0}.foxit-tabs{display:flex;gap:8px}.foxit-tab-item{background-color:#f1f3f4;border:none;border-radius:10px;color:#757575;cursor:pointer;font-weight:600;padding:14px 20px;transition:background-color .3s,color .3s}.foxit-tab-item.active{background-color:#ff5f00;color:#fff}.foxit-tab-item:hover:not(.active){background-color:#e0e0e0}.foxit-tab-content{margin-top:16px}.foxit-tag{border-radius:5px;display:inline-block;font-size:12px;font-weight:600;height:24px;min-height:24px;padding:4px 8px;white-space:nowrap}.foxit-tag-active{background-color:#edfafa;color:#0f8b8d}.foxit-tag-canceled{background-color:#ffecec;color:#e22727}.foxit-tag-pending{background-color:#fbf4d0;color:#9b8827}.foxit-tag-offline{background-color:#edecff;color:#6462c6}.foxit-tag-trial{background-color:#e4f4fe;color:#2288ce}.foxit-tag-expired{background-color:#ececec;color:#757575}.foxit-toast-container{left:50%;pointer-events:none;position:fixed;top:0;transform:translateX(-50%);transition-delay:0s;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:2000}.foxit-toast-loading{animation:spin 1s linear infinite;color:#ff5f00}.foxit-toast-loading-overlay{background-color:#000;height:100vh;inset:0;opacity:.15;pointer-events:auto;position:fixed;z-index:10}.foxit-toast-item{align-items:center;background-color:#fff;border:none;border-radius:50px;color:#525252;display:flex;flex-direction:row;gap:8px;justify-content:center;margin-bottom:16px;margin-left:auto;margin-right:auto;padding:9px 12px;position:relative;top:102px;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:fit-content;z-index:20}.foxit-toast-item-success{background-color:#ddfae8;color:#1f7f40}.foxit-toast-item-error{background-color:#fae5dd;color:#e22727}.foxit-toast-item-warning{background-color:#fff0e7;color:#525252}.foxit-toast-enter{opacity:0;transform:translateY(-100%)}.foxit-toast-enter-active{transition:all .5s ease-out}.foxit-toast-enter-active,.foxit-toast-exit{opacity:1;transform:translateY(0)}.foxit-toast-exit-active{opacity:0;transform:translateY(-100%);transition:all .5s ease-in}.foxit-tooltip-container{display:inline-block;position:relative;width:auto}.foxit-tooltip-content{background-color:#525252;border-radius:10px;color:#fff;max-width:300px;padding:12px 16px;width:max-content;z-index:1}.foxit-tooltip-arrow,.foxit-tooltip-content{left:50%;position:absolute;transform:translateX(-50%)}.foxit-tooltip-arrow{border-left:5px solid #0000;border-right:5px solid #0000;border-top:5px solid #525252;bottom:-5px;height:0;width:0}.foxit-button{align-items:center;border:0;border-radius:10px;cursor:pointer;display:flex;font-size:14px;font-weight:600;justify-content:center;letter-spacing:.42px}.foxit-button:hover{opacity:.8}.foxit-button-primary{background-color:#ff5f00;color:#fff}.foxit-button-secondary{background-color:#fff;border:2px solid #ff5f00;color:#ff5f00}.foxit-button-small{border-radius:5px;height:38px;padding-left:24px;padding-right:24px}.foxit-button-small svg{height:16px;width:16px}.foxit-button-medium{border-radius:5px;height:44px;padding-left:32px;padding-right:32px}.foxit-button-medium svg{height:20px;width:20px}.foxit-button-large{height:56px;padding-left:32px;padding-right:32px}.foxit-button-loading{animation:spin 1s linear infinite;margin-right:8px}.foxit-button-primary .foxit-button-loading{color:#fff}.foxit-button-secondary .foxit-button-loading{color:#ff5f00}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.foxit-menu{border-radius:10px;box-shadow:0 2px 8px #00000026;font-size:14px;overflow:hidden}.foxit-menu-item-content{align-items:center;cursor:pointer;display:flex;padding:12px 16px}.foxit-menu-item{padding-left:0}.foxit-menu-item.selected{background-color:#fff6f0!important;color:#ff5f00;font-weight:600}.foxit-menu-item:hover{background-color:#f5f6f8}.foxit-menu-submenu-title{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:12px 16px}.foxit-menu-submenu-title:hover{background-color:#f5f6f8}.foxit-menu-icon{transition:transform .3s ease-in-out}.foxit-menu-rotated-icon{transform:rotate(180deg)}.foxit-menu-item-label{font-weight:600}.foxit-modal-content-container{background-color:#fff;border-radius:10px;display:flex;flex-direction:column;gap:24px;justify-content:space-between;min-width:320px;padding:24px}.foxit-modal-head{align-items:center;display:flex;justify-content:space-between}.foxit-modal-title{font-size:20px;font-weight:500}.foxit-modal-close-button{align-items:center;cursor:pointer;display:flex;height:16px;justify-content:center;width:16px}.foxit-modal-close-button svg{stroke:#6b7280}.foxit-modal-close-button:hover svg{stroke:#ea580c}.foxit-modal-footer{display:flex;gap:16px;justify-content:flex-end}.foxit-modal-fixed-layout{align-items:center;display:flex;flex-direction:column;inset:0;padding:36px;position:fixed;z-index:50}.foxit-modal-justify-center{justify-content:center}.foxit-modal-justify-top{justify-content:flex-start;padding-top:96px}.foxit-modal-justify-bottom{justify-content:flex-end}.foxit-modal-overlay{cursor:pointer;height:100%;inset:0;position:fixed;width:100%;z-index:50}.foxit-modal-overlay-bg{background-color:#00000026;height:100%;inset:0;position:absolute;width:100%}.foxit-modal-content{align-items:center;display:flex;font-size:16px;font-weight:400;justify-content:center;max-height:100%;width:auto;z-index:50}.foxit-modal-opacity-0{opacity:0}.foxit-modal-opacity-100{opacity:1}.foxit-modal-scale-0{transform:scale(0)}.foxit-modal-scale-100{transform:scale(1)}.foxit-modal-transition{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.foxit-modal-hide-overflow{overflow-y:hidden}.foxit-switch{background-color:#ccc;border-radius:100px;cursor:pointer;display:inline-block;height:22px;line-height:22px;position:relative;transition:background-color .3s;width:40px}.foxit-switch.small{height:14px;line-height:14px;width:24px}.foxit-switch.checked{background-color:#ff5f00}.foxit-switch-handle{background-color:#fff;border-radius:50%;height:18px;position:absolute;top:2px;transform:translateX(1px);transition:transform .3s;width:18px}.foxit-switch.small .foxit-switch-handle{height:12px;top:1px;width:12px}.foxit-switch.checked .foxit-switch-handle{transform:translateX(20px)}.foxit-switch.small.checked .foxit-switch-handle{transform:translateX(11px)}
package/es/index.d.ts CHANGED
@@ -30,3 +30,4 @@ export { Tabs };
30
30
  export { Tag };
31
31
  export { Toast };
32
32
  export { Tooltip };
33
+ export { Switch } from './Switch/Switch';
package/es/index.js CHANGED
@@ -14,4 +14,5 @@ export { Button } from './Button/Button.js';
14
14
  export { Icon } from './Icon/index.js';
15
15
  export { Menu, getItem } from './Menu/Menu.js';
16
16
  export { Modal } from './Modal/Modal.js';
17
+ export { Switch } from './Switch/Switch.js';
17
18
  export { default as FormItem } from './Form/FormItem.js';
@@ -38,6 +38,44 @@ function __rest(s, e) {
38
38
  return t;
39
39
  }
40
40
 
41
+ function __awaiter(thisArg, _arguments, P, generator) {
42
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
43
+ return new (P || (P = Promise))(function (resolve, reject) {
44
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
45
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
46
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
47
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
48
+ });
49
+ }
50
+
51
+ function __generator(thisArg, body) {
52
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
53
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
54
+ function verb(n) { return function (v) { return step([n, v]); }; }
55
+ function step(op) {
56
+ if (f) throw new TypeError("Generator is already executing.");
57
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
58
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
59
+ if (y = 0, t) op = [op[0] & 2, t.value];
60
+ switch (op[0]) {
61
+ case 0: case 1: t = op; break;
62
+ case 4: _.label++; return { value: op[1], done: false };
63
+ case 5: _.label++; y = op[1]; op = [0]; continue;
64
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
65
+ default:
66
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
67
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
68
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
69
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
70
+ if (t[2]) _.ops.pop();
71
+ _.trys.pop(); continue;
72
+ }
73
+ op = body.call(thisArg, _);
74
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
75
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
76
+ }
77
+ }
78
+
41
79
  function __spreadArray(to, from, pack) {
42
80
  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
43
81
  if (ar || !(i in from)) {
@@ -53,4 +91,4 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
53
91
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
54
92
  };
55
93
 
56
- export { __assign, __rest, __spreadArray };
94
+ export { __assign, __awaiter, __generator, __rest, __spreadArray };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "foxit-component",
3
- "version": "0.0.1-alpha.5",
3
+ "version": "0.0.1-alpha.8",
4
4
  "author": {
5
5
  "name": "linye",
6
6
  "email": "869675630@qq.com"
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-button {\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n border: 0;\n border-radius: 10px;\n font-weight: 600;\n font-size: 14px;\n letter-spacing: 0.42px;\n}\n\n.foxit-button:hover {\n opacity: 0.8;\n}\n\n.foxit-button-primary {\n background-color: #ff5f00;\n color: white;\n}\n.foxit-button-secondary {\n border: 2px solid #ff5f00;\n background-color: white;\n color: #ff5f00;\n}\n\n.foxit-button-small {\n padding-left: 24px;\n padding-right: 24px;\n border-radius: 5px;\n height: 38px;\n}\n\n.foxit-button-medium {\n padding-left: 32px;\n padding-right: 32px;\n border-radius: 5px;\n height: 44px;\n}\n.foxit-button-large {\n padding-left: 32px;\n padding-right: 32px;\n height: 56px;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-checkbox-container {\n display: inline-block;\n position: relative;\n padding-left: 25px;\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n}\n\n.foxit-checkbox-container input {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n}\n\n.foxit-checkbox-checkmark {\n position: absolute;\n top: 0;\n left: 0;\n height: 20px;\n width: 20px;\n background-color: #fff;\n border: 1px solid #b3b3b3;\n border-radius: 4px;\n}\n\n.foxit-checkbox-content {\n line-height: 20px;\n}\n\n.foxit-checkbox-container input:checked ~ .foxit-checkbox-checkmark {\n background-color: #ff5f00;\n border: none;\n}\n\n.foxit-checkbox-checkmark:after {\n content: '';\n position: absolute;\n display: none;\n}\n\n.foxit-checkbox-container input:checked ~ .foxit-checkbox-checkmark:after {\n display: block;\n}\n\n.foxit-checkbox-container .foxit-checkbox-checkmark:after {\n left: 7px;\n top: 4px;\n width: 6px;\n height: 10px;\n border: solid white;\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n}\n\n.foxit-checkbox-container.disabled {\n cursor: not-allowed;\n opacity: 0.6;\n color: #00000040;\n}\n\n.foxit-checkbox-checkmark.disabled {\n background-color: #f5f5f5;\n border: 1px solid #d9d9d9;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-empty {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n text-align: center;\n padding: 20px;\n}\n\n.foxit-empty-image {\n margin-bottom: 16px;\n}\n\n.foxit-empty-description {\n font-size: 14px;\n color: #757575;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-form-item {\n margin-bottom: 16px;\n}\n\n.foxit-form-item label {\n display: block;\n margin-bottom: 8px;\n font-weight: 500;\n font-size: 14px;\n color: #525252;\n}\n\n.foxit-form-error-text {\n margin-top: 8px;\n color: red;\n}\n\n.foxit-form-warning-text {\n margin-top: 8px;\n color: orange;\n}\n\n.foxit-form-item > .foxit-form-error-component .foxit-input-wrapper,\n.foxit-form-item > .foxit-form-error-component .foxit-select-wrapper > :nth-child(3),\n.foxit-form-item > .foxit-form-error-component .foxit-checkbox-container,\n.foxit-form-item > .foxit-form-error-component .foxit-radio-container {\n border: 1px solid red !important;\n}\n\n.foxit-form-item > .foxit-form-warning-component .foxit-input-wrapper,\n.foxit-form-item > .foxit-form-warning-component .foxit-select-wrapper > :nth-child(3),\n.foxit-form-item > .foxit-form-warning-component .foxit-checkbox-container,\n.foxit-form-item > .foxit-form-warning-component .foxit-radio-container {\n border-color: orange !important;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-input-wrapper {\n display: flex;\n align-items: center;\n border: 1px solid #d9d9d9;\n border-radius: 10px;\n padding: 11px 16px;\n transition: border-color 0.3s;\n font-size: 14px;\n font-weight: 400;\n}\n\n.foxit-input-wrapper:focus-within {\n border-color: #ff5f00 !important;\n}\n.foxit-input-wrapper:hover {\n border-color: #757575;\n}\n\n.foxit-input-element {\n flex: 1;\n border: none;\n outline: none;\n color: #525252;\n line-height: 24px;\n}\n\n.foxit-input-element::placeholder {\n color: #b3b3b3;\n}\n\n.foxit-input-addon {\n display: flex;\n align-items: center;\n padding: 0 8px;\n cursor: pointer;\n color: #b3b3b3;\n transition: color 0.3s;\n}\n\n.foxit-input-wrapper:focus-within .foxit-input-addon {\n color: #ff5f00 !important;\n}\n.foxit-input-wrapper:hover .foxit-input-addon {\n color: #757575;\n}\n\n.foxit-input-wrapper-disabled,\n.foxit-input-wrapper :disabled {\n background-color: #f8f8f8;\n}\n\n.foxit-input-wrapper-disabled:hover {\n border-color: #d9d9d9;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-menu {\n font-size: 14px;\n /* font-family: sans-serif;\n border: 0px solid #FFFFFF; */\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n border-radius: 10px;\n overflow: hidden;\n}\n\n.foxit-menu-item-content {\n padding: 12px 16px;\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n\n.foxit-menu-item {\n padding-left: 0px;\n}\n\n.foxit-menu-item.selected {\n background-color: #fff6f0 !important;\n color: #ff5f00;\n font-weight: 600;\n}\n\n.foxit-menu-item:hover {\n background-color: #f5f6f8;\n}\n\n.foxit-menu-submenu-title {\n padding: 12px 16px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.foxit-menu-submenu-title:hover {\n background-color: #f5f6f8;\n}\n\n.foxit-menu-icon {\n transition: transform 0.3s ease-in-out; /* Adjust timing as needed */\n}\n\n.foxit-menu-rotated-icon {\n transform: rotate(180deg);\n}\n\n.foxit-menu-item-label {\n font-weight: 600;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-modal-content-container {\n display: flex;\n flex-direction: column;\n padding: 24px;\n background-color: #fff;\n border-radius: 10px;\n justify-content: space-between;\n min-width: 320px;\n gap: 24px;\n}\n\n.foxit-modal-head {\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n.foxit-modal-title {\n font-weight: 500;\n font-size: 20px;\n}\n\n.foxit-modal-close-button {\n display: flex;\n width: 16px;\n height: 16px;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n}\n\n.foxit-modal-close-button svg {\n stroke: #6b7280;\n}\n\n.foxit-modal-close-button:hover svg {\n stroke: #ea580c;\n}\n\n.foxit-modal-footer {\n display: flex;\n gap: 16px;\n justify-content: flex-end;\n}\n\n.foxit-modal-fixed-layout {\n position: fixed;\n inset: 0;\n z-index: 50;\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 36px;\n}\n\n.foxit-modal-justify-center {\n justify-content: center;\n}\n\n.foxit-modal-justify-top {\n justify-content: flex-start;\n padding-top: 96px;\n}\n\n.foxit-modal-justify-bottom {\n justify-content: flex-end;\n}\n\n.foxit-modal-overlay {\n position: fixed;\n inset: 0;\n z-index: 50;\n width: 100%;\n height: 100%;\n cursor: pointer;\n}\n\n.foxit-modal-overlay-bg {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.15); /* Equivalent to bg-main-black opacity-15 */\n}\n\n.foxit-modal-content {\n z-index: 50;\n max-height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n width: auto;\n font-size: 16px;\n font-weight: 400;\n}\n\n.foxit-modal-opacity-0 {\n opacity: 0;\n}\n\n.foxit-modal-opacity-100 {\n opacity: 1;\n}\n\n.foxit-modal-scale-0 {\n transform: scale(0);\n}\n\n.foxit-modal-scale-100 {\n transform: scale(1);\n}\n\n.foxit-modal-transition {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n\n.foxit-modal-hide-overflow {\n overflow-y: hidden;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-pagination-container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.foxit-pagination-button,\n.foxit-pagination-prev,\n.foxit-pagination-next {\n font-size: 16px;\n font-weight: 500;\n height: 48px;\n min-width: 48px;\n padding: 0 12px;\n border: none;\n border-radius: 10px;\n margin: 0 4px;\n color: #757575;\n background-color: transparent;\n cursor: pointer;\n transition:\n background-color 0.3s ease,\n color 0.3s ease;\n}\n\n.foxit-pagination-next:hover,\n.foxit-pagination-prev:hover {\n color: #ff5f00;\n}\n\n.foxit-pagination-button:hover {\n background-color: rgba(255, 95, 0, 0.1);\n}\n\n.foxit-pagination-button:disabled {\n background-color: #ff5f00;\n color: white;\n cursor: default;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-radio-container {\n display: inline-block;\n position: relative;\n padding-left: 25px;\n cursor: pointer;\n -webkit-user-select: none;\n user-select: none;\n}\n\n.foxit-radio-container input {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n}\n\n.foxit-radio-checkmark {\n position: absolute;\n top: 0;\n left: 0;\n height: 20px;\n width: 20px;\n background-color: #fff;\n border: 1px solid #b3b3b3;\n border-radius: 50%;\n}\n\n.foxit-radio-content {\n line-height: 20px;\n}\n\n.foxit-radio-container input:checked ~ .foxit-radio-checkmark {\n background-color: #ffffff;\n border: 1px solid #ff5f00;\n}\n\n.foxit-radio-checkmark:after {\n content: '';\n position: absolute;\n display: none;\n}\n\n.foxit-radio-container input:checked ~ .foxit-radio-checkmark:after {\n display: block;\n}\n\n.foxit-radio-container .foxit-radio-checkmark:after {\n top: 4px;\n left: 4px;\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background: #ff5f00;\n}\n\n.foxit-radio-container.disabled {\n cursor: not-allowed;\n opacity: 0.6;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-table {\n border-radius: 10px;\n overflow: hidden;\n border: 1px solid #ff5f00;\n color: #373737;\n}\n\n.foxit-table-container {\n width: 100%;\n border-collapse: collapse;\n}\n\n.foxit-table-container th,\n.foxit-table-container td {\n min-height: 70px;\n height: 70px;\n padding: 24px;\n}\n\n.foxit-table-container th {\n background-color: #fff6f0;\n font-weight: 700;\n font-size: 16px;\n}\n\n.foxit-table-container td {\n font-size: 14px;\n font-weight: 400;\n}\n\n.foxit-table-container .foxit-even-row {\n background-color: white;\n}\n\n.foxit-table-container .foxit-odd-row {\n background-color: #fff6f0;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-tabs {\n display: flex;\n gap: 8px;\n}\n\n.foxit-tab-item {\n font-weight: 600;\n padding: 14px 20px;\n border: none;\n border-radius: 10px;\n background-color: #f1f3f4;\n color: #757575;\n cursor: pointer;\n transition:\n background-color 0.3s,\n color 0.3s;\n}\n\n.foxit-tab-item.active {\n background-color: #ff5f00;\n color: white;\n}\n\n.foxit-tab-item:hover:not(.active) {\n background-color: #e0e0e0;\n}\n\n.foxit-tab-content {\n margin-top: 16px;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
package/es/Tag/tag.css.js DELETED
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-tag {\n display: inline-block;\n min-height: 24px;\n padding: 4px 8px;\n border-radius: 5px;\n font-size: 12px;\n font-weight: 600;\n white-space: nowrap;\n height: 24px;\n}\n\n.foxit-tag-active {\n background-color: #edfafa;\n color: #0f8b8d;\n}\n\n.foxit-tag-canceled {\n background-color: #ffecec;\n color: #e22727;\n}\n\n.foxit-tag-pending {\n background-color: #fbf4d0;\n color: #9b8827;\n}\n\n.foxit-tag-offline {\n background-color: #edecff;\n color: #6462c6;\n}\n\n.foxit-tag-trial {\n background-color: #e4f4fe;\n color: #2288ce;\n}\n\n.foxit-tag-expired {\n background-color: #ececec;\n color: #757575;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-toast-container {\n width: 100%;\n position: fixed;\n pointer-events: none;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.5s;\n left: 50%;\n transition-delay: 0s;\n transform: translateX(-50%);\n z-index: 2000;\n top: 0;\n}\n\n.foxit-toast-loading {\n animation: spin 1s linear infinite;\n color: #ff5f00;\n}\n\n@keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n.foxit-toast-loading-overlay {\n position: fixed;\n inset: 0;\n background-color: #000000;\n opacity: 0.15;\n z-index: 10;\n pointer-events: auto;\n height: 100vh;\n}\n\n.foxit-toast-item {\n position: relative;\n top: 102px;\n z-index: 20;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.15s;\n width: fit-content;\n margin-left: auto;\n margin-right: auto;\n background-color: #ffffff;\n color: #525252;\n padding: 9px 12px;\n border-radius: 50px;\n border: none;\n margin-bottom: 16px;\n display: flex;\n flex-direction: row;\n gap: 8px;\n justify-content: center;\n align-items: center;\n}\n\n.foxit-toast-item-success {\n background-color: #ddfae8;\n color: #1f7f40;\n}\n\n.foxit-toast-item-error {\n background-color: #fae5dd;\n color: #e22727;\n}\n\n.foxit-toast-item-warning {\n background-color: #fff0e7;\n color: #525252;\n}\n\n.foxit-toast-enter {\n opacity: 0;\n transform: translateY(-100%);\n}\n\n.foxit-toast-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: all 0.5s ease-out;\n}\n\n.foxit-toast-exit {\n opacity: 1;\n transform: translateY(0);\n}\n\n.foxit-toast-exit-active {\n opacity: 0;\n transform: translateY(-100%);\n transition: all 0.5s ease-in;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,6 +0,0 @@
1
- import styleInject from '../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".foxit-tooltip-container {\n position: relative;\n display: inline-block;\n width: auto;\n}\n\n.foxit-tooltip-content {\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n background-color: #525252;\n color: #fff;\n /* text-align: center; */\n border-radius: 10px;\n padding: 12px 16px;\n z-index: 1;\n max-width: 300px;\n width: max-content;\n}\n\n.foxit-tooltip-arrow {\n position: absolute;\n left: 50%;\n bottom: -5px;\n transform: translateX(-50%);\n width: 0;\n height: 0;\n border-left: 5px solid transparent;\n border-right: 5px solid transparent;\n border-top: 5px solid #525252;\n}\n";
4
- styleInject(css_248z);
5
-
6
- export { css_248z as default };
@@ -1,28 +0,0 @@
1
- function styleInject(css, ref) {
2
- if ( ref === void 0 ) ref = {};
3
- var insertAt = ref.insertAt;
4
-
5
- if (!css || typeof document === 'undefined') { return; }
6
-
7
- var head = document.head || document.getElementsByTagName('head')[0];
8
- var style = document.createElement('style');
9
- style.type = 'text/css';
10
-
11
- if (insertAt === 'top') {
12
- if (head.firstChild) {
13
- head.insertBefore(style, head.firstChild);
14
- } else {
15
- head.appendChild(style);
16
- }
17
- } else {
18
- head.appendChild(style);
19
- }
20
-
21
- if (style.styleSheet) {
22
- style.styleSheet.cssText = css;
23
- } else {
24
- style.appendChild(document.createTextNode(css));
25
- }
26
- }
27
-
28
- export { styleInject as default };