x-ui-design 0.9.90 → 1.0.1

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 (45) hide show
  1. package/dist/esm/types/components/DatePicker/RangePicker/RangePicker.d.ts +1 -1
  2. package/dist/esm/types/components/Popover/Popover.d.ts +1 -1
  3. package/dist/esm/types/helpers/index.d.ts +0 -7
  4. package/dist/esm/types/hooks/usePosition.d.ts +15 -0
  5. package/dist/esm/types/types/datepicker.d.ts +2 -2
  6. package/dist/esm/types/types/dropdown.d.ts +3 -2
  7. package/dist/esm/types/types/index.d.ts +0 -1
  8. package/dist/esm/types/types/popover.d.ts +2 -4
  9. package/dist/esm/types/types/select.d.ts +1 -1
  10. package/dist/esm/types/utils/index.d.ts +0 -1
  11. package/dist/index.esm.js +290 -462
  12. package/dist/index.esm.js.map +1 -1
  13. package/dist/index.js +290 -462
  14. package/dist/index.js.map +1 -1
  15. package/lib/components/DatePicker/DatePicker.tsx +21 -23
  16. package/lib/components/DatePicker/RangePicker/RangePicker.tsx +26 -34
  17. package/lib/components/DatePicker/RangePicker/style.css +2 -1
  18. package/lib/components/DatePicker/TimePicker/TimePicker.tsx +46 -57
  19. package/lib/components/DatePicker/TimePicker/style.css +26 -9
  20. package/lib/components/DatePicker/style.css +1 -4
  21. package/lib/components/Dropdown/Dropdown.tsx +97 -97
  22. package/lib/components/Dropdown/style.css +76 -8
  23. package/lib/components/Menu/Item/Item.tsx +0 -4
  24. package/lib/components/Menu/Menu.tsx +6 -13
  25. package/lib/components/Menu/index.css +4 -5
  26. package/lib/components/Popover/Popover.tsx +53 -88
  27. package/lib/components/Popover/style.css +59 -1
  28. package/lib/components/Result/Result.tsx +1 -1
  29. package/lib/components/Select/Option/Option.tsx +1 -0
  30. package/lib/components/Select/Select.tsx +18 -19
  31. package/lib/helpers/index.ts +0 -51
  32. package/lib/hooks/usePosition.ts +206 -0
  33. package/lib/styles/global.css +3 -81
  34. package/lib/types/datepicker.ts +2 -2
  35. package/lib/types/dropdown.ts +5 -2
  36. package/lib/types/index.ts +1 -3
  37. package/lib/types/popover.ts +2 -4
  38. package/lib/types/select.ts +1 -1
  39. package/lib/utils/index.ts +0 -2
  40. package/package.json +1 -1
  41. package/src/app/globals.css +48 -0
  42. package/src/app/layout.tsx +1 -1
  43. package/src/app/page.tsx +24 -203
  44. package/dist/esm/types/hooks/usePopupPosition.d.ts +0 -17
  45. package/lib/hooks/usePopupPosition.ts +0 -265
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  import { TRangePickerProps } from '../../../types/datepicker';
3
3
  import './style.css';
4
- declare const RangePicker: ({ prefixCls, value, onChange, placeholder, disabled, error, format, prefix, allowClear, inputReadOnly, size, picker, locale, disabledDate, onVisibleChange, onCalendarChange, style, className, separator, defaultValue, bordered, getPopupContainer, placement, }: TRangePickerProps) => React.JSX.Element;
4
+ declare const RangePicker: ({ prefixCls, value, onChange, placeholder, disabled, error, format, prefix, allowClear, inputReadOnly, size, picker, locale, disabledDate, onVisibleChange, onCalendarChange, style, className, separator, defaultValue, bordered, getPopupContainer, placement }: TRangePickerProps) => React.JSX.Element;
5
5
  export default RangePicker;
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
2
  import { PopoverProps } from "../../types/popover";
3
3
  import './style.css';
4
- declare const Popover: ({ prefixCls, content, children, trigger, placement, open, visible, title, style, overlayClassName, overlayStyle, onVisibleChange, getPopupContainer, listenPopoverPossitions }: PopoverProps) => React.JSX.Element;
4
+ declare const Popover: ({ prefixCls, content, children, trigger, placement, open, visible, title, style, overlayClassName, overlayStyle, onVisibleChange, getPopupContainer }: PopoverProps) => React.JSX.Element;
5
5
  export default Popover;
@@ -2,10 +2,3 @@ import { RuleType } from '../types';
2
2
  export declare const parseValue: (value: RuleType) => RuleType;
3
3
  export declare function createArray(length: number): number[];
4
4
  export declare function clsx(...args: RuleType[]): string;
5
- export declare function getElementParentDetails(el: HTMLElement | null, includeSelf?: boolean): {
6
- relativePosition: {
7
- left: number;
8
- top: number;
9
- };
10
- scrollableParents: HTMLElement | null;
11
- };
@@ -0,0 +1,15 @@
1
+ import { Placement } from "../types";
2
+ import { CSSProperties, RefObject } from "react";
3
+ type TPosition = {
4
+ isOpen: boolean;
5
+ popupRef: RefObject<HTMLDivElement | null>;
6
+ triggerRef: RefObject<HTMLDivElement | null>;
7
+ getPopupContainer?: HTMLElement;
8
+ placement?: Placement;
9
+ offset?: number;
10
+ };
11
+ export declare const usePosition: ({ isOpen, offset, popupRef, placement, triggerRef, getPopupContainer }: TPosition) => {
12
+ showPlacement: string;
13
+ dropdownPosition: CSSProperties;
14
+ };
15
+ export {};
@@ -34,7 +34,7 @@ export type TDatePickerProps = DefaultProps & {
34
34
  onChange?: (date: RuleType | RuleType[], dateString: string | string[]) => void;
35
35
  onCalendarChange?: (date: RuleType | RuleType[], dateString: string | string[], info: BaseInfo) => void;
36
36
  onVisibleChange?: ((open: boolean) => void) | undefined;
37
- getPopupContainer?: ((node: HTMLElement) => HTMLElement) | undefined;
37
+ getPopupContainer?: (node: HTMLElement) => HTMLElement;
38
38
  showToday?: boolean;
39
39
  inputReadOnly?: boolean;
40
40
  picker?: PanelMode;
@@ -115,7 +115,7 @@ export type TimePickerProps = DefaultProps & {
115
115
  onSelect?: ((value: Date | null) => void) | undefined;
116
116
  showNow?: boolean;
117
117
  clearIcon?: ReactNode;
118
- getPopupContainer?: ((node: HTMLElement) => HTMLElement) | undefined;
118
+ getPopupContainer?: (node: HTMLElement) => HTMLElement;
119
119
  suffixIcon?: ReactNode;
120
120
  placeholder?: string;
121
121
  placement?: Placement;
@@ -1,5 +1,6 @@
1
1
  import { CSSProperties, MouseEvent, ReactElement, ReactNode, RefObject } from "react";
2
- import { DefaultProps, Placement, TriggerType } from ".";
2
+ import { DefaultProps, Placement } from ".";
3
+ export type TriggerType = 'click' | 'hover' | 'contextMenu' | Array<TriggerType>;
3
4
  export interface DropdownItemType {
4
5
  key: string;
5
6
  label?: ReactNode;
@@ -20,7 +21,7 @@ export type DropdownProps = DefaultProps & {
20
21
  placement?: Placement;
21
22
  overlayClassName?: string;
22
23
  overlayStyle?: CSSProperties;
23
- getPopupContainer?: ((node: HTMLElement) => HTMLElement) | undefined;
24
+ getPopupContainer?: (node: HTMLElement) => HTMLElement;
24
25
  destroyOnHidden?: boolean;
25
26
  disabled?: boolean;
26
27
  arrow?: boolean;
@@ -25,4 +25,3 @@ export type SyntheticBaseEvent = {
25
25
  currentTarget: EventTarget;
26
26
  };
27
27
  export type Placement = 'bottomLeft' | 'bottom' | 'bottomRight' | 'topLeft' | 'top' | 'topRight' | 'left' | 'right';
28
- export type TriggerType = 'click' | 'hover' | 'contextMenu' | Array<TriggerType>;
@@ -1,17 +1,15 @@
1
1
  import { CSSProperties, ReactNode } from "react";
2
- import { DefaultProps, TriggerType } from ".";
2
+ import { DefaultProps } from ".";
3
3
  export type PopoverProps = DefaultProps & {
4
4
  content: ReactNode;
5
5
  children: ReactNode;
6
- trigger?: TriggerType;
6
+ trigger?: "click" | "hover";
7
7
  placement?: "top" | "bottom" | "left" | "right" | "topRight" | "bottomRight" | "topLeft" | "bottomLeft";
8
8
  open?: boolean;
9
9
  overlayStyle?: CSSProperties;
10
10
  overlayClassName?: string;
11
- listenPopoverPossitions?: CSSProperties;
12
11
  title?: string | ReactNode;
13
12
  visible?: boolean;
14
- placementPositionOffset?: number;
15
13
  onVisibleChange?: ((open: boolean) => void) | undefined;
16
14
  getPopupContainer?: ((node: HTMLElement) => HTMLElement) | undefined;
17
15
  };
@@ -43,7 +43,7 @@ export type SelectProps = DefaultProps & {
43
43
  searchIcon?: ReactNode;
44
44
  open?: boolean;
45
45
  notFoundContent?: ReactNode;
46
- getPopupContainer?: ((node: HTMLElement) => HTMLElement) | undefined;
46
+ getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
47
47
  dropdownRender?: (menu: ReactNode) => ReactNode;
48
48
  feedbackIcons?: boolean;
49
49
  placement?: Placement;
@@ -1,4 +1,3 @@
1
- export declare const prefixClsPopupPosition = "xUi-popup-position";
2
1
  export declare const prefixClsForm = "xUi-form";
3
2
  export declare const prefixClsFormItem = "xUi-form-item";
4
3
  export declare const prefixClsEmpty = "xUi-empty";