@canlooks/can-ui 0.0.113 → 0.0.114

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.
@@ -7,7 +7,7 @@ const utils_1 = require("../../utils");
7
7
  const theme_1 = require("../theme");
8
8
  const transitionBase_1 = require("../transitionBase");
9
9
  const icon_1 = require("../icon");
10
- const faCaretRight_1 = require("@fortawesome/free-solid-svg-icons/faCaretRight");
10
+ const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
11
11
  function Accordion({ size, title, prefix, suffix, expandIcon, defaultExpanded = false, expanded, onExpandedChange, readOnly, disabled, ...props }) {
12
12
  const theme = (0, theme_1.useTheme)();
13
13
  size ??= theme.size;
@@ -17,7 +17,7 @@ function Accordion({ size, title, prefix, suffix, expandIcon, defaultExpanded =
17
17
  };
18
18
  const renderExpandIcon = () => {
19
19
  if (!expandIcon) {
20
- return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCaretRight_1.faCaretRight, className: accordion_style_1.classes.expandIcon });
20
+ return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: free_solid_svg_icons_1.faCaretRight, className: accordion_style_1.classes.expandIcon });
21
21
  }
22
22
  if (typeof expandIcon === 'function') {
23
23
  return expandIcon(innerExpanded.current);
@@ -37,7 +37,7 @@ export declare function ClickAway({ ref, container, eventType, onClickAway, disa
37
37
  title: string;
38
38
  translate: "yes" | "no";
39
39
  radioGroup: string;
40
- role: "article" | "button" | "dialog" | "figure" | "form" | "img" | "link" | "main" | "menu" | "menuitem" | "option" | "search" | "table" | "switch" | "status" | (string & {}) | "none" | "checkbox" | "listbox" | "radio" | "region" | "cell" | "grid" | "row" | "listitem" | "menubar" | "progressbar" | "separator" | "tab" | "tabpanel" | "toolbar" | "tooltip" | "treeitem" | "scrollbar" | "alert" | "alertdialog" | "application" | "banner" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "gridcell" | "group" | "heading" | "list" | "log" | "marquee" | "math" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "note" | "presentation" | "radiogroup" | "rowgroup" | "rowheader" | "searchbox" | "slider" | "spinbutton" | "tablist" | "term" | "textbox" | "timer" | "tree" | "treegrid";
40
+ role: "article" | "button" | "dialog" | "figure" | "form" | "img" | "link" | "main" | "menu" | "menuitem" | "option" | "search" | "table" | "switch" | "status" | (string & {}) | "none" | "checkbox" | "listbox" | "radio" | "region" | "cell" | "grid" | "row" | "math" | "listitem" | "menubar" | "progressbar" | "separator" | "tab" | "tabpanel" | "toolbar" | "tooltip" | "treeitem" | "scrollbar" | "alert" | "alertdialog" | "application" | "banner" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "gridcell" | "group" | "heading" | "list" | "log" | "marquee" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "note" | "presentation" | "radiogroup" | "rowgroup" | "rowheader" | "searchbox" | "slider" | "spinbutton" | "tablist" | "term" | "textbox" | "timer" | "tree" | "treegrid";
41
41
  about: string;
42
42
  content: string;
43
43
  datatype: string;
@@ -60,7 +60,7 @@ export declare function ClickAway({ ref, container, eventType, onClickAway, disa
60
60
  results: number;
61
61
  security: string;
62
62
  unselectable: "off" | "on";
63
- popover: "" | "auto" | "manual";
63
+ popover: "" | "auto" | "manual" | "hint";
64
64
  popoverTargetAction: "hide" | "show" | "toggle";
65
65
  popoverTarget: string;
66
66
  inert: boolean;
@@ -70,7 +70,7 @@ export declare function ClickAway({ ref, container, eventType, onClickAway, disa
70
70
  part: string;
71
71
  "aria-activedescendant": string;
72
72
  "aria-atomic": boolean | "false" | "true";
73
- "aria-autocomplete": "both" | "none" | "inline" | "list";
73
+ "aria-autocomplete": "none" | "both" | "inline" | "list";
74
74
  "aria-braillelabel": string;
75
75
  "aria-brailleroledescription": string;
76
76
  "aria-busy": boolean | "false" | "true";
@@ -1,6 +1,8 @@
1
1
  import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
2
2
  import { ColorPropsValue } from '../../types';
3
- export interface IconProps extends Omit<FontAwesomeIconProps, 'color'> {
3
+ import { IconDefinition } from '@fortawesome/free-brands-svg-icons';
4
+ export interface IconProps extends Omit<FontAwesomeIconProps, 'color' | 'icon'> {
4
5
  color?: ColorPropsValue;
6
+ icon: FontAwesomeIconProps['icon'] | IconDefinition;
5
7
  }
6
8
  export declare function Icon({ color, ...props }: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
@@ -22,7 +22,7 @@ const getAttemptOrder = (placement) => {
22
22
  }
23
23
  return order;
24
24
  };
25
- function Popper({ ref, popperRef, anchorElement, container = document.body, effectContainer, content, offset, trigger = 'hover', clickToClose, placement = 'top', variant = 'zoom', sizeAdaptable = variant === 'collapse', mouseEnterDelay = 150, mouseLeaveDelay = 150, defaultOpen = false, open, onOpenChange, onOpenChangeEnd, disabled, autoClose = false, forceRender, children, ...props }) {
25
+ function Popper({ ref, popperRef, anchorElement, container, effectContainer, content, offset, trigger = 'hover', clickToClose, placement = 'top', variant = 'zoom', sizeAdaptable = variant === 'collapse', mouseEnterDelay = 150, mouseLeaveDelay = 150, defaultOpen = false, open, onOpenChange, onOpenChangeEnd, disabled, autoClose = false, forceRender, children, ...props }) {
26
26
  const { spacing } = (0, theme_1.useTheme)();
27
27
  offset ??= spacing[2];
28
28
  (0, react_1.useImperativeHandle)(popperRef, () => {
@@ -1,16 +1,16 @@
1
1
  import { ReactNode } from 'react';
2
2
  import { DivProps, Status as IStatus } from '../../types';
3
- import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
3
+ import { IconProps } from '../icon';
4
4
  export type StatusType = IStatus | 'confirm' | 'unknown';
5
5
  export declare const statusMapToIconDefinition: {
6
- info: import("@fortawesome/fontawesome-common-types").IconDefinition;
7
- success: import("@fortawesome/fontawesome-common-types").IconDefinition;
8
- warning: import("@fortawesome/fontawesome-common-types").IconDefinition;
9
- error: import("@fortawesome/fontawesome-common-types").IconDefinition;
10
- confirm: import("@fortawesome/fontawesome-common-types").IconDefinition;
11
- unknown: import("@fortawesome/fontawesome-common-types").IconDefinition;
6
+ info: import("@fortawesome/free-solid-svg-icons").IconDefinition;
7
+ success: import("@fortawesome/free-solid-svg-icons").IconDefinition;
8
+ warning: import("@fortawesome/free-solid-svg-icons").IconDefinition;
9
+ error: import("@fortawesome/free-solid-svg-icons").IconDefinition;
10
+ confirm: import("@fortawesome/free-solid-svg-icons").IconDefinition;
11
+ unknown: import("@fortawesome/free-solid-svg-icons").IconDefinition;
12
12
  };
13
- export interface StatusIconProps extends Partial<FontAwesomeIconProps> {
13
+ export interface StatusIconProps extends Partial<IconProps> {
14
14
  status?: StatusType;
15
15
  }
16
16
  export declare const StatusIcon: import("react").MemoExoticComponent<({ status, ...props }: StatusIconProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
@@ -22,6 +22,6 @@ export interface StatusProps extends DivProps {
22
22
  /** 是否播放动画,默认为false */
23
23
  animation?: boolean;
24
24
  /** {@link variant}为`icon`时生效,传递给`<StatusIcon/>`组件 */
25
- iconProps?: Partial<FontAwesomeIconProps>;
25
+ iconProps?: Partial<IconProps>;
26
26
  }
27
27
  export declare const Status: import("react").MemoExoticComponent<({ status, variant, label, animation, iconProps, ...props }: StatusProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
@@ -5,19 +5,15 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
5
5
  const react_1 = require("react");
6
6
  const status_style_1 = require("./status.style");
7
7
  const utils_1 = require("../../utils");
8
- const faCircleInfo_1 = require("@fortawesome/free-solid-svg-icons/faCircleInfo");
9
- const faCircleCheck_1 = require("@fortawesome/free-solid-svg-icons/faCircleCheck");
10
- const faCircleExclamation_1 = require("@fortawesome/free-solid-svg-icons/faCircleExclamation");
11
- const faCircleXmark_1 = require("@fortawesome/free-solid-svg-icons/faCircleXmark");
12
- const faCircleQuestion_1 = require("@fortawesome/free-solid-svg-icons/faCircleQuestion");
13
- const react_fontawesome_1 = require("@fortawesome/react-fontawesome");
8
+ const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
9
+ const icon_1 = require("../icon");
14
10
  exports.statusMapToIconDefinition = {
15
- info: faCircleInfo_1.faCircleInfo,
16
- success: faCircleCheck_1.faCircleCheck,
17
- warning: faCircleExclamation_1.faCircleExclamation,
18
- error: faCircleXmark_1.faCircleXmark,
19
- confirm: faCircleQuestion_1.faCircleQuestion,
20
- unknown: faCircleQuestion_1.faCircleQuestion
11
+ info: free_solid_svg_icons_1.faCircleInfo,
12
+ success: free_solid_svg_icons_1.faCircleCheck,
13
+ warning: free_solid_svg_icons_1.faCircleExclamation,
14
+ error: free_solid_svg_icons_1.faCircleXmark,
15
+ confirm: free_solid_svg_icons_1.faCircleQuestion,
16
+ unknown: free_solid_svg_icons_1.faCircleQuestion
21
17
  };
22
18
  exports.StatusIcon = (0, react_1.memo)(({ status = 'unknown', ...props }) => {
23
19
  const statusColor = (0, utils_1.useStatusColor)(status);
@@ -30,7 +26,7 @@ exports.StatusIcon = (0, react_1.memo)(({ status = 'unknown', ...props }) => {
30
26
  ...props.style
31
27
  }), [statusColor, props.style])
32
28
  };
33
- return (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { ...iconProps });
29
+ return (0, jsx_runtime_1.jsx)(icon_1.Icon, { ...iconProps });
34
30
  });
35
31
  const defaultLabel = {
36
32
  unknown: '未知',
@@ -4,7 +4,7 @@ import { clsx, useControlled } from '../../utils';
4
4
  import { useTheme } from '../theme';
5
5
  import { Collapse } from '../transitionBase';
6
6
  import { Icon } from '../icon';
7
- import { faCaretRight } from '@fortawesome/free-solid-svg-icons/faCaretRight';
7
+ import { faCaretRight } from '@fortawesome/free-solid-svg-icons';
8
8
  export function Accordion({ size, title, prefix, suffix, expandIcon, defaultExpanded = false, expanded, onExpandedChange, readOnly, disabled, ...props }) {
9
9
  const theme = useTheme();
10
10
  size ??= theme.size;
@@ -37,7 +37,7 @@ export declare function ClickAway({ ref, container, eventType, onClickAway, disa
37
37
  title: string;
38
38
  translate: "yes" | "no";
39
39
  radioGroup: string;
40
- role: "article" | "button" | "dialog" | "figure" | "form" | "img" | "link" | "main" | "menu" | "menuitem" | "option" | "search" | "table" | "switch" | "status" | (string & {}) | "none" | "checkbox" | "listbox" | "radio" | "region" | "cell" | "grid" | "row" | "listitem" | "menubar" | "progressbar" | "separator" | "tab" | "tabpanel" | "toolbar" | "tooltip" | "treeitem" | "scrollbar" | "alert" | "alertdialog" | "application" | "banner" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "gridcell" | "group" | "heading" | "list" | "log" | "marquee" | "math" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "note" | "presentation" | "radiogroup" | "rowgroup" | "rowheader" | "searchbox" | "slider" | "spinbutton" | "tablist" | "term" | "textbox" | "timer" | "tree" | "treegrid";
40
+ role: "article" | "button" | "dialog" | "figure" | "form" | "img" | "link" | "main" | "menu" | "menuitem" | "option" | "search" | "table" | "switch" | "status" | (string & {}) | "none" | "checkbox" | "listbox" | "radio" | "region" | "cell" | "grid" | "row" | "math" | "listitem" | "menubar" | "progressbar" | "separator" | "tab" | "tabpanel" | "toolbar" | "tooltip" | "treeitem" | "scrollbar" | "alert" | "alertdialog" | "application" | "banner" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "gridcell" | "group" | "heading" | "list" | "log" | "marquee" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "note" | "presentation" | "radiogroup" | "rowgroup" | "rowheader" | "searchbox" | "slider" | "spinbutton" | "tablist" | "term" | "textbox" | "timer" | "tree" | "treegrid";
41
41
  about: string;
42
42
  content: string;
43
43
  datatype: string;
@@ -60,7 +60,7 @@ export declare function ClickAway({ ref, container, eventType, onClickAway, disa
60
60
  results: number;
61
61
  security: string;
62
62
  unselectable: "off" | "on";
63
- popover: "" | "auto" | "manual";
63
+ popover: "" | "auto" | "manual" | "hint";
64
64
  popoverTargetAction: "hide" | "show" | "toggle";
65
65
  popoverTarget: string;
66
66
  inert: boolean;
@@ -70,7 +70,7 @@ export declare function ClickAway({ ref, container, eventType, onClickAway, disa
70
70
  part: string;
71
71
  "aria-activedescendant": string;
72
72
  "aria-atomic": boolean | "false" | "true";
73
- "aria-autocomplete": "both" | "none" | "inline" | "list";
73
+ "aria-autocomplete": "none" | "both" | "inline" | "list";
74
74
  "aria-braillelabel": string;
75
75
  "aria-brailleroledescription": string;
76
76
  "aria-busy": boolean | "false" | "true";
@@ -1,6 +1,8 @@
1
1
  import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
2
2
  import { ColorPropsValue } from '../../types';
3
- export interface IconProps extends Omit<FontAwesomeIconProps, 'color'> {
3
+ import { IconDefinition } from '@fortawesome/free-brands-svg-icons';
4
+ export interface IconProps extends Omit<FontAwesomeIconProps, 'color' | 'icon'> {
4
5
  color?: ColorPropsValue;
6
+ icon: FontAwesomeIconProps['icon'] | IconDefinition;
5
7
  }
6
8
  export declare function Icon({ color, ...props }: IconProps): import("@emotion/react/jsx-runtime").JSX.Element;
@@ -19,7 +19,7 @@ const getAttemptOrder = (placement) => {
19
19
  }
20
20
  return order;
21
21
  };
22
- export function Popper({ ref, popperRef, anchorElement, container = document.body, effectContainer, content, offset, trigger = 'hover', clickToClose, placement = 'top', variant = 'zoom', sizeAdaptable = variant === 'collapse', mouseEnterDelay = 150, mouseLeaveDelay = 150, defaultOpen = false, open, onOpenChange, onOpenChangeEnd, disabled, autoClose = false, forceRender, children, ...props }) {
22
+ export function Popper({ ref, popperRef, anchorElement, container, effectContainer, content, offset, trigger = 'hover', clickToClose, placement = 'top', variant = 'zoom', sizeAdaptable = variant === 'collapse', mouseEnterDelay = 150, mouseLeaveDelay = 150, defaultOpen = false, open, onOpenChange, onOpenChangeEnd, disabled, autoClose = false, forceRender, children, ...props }) {
23
23
  const { spacing } = useTheme();
24
24
  offset ??= spacing[2];
25
25
  useImperativeHandle(popperRef, () => {
@@ -1,16 +1,16 @@
1
1
  import { ReactNode } from 'react';
2
2
  import { DivProps, Status as IStatus } from '../../types';
3
- import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
3
+ import { IconProps } from '../icon';
4
4
  export type StatusType = IStatus | 'confirm' | 'unknown';
5
5
  export declare const statusMapToIconDefinition: {
6
- info: import("@fortawesome/fontawesome-common-types").IconDefinition;
7
- success: import("@fortawesome/fontawesome-common-types").IconDefinition;
8
- warning: import("@fortawesome/fontawesome-common-types").IconDefinition;
9
- error: import("@fortawesome/fontawesome-common-types").IconDefinition;
10
- confirm: import("@fortawesome/fontawesome-common-types").IconDefinition;
11
- unknown: import("@fortawesome/fontawesome-common-types").IconDefinition;
6
+ info: import("@fortawesome/free-solid-svg-icons").IconDefinition;
7
+ success: import("@fortawesome/free-solid-svg-icons").IconDefinition;
8
+ warning: import("@fortawesome/free-solid-svg-icons").IconDefinition;
9
+ error: import("@fortawesome/free-solid-svg-icons").IconDefinition;
10
+ confirm: import("@fortawesome/free-solid-svg-icons").IconDefinition;
11
+ unknown: import("@fortawesome/free-solid-svg-icons").IconDefinition;
12
12
  };
13
- export interface StatusIconProps extends Partial<FontAwesomeIconProps> {
13
+ export interface StatusIconProps extends Partial<IconProps> {
14
14
  status?: StatusType;
15
15
  }
16
16
  export declare const StatusIcon: import("react").MemoExoticComponent<({ status, ...props }: StatusIconProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
@@ -22,6 +22,6 @@ export interface StatusProps extends DivProps {
22
22
  /** 是否播放动画,默认为false */
23
23
  animation?: boolean;
24
24
  /** {@link variant}为`icon`时生效,传递给`<StatusIcon/>`组件 */
25
- iconProps?: Partial<FontAwesomeIconProps>;
25
+ iconProps?: Partial<IconProps>;
26
26
  }
27
27
  export declare const Status: import("react").MemoExoticComponent<({ status, variant, label, animation, iconProps, ...props }: StatusProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
@@ -2,12 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
2
2
  import { memo, useMemo } from 'react';
3
3
  import { classes, style } from './status.style';
4
4
  import { clsx, useStatusColor } from '../../utils';
5
- import { faCircleInfo } from '@fortawesome/free-solid-svg-icons/faCircleInfo';
6
- import { faCircleCheck } from '@fortawesome/free-solid-svg-icons/faCircleCheck';
7
- import { faCircleExclamation } from '@fortawesome/free-solid-svg-icons/faCircleExclamation';
8
- import { faCircleXmark } from '@fortawesome/free-solid-svg-icons/faCircleXmark';
9
- import { faCircleQuestion } from '@fortawesome/free-solid-svg-icons/faCircleQuestion';
10
- import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
5
+ import { faCircleInfo, faCircleCheck, faCircleExclamation, faCircleXmark, faCircleQuestion } from '@fortawesome/free-solid-svg-icons';
6
+ import { Icon } from '../icon';
11
7
  export const statusMapToIconDefinition = {
12
8
  info: faCircleInfo,
13
9
  success: faCircleCheck,
@@ -27,7 +23,7 @@ export const StatusIcon = memo(({ status = 'unknown', ...props }) => {
27
23
  ...props.style
28
24
  }), [statusColor, props.style])
29
25
  };
30
- return _jsx(FontAwesomeIcon, { ...iconProps });
26
+ return _jsx(Icon, { ...iconProps });
31
27
  });
32
28
  const defaultLabel = {
33
29
  unknown: '未知',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@canlooks/can-ui",
3
- "version": "0.0.113",
3
+ "version": "0.0.114",
4
4
  "author": "C.CanLiang <canlooks@gmail.com>",
5
5
  "description": "My ui framework",
6
6
  "license": "MIT",
@@ -51,35 +51,35 @@
51
51
  "@dnd-kit/core": "^6.3.1",
52
52
  "@dnd-kit/sortable": "^10.0.0",
53
53
  "@emotion/react": "^11.14.0",
54
- "@fortawesome/free-brands-svg-icons": "^6.7.2",
55
- "@fortawesome/free-regular-svg-icons": "^6.7.2",
56
- "@fortawesome/free-solid-svg-icons": "^6.7.2",
57
- "@fortawesome/react-fontawesome": "^0.2.2",
58
- "color": "^5.0.0",
59
- "dayjs": "^1.11.13",
54
+ "@fortawesome/free-brands-svg-icons": "^7.1.0",
55
+ "@fortawesome/free-regular-svg-icons": "^7.1.0",
56
+ "@fortawesome/free-solid-svg-icons": "^7.1.0",
57
+ "@fortawesome/react-fontawesome": "^3.1.1",
58
+ "color": "^5.0.3",
59
+ "dayjs": "^1.11.19",
60
60
  "react-transition-group": "^4.4.5",
61
61
  "tslib": "^2.8.1"
62
62
  },
63
63
  "devDependencies": {
64
- "@ant-design/icons": "^6.0.0",
65
- "@canlooks/react-router": "^1.0.11",
66
- "@canlooks/reactive": "^4.2.5",
67
- "@emotion/styled": "^11.14.0",
64
+ "@ant-design/icons": "^6.1.0",
65
+ "@canlooks/react-router": "^1.1.0",
66
+ "@canlooks/reactive": "^4.7.10",
67
+ "@emotion/styled": "^11.14.1",
68
68
  "@mdi/js": "^7.4.47",
69
69
  "@mdi/react": "^1.6.1",
70
- "@mui/icons-material": "^7.1.2",
71
- "@types/node": "^24.0.3",
72
- "@types/react": "^19.1.8",
73
- "@types/react-dom": "^19.1.6",
70
+ "@mui/icons-material": "^7.3.6",
71
+ "@types/node": "^25.0.2",
72
+ "@types/react": "^19.2.7",
73
+ "@types/react-dom": "^19.2.3",
74
74
  "@types/react-syntax-highlighter": "^15.5.13",
75
75
  "@types/react-transition-group": "^4.4.12",
76
- "mime": "^4.0.7",
77
- "react": "^19.1.0",
78
- "react-dom": "^19.1.0",
76
+ "mime": "^4.1.0",
77
+ "react": "^19.2.3",
78
+ "react-dom": "^19.2.3",
79
79
  "react-markdown": "^10.1.0",
80
- "react-syntax-highlighter": "^15.6.1",
80
+ "react-syntax-highlighter": "^16.1.0",
81
81
  "remark-gfm": "^4.0.1",
82
- "typescript": "^5.8.3",
83
- "vite": "^6.3.5"
82
+ "typescript": "^5.9.3",
83
+ "vite": "^7.3.0"
84
84
  }
85
85
  }