@plesk/ui-library 3.27.4 → 3.28.2

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 (62) hide show
  1. package/cjs/components/Button/Button.js +13 -6
  2. package/cjs/components/Form/Form.js +7 -2
  3. package/cjs/components/FormField/FormField.js +7 -0
  4. package/cjs/components/FormFieldPassword/estimatePassword.js +19 -10
  5. package/cjs/components/FormFieldText/FormFieldText.js +13 -5
  6. package/cjs/components/InputFile/InputFile.js +4 -2
  7. package/cjs/components/List/List.js +1 -6
  8. package/cjs/components/Skeleton/Skeleton.js +49 -0
  9. package/cjs/components/Skeleton/Skeleton.stories.js +26 -0
  10. package/cjs/components/Skeleton/SkeletonTabs.js +41 -0
  11. package/cjs/components/Skeleton/SkeletonTabs.stories.js +17 -0
  12. package/cjs/components/Skeleton/SkeletonText.js +45 -0
  13. package/cjs/components/Skeleton/SkeletonText.stories.js +35 -0
  14. package/cjs/components/Skeleton/index.js +31 -0
  15. package/cjs/components/index.js +31 -1
  16. package/cjs/components/utils.js +6 -2
  17. package/cjs/index.js +1 -1
  18. package/dist/plesk-ui-library-rtl.css +1 -1
  19. package/dist/plesk-ui-library-rtl.css.map +1 -1
  20. package/dist/plesk-ui-library.css +1 -1
  21. package/dist/plesk-ui-library.css.map +1 -1
  22. package/dist/plesk-ui-library.js +344 -32
  23. package/dist/plesk-ui-library.js.map +1 -1
  24. package/dist/plesk-ui-library.min.js +3 -3
  25. package/dist/plesk-ui-library.min.js.map +1 -1
  26. package/esm/components/Button/Button.js +14 -7
  27. package/esm/components/Form/Form.js +7 -2
  28. package/esm/components/FormField/FormField.js +7 -0
  29. package/esm/components/FormFieldPassword/estimatePassword.js +19 -10
  30. package/esm/components/FormFieldText/FormFieldText.js +13 -5
  31. package/esm/components/InputFile/InputFile.js +4 -2
  32. package/esm/components/List/List.js +1 -6
  33. package/esm/components/Skeleton/Skeleton.js +34 -0
  34. package/esm/components/Skeleton/Skeleton.stories.js +10 -0
  35. package/esm/components/Skeleton/SkeletonTabs.js +26 -0
  36. package/esm/components/Skeleton/SkeletonTabs.stories.js +4 -0
  37. package/esm/components/Skeleton/SkeletonText.js +30 -0
  38. package/esm/components/Skeleton/SkeletonText.stories.js +16 -0
  39. package/esm/components/Skeleton/index.js +4 -0
  40. package/esm/components/index.js +4 -1
  41. package/esm/components/utils.js +2 -1
  42. package/esm/index.js +1 -1
  43. package/package.json +1 -1
  44. package/styleguide/build/bundle.699238d9.js +2 -0
  45. package/styleguide/build/{bundle.5df0ee96.js.LICENSE.txt → bundle.699238d9.js.LICENSE.txt} +0 -0
  46. package/styleguide/index.html +2 -2
  47. package/types/src/components/Form/Form.d.ts +7 -136
  48. package/types/src/components/Form/FormContext.d.ts +2 -14
  49. package/types/src/components/Form/types.d.ts +125 -0
  50. package/types/src/components/FormFieldPassword/FormFieldPassword.d.ts +2 -2
  51. package/types/src/components/InputFile/InputFile.d.ts +6 -1
  52. package/types/src/components/Skeleton/Skeleton.d.ts +49 -0
  53. package/types/src/components/Skeleton/Skeleton.stories.d.ts +12 -0
  54. package/types/src/components/Skeleton/SkeletonTabs.d.ts +23 -0
  55. package/types/src/components/Skeleton/SkeletonTabs.stories.d.ts +6 -0
  56. package/types/src/components/Skeleton/SkeletonText.d.ts +34 -0
  57. package/types/src/components/Skeleton/SkeletonText.stories.d.ts +38 -0
  58. package/types/src/components/Skeleton/index.d.ts +3 -0
  59. package/types/src/components/TextArea/TextArea.d.ts +2 -2
  60. package/types/src/components/index.d.ts +3 -0
  61. package/types/src/components/utils.d.ts +1 -0
  62. package/styleguide/build/bundle.5df0ee96.js +0 -2
@@ -4,7 +4,7 @@
4
4
  <meta charset="utf-8">
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
6
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
7
- <title>Plesk UI Library 3.27.4</title>
7
+ <title>Plesk UI Library 3.28.2</title>
8
8
  <meta name="msapplication-TileColor" content="#da532c">
9
9
  <meta name="theme-color" content="#ffffff">
10
10
  <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
@@ -40,6 +40,6 @@
40
40
  </script>
41
41
  <noscript><div><img src="https://mc.yandex.ru/watch/56446840" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
42
42
  <!-- /Yandex.Metrika counter -->
43
- <script src="build/bundle.5df0ee96.js"></script>
43
+ <script src="build/bundle.699238d9.js"></script>
44
44
  </body>
45
45
  </html>
@@ -1,163 +1,34 @@
1
1
  import React from 'react';
2
+ import { FormInstanceHandles } from './types';
2
3
  import './Form.less';
3
- declare type FormInstanceHandles = {
4
- submit: () => void;
5
- };
6
- declare type FormValues = {
7
- [key: string]: any;
8
- };
9
- declare type FormErrors = {
10
- [key: string]: any;
11
- };
12
4
  /**
13
5
  * `Form` component is used for entering and submitting of user data.
14
6
  * [More details about designing of forms.](#!/Good%20Forms)
15
7
  * @since 0.0.54
16
8
  */
17
9
  declare const RefForwardingForm: React.ForwardRefExoticComponent<{
18
- /**
19
- * Required mark.
20
- * @since 0.0.54
21
- */
22
10
  requiredMark?: React.ReactNode;
23
- /**
24
- * Hide required legend.
25
- * @ignore
26
- * @deprecated
27
- */
28
11
  hideRequiredLegend?: boolean | undefined;
29
- /**
30
- * Form values.
31
- * @since 0.0.57
32
- */
33
- values?: FormValues | undefined;
34
- /**
35
- * Form errors.
36
- * @since 0.0.57
37
- */
38
- errors?: FormErrors | undefined;
39
- /**
40
- * Current active state
41
- * @since 0.0.59
42
- */
12
+ values?: Record<string, any> | undefined;
13
+ errors?: Record<string, any> | undefined;
43
14
  state?: "cancel" | "submit" | "apply" | undefined;
44
- /**
45
- * Content of the `Form`.
46
- * @since 0.0.54
47
- */
48
15
  children?: React.ReactNode;
49
- /**
50
- * Submit button visibility or custom configuration
51
- * @since 0.0.58
52
- */
53
- submitButton?: boolean | React.PropsWithChildren<{
54
- size?: "md" | "lg" | undefined;
55
- intent?: "success" | "info" | "warning" | "danger" | "primary" | "secondary" | undefined;
56
- ghost?: boolean | undefined;
57
- arrow?: "forward" | "backward" | undefined;
58
- selected?: boolean | undefined;
59
- onToggle?: (() => void) | undefined;
60
- state?: "active" | "loading" | "hovered" | "focused" | undefined;
61
- disabled?: boolean | undefined;
62
- tooltip?: React.ReactNode;
63
- icon?: any;
64
- caret?: React.ReactNode;
65
- fill?: boolean | undefined;
66
- children?: React.ReactNode;
67
- component?: string | React.ComponentClass<{}, any> | React.FunctionComponent<{}> | undefined;
68
- className?: string | undefined;
69
- baseClassName?: string | undefined;
70
- } & Pick<React.HTMLProps<HTMLButtonElement>, "max" | "required" | "low" | "high" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "wrap" | "multiple" | "key" | "ref" | "children" | "list" | "step" | "target" | "role" | "resource" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "name" | "nonce" | "noValidate" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "type" | "useMap" | "value" | "width" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">> | undefined;
71
- /**
72
- * Apply button visibility or custom configuration
73
- * @since 0.0.58
74
- */
75
- applyButton?: boolean | React.PropsWithChildren<{
76
- size?: "md" | "lg" | undefined;
77
- intent?: "success" | "info" | "warning" | "danger" | "primary" | "secondary" | undefined;
78
- ghost?: boolean | undefined;
79
- arrow?: "forward" | "backward" | undefined;
80
- selected?: boolean | undefined;
81
- onToggle?: (() => void) | undefined;
82
- state?: "active" | "loading" | "hovered" | "focused" | undefined;
83
- disabled?: boolean | undefined;
84
- tooltip?: React.ReactNode;
85
- icon?: any;
86
- caret?: React.ReactNode;
87
- fill?: boolean | undefined;
88
- children?: React.ReactNode;
89
- component?: string | React.ComponentClass<{}, any> | React.FunctionComponent<{}> | undefined;
90
- className?: string | undefined;
91
- baseClassName?: string | undefined;
92
- } & Pick<React.HTMLProps<HTMLButtonElement>, "max" | "required" | "low" | "high" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "wrap" | "multiple" | "key" | "ref" | "children" | "list" | "step" | "target" | "role" | "resource" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "name" | "nonce" | "noValidate" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "type" | "useMap" | "value" | "width" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">> | undefined;
93
- /**
94
- * Cancel button visibility or custom configuration
95
- * @since 0.0.58
96
- */
97
- cancelButton?: boolean | React.PropsWithChildren<{
98
- size?: "md" | "lg" | undefined;
99
- intent?: "success" | "info" | "warning" | "danger" | "primary" | "secondary" | undefined;
100
- ghost?: boolean | undefined;
101
- arrow?: "forward" | "backward" | undefined;
102
- selected?: boolean | undefined;
103
- onToggle?: (() => void) | undefined;
104
- state?: "active" | "loading" | "hovered" | "focused" | undefined;
105
- disabled?: boolean | undefined;
106
- tooltip?: React.ReactNode;
107
- icon?: any;
108
- caret?: React.ReactNode;
109
- fill?: boolean | undefined;
110
- children?: React.ReactNode;
111
- component?: string | React.ComponentClass<{}, any> | React.FunctionComponent<{}> | undefined;
112
- className?: string | undefined;
113
- baseClassName?: string | undefined;
114
- } & Pick<React.HTMLProps<HTMLButtonElement>, "max" | "required" | "low" | "high" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "wrap" | "multiple" | "key" | "ref" | "children" | "list" | "step" | "target" | "role" | "resource" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "name" | "nonce" | "noValidate" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "type" | "useMap" | "value" | "width" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">> | undefined;
115
- /**
116
- * Additional buttons
117
- * @since 0.0.58
118
- */
16
+ submitButton?: boolean | {} | undefined;
17
+ applyButton?: boolean | {} | undefined;
18
+ cancelButton?: boolean | {} | undefined;
119
19
  additionalButtons?: React.ReactNode[] | undefined;
120
- /**
121
- * A callback function, can be executed when some field value is changing.
122
- * @since 3.1.0
123
- */
124
20
  onFieldChange?: ((name: string, value: any) => void) | undefined;
125
- /**
126
- * Submit handler
127
- * @since 0.0.54
128
- */
129
- onSubmit?: ((values: FormValues, isApply?: boolean | undefined) => void) | undefined;
130
- /**
131
- * Additional class name for the buttons container.
132
- * @since 0.0.66
133
- */
21
+ onSubmit?: ((values: Record<string, any>, isApply?: boolean | undefined) => void) | undefined;
134
22
  footerClassName?: string | undefined;
135
- /**
136
- * Form responsive view will be switched automatically.
137
- * Specify this parameter explicitly if you want disable this behaviour and choice vertical or horizontal form view.
138
- * @since 0.4.1
139
- */
140
23
  vertical?: boolean | undefined;
141
- /**
142
- * @ignore
143
- */
144
24
  className?: string | undefined;
145
- /**
146
- * @ignore
147
- */
148
25
  baseClassName?: string | undefined;
149
- /**
150
- * @ignore
151
- */
152
26
  render?: ((params: {
153
27
  renderForm: (params: {
154
28
  actionButtons?: React.ReactNode;
155
29
  }) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
156
30
  renderActionButtons: () => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
157
31
  }) => React.ReactNode) | undefined;
158
- /**
159
- * @ignore
160
- */
161
32
  innerRef?: React.MutableRefObject<HTMLFormElement | null> | undefined;
162
33
  } & Pick<React.HTMLProps<HTMLFormElement>, "max" | "required" | "low" | "high" | "disabled" | "default" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "multiple" | "key" | "children" | "list" | "step" | "target" | "role" | "resource" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "name" | "nonce" | "noValidate" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "type" | "useMap" | "value" | "width" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<FormInstanceHandles>>;
163
34
  export default RefForwardingForm;
@@ -1,16 +1,4 @@
1
- import { ReactNode } from 'react';
2
- export declare type FormContextProps = {
3
- getValue: (name: string, def?: any) => any;
4
- setValue: (name: string, value: any) => void;
5
- getErrors: (name: string) => {
6
- [key: string]: any;
7
- };
8
- setRequiredField: (name: string, required: boolean) => void;
9
- registerField: (name: string, field: {
10
- focus: () => void;
11
- }) => void;
12
- unregisterField: (name: string) => void;
13
- getRequiredMark: () => ReactNode;
14
- };
1
+ /// <reference types="react" />
2
+ import { FormContextProps } from './types';
15
3
  declare const FormContext: import("react").Context<FormContextProps | undefined>;
16
4
  export default FormContext;
@@ -0,0 +1,125 @@
1
+ import { ComponentPropsWithRef, HTMLProps, MutableRefObject, ReactElement, ReactNode } from 'react';
2
+ import Button from '../Button';
3
+ export declare type FormInstanceHandles = {
4
+ submit: () => void;
5
+ };
6
+ export declare type FormValues = Record<string, any>;
7
+ export declare type FormErrors = Record<string, any>;
8
+ export declare type FormProps<FV extends FormValues> = {
9
+ /**
10
+ * Required mark.
11
+ * @since 0.0.54
12
+ */
13
+ requiredMark?: ReactNode;
14
+ /**
15
+ * Hide required legend.
16
+ * @ignore
17
+ * @deprecated
18
+ */
19
+ hideRequiredLegend?: boolean;
20
+ /**
21
+ * Form values.
22
+ * @since 0.0.57
23
+ */
24
+ values?: FV;
25
+ /**
26
+ * Form errors.
27
+ * @since 0.0.57
28
+ */
29
+ errors?: FormErrors;
30
+ /**
31
+ * Current active state
32
+ * @since 0.0.59
33
+ */
34
+ state?: 'submit' | 'apply' | 'cancel';
35
+ /**
36
+ * Content of the `Form`.
37
+ * @since 0.0.54
38
+ */
39
+ children?: ReactNode;
40
+ /**
41
+ * Submit button visibility or custom configuration
42
+ * @since 0.0.58
43
+ */
44
+ submitButton?: boolean | ComponentPropsWithRef<typeof Button>;
45
+ /**
46
+ * Apply button visibility or custom configuration
47
+ * @since 0.0.58
48
+ */
49
+ applyButton?: boolean | ComponentPropsWithRef<typeof Button>;
50
+ /**
51
+ * Cancel button visibility or custom configuration
52
+ * @since 0.0.58
53
+ */
54
+ cancelButton?: boolean | ComponentPropsWithRef<typeof Button>;
55
+ /**
56
+ * Additional buttons
57
+ * @since 0.0.58
58
+ */
59
+ additionalButtons?: ReactNode[];
60
+ /**
61
+ * A callback function, can be executed when some field value is changing.
62
+ * @since 3.1.0
63
+ */
64
+ onFieldChange?: (name: string, value: any) => void;
65
+ /**
66
+ * Submit handler
67
+ * @since 0.0.54
68
+ */
69
+ onSubmit?: (values: FV, isApply?: boolean) => void;
70
+ /**
71
+ * Additional class name for the buttons container.
72
+ * @since 0.0.66
73
+ */
74
+ footerClassName?: string;
75
+ /**
76
+ * Form responsive view will be switched automatically.
77
+ * Specify this parameter explicitly if you want disable this behaviour and choice vertical or horizontal form view.
78
+ * @since 0.4.1
79
+ */
80
+ vertical?: boolean;
81
+ /**
82
+ * @ignore
83
+ */
84
+ className?: string;
85
+ /**
86
+ * @ignore
87
+ */
88
+ baseClassName?: string;
89
+ /**
90
+ * @ignore
91
+ */
92
+ render?: (params: {
93
+ renderForm: (params: {
94
+ actionButtons?: ReactNode;
95
+ }) => ReactElement;
96
+ renderActionButtons: () => ReactElement;
97
+ }) => ReactNode;
98
+ /**
99
+ * @ignore
100
+ */
101
+ innerRef?: MutableRefObject<null | HTMLFormElement>;
102
+ } & Omit<HTMLProps<HTMLFormElement>, 'onSubmit' | 'ref'>;
103
+ export declare type FormState<FV> = {
104
+ values?: FV;
105
+ vertical: boolean;
106
+ requiredFields: string[];
107
+ formContext: FormContextProps;
108
+ prevValues?: FV;
109
+ prevErrors?: FormErrors;
110
+ prevRequiredMark?: ReactNode;
111
+ };
112
+ export declare type FormContextProps = {
113
+ getValues: () => Readonly<FormValues> | undefined;
114
+ getValue: (name: string, def?: any) => any;
115
+ setValue: (name: string, value: any) => void;
116
+ getErrors: (name: string) => {
117
+ [key: string]: any;
118
+ };
119
+ setRequiredField: (name: string, required: boolean) => void;
120
+ registerField: (name: string, field: {
121
+ focus: () => void;
122
+ }) => void;
123
+ unregisterField: (name: string) => void;
124
+ getRequiredMark: () => ReactNode;
125
+ };
@@ -1,4 +1,4 @@
1
- import { Component, ComponentProps, ReactElement, RefObject } from 'react';
1
+ import { Component, ComponentProps, ComponentPropsWithRef, ReactElement, RefObject } from 'react';
2
2
  import Button from '../Button';
3
3
  import FormField from '../FormField';
4
4
  import { PasswordMeterProps } from './PasswordMeter';
@@ -43,7 +43,7 @@ export declare type FormFieldPasswordProps = {
43
43
  * A render function for customizing the password generation button.
44
44
  * @since 3.13.0
45
45
  */
46
- generateButton?: (generateButtonProps: ComponentProps<typeof Button>) => ReactElement;
46
+ generateButton?: (generateButtonProps: ComponentPropsWithRef<typeof Button>) => ReactElement;
47
47
  /**
48
48
  * @ignore
49
49
  */
@@ -40,10 +40,15 @@ declare type InputFileProps = {
40
40
  locale?: {
41
41
  browseButton?: ReactNode;
42
42
  };
43
+ /**
44
+ * Defines the file types the file input should accept
45
+ * @since 3.28.1
46
+ */
47
+ accept?: string;
43
48
  };
44
49
  /**
45
50
  * `InputFile` component is used for browsing and choosing a file from the local disk.
46
51
  * @since 3.2.0
47
52
  */
48
- declare const InputFile: ({ baseClassName, className, onChange, name, disabled, locale, testId, ...props }: InputFileProps) => JSX.Element;
53
+ declare const InputFile: ({ baseClassName, className, onChange, name, disabled, locale, testId, accept, ...props }: InputFileProps) => JSX.Element;
49
54
  export default InputFile;
@@ -0,0 +1,49 @@
1
+ import { ComponentType, FC } from 'react';
2
+ import './Skeleton.less';
3
+ export declare type SkeletonProps = {
4
+ /**
5
+ * Skeleton width. For the width specified as a number, `'px'` is used as the unit.
6
+ * You can also specify a value with other units such as `'em'`, `'%'`, etc. (f.e. 20%, 10em)
7
+ * @since 3.28.0
8
+ */
9
+ width?: number | string;
10
+ /**
11
+ * Skeleton max width. For the width specified as a number, `'px'` is used as the unit.
12
+ * You can also specify a value with other units such as `'em'`, `'%'`, etc. (f.e. 20%, 10em)
13
+ * @since 3.28.0
14
+ */
15
+ maxWidth?: number | string;
16
+ /**
17
+ * Skeleton height. For the width specified as a number, `'px'` is used as the unit.
18
+ * You can also specify a value with other units such as `'em'`, `'%'`, etc. (f.e. 20%, 10em)
19
+ * @since 3.28.0
20
+ */
21
+ height?: number | string;
22
+ /**
23
+ * custom styles for skeleton
24
+ * @since 3.28.0
25
+ */
26
+ style?: {
27
+ [key: string]: string;
28
+ };
29
+ /**
30
+ * Component to render as the root element.
31
+ * @since 3.28.0
32
+ */
33
+ component?: ComponentType | keyof JSX.IntrinsicElements;
34
+ /**
35
+ * @ignore
36
+ */
37
+ baseClassName?: string;
38
+ /**
39
+ * @ignore
40
+ */
41
+ className?: string;
42
+ };
43
+ /**
44
+ * `Skeleton` (or content-placeholder) is placeholder preview of content before the data gets loaded to reduce load-time frustration.
45
+ * Skeleton is used for non-text components, images, media-objects, etc.
46
+ * @since 3.28.0
47
+ */
48
+ declare const Skeleton: FC<SkeletonProps>;
49
+ export default Skeleton;
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ export declare const Basic: {
3
+ (args: React.PropsWithChildren<import("./Skeleton").SkeletonProps>): JSX.Element;
4
+ args: {};
5
+ };
6
+ export declare const CustomSize: {
7
+ (args: React.PropsWithChildren<import("./Skeleton").SkeletonProps>): JSX.Element;
8
+ args: {
9
+ width: number;
10
+ height: number;
11
+ };
12
+ };
@@ -0,0 +1,23 @@
1
+ import { FC } from 'react';
2
+ import './SkeletonTabs.less';
3
+ declare type SkeletonTabsProps = {
4
+ /**
5
+ * Number of tabs
6
+ * @since 3.28.0
7
+ */
8
+ count?: number;
9
+ /**
10
+ * @ignore
11
+ */
12
+ className: string;
13
+ /**
14
+ * @ignore
15
+ */
16
+ baseClassName: string;
17
+ };
18
+ /**
19
+ * Skeleton for tabs component
20
+ * @since `3.28.0
21
+ */
22
+ declare const SkeletonTabs: FC<SkeletonTabsProps>;
23
+ export default SkeletonTabs;
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ export declare const Basic: (args: React.PropsWithChildren<{
3
+ count?: number | undefined;
4
+ className: string;
5
+ baseClassName: string;
6
+ }>) => JSX.Element;
@@ -0,0 +1,34 @@
1
+ import { FC, ComponentType } from 'react';
2
+ import { SkeletonProps } from './Skeleton';
3
+ import './SkeletonText.less';
4
+ declare type SkeletonTextProps = {
5
+ /**
6
+ * Number of rows
7
+ * @since 3.28.0
8
+ */
9
+ lines?: number;
10
+ /**
11
+ * Props for line
12
+ * @since 3.28.0
13
+ */
14
+ lineProps?: SkeletonProps;
15
+ /**
16
+ * Component to render as the root element.
17
+ * @since 3.28.0
18
+ */
19
+ component?: ComponentType | keyof JSX.IntrinsicElements;
20
+ /**
21
+ * @ignore
22
+ */
23
+ baseClassName?: string;
24
+ /**
25
+ * @ignore
26
+ */
27
+ className?: string;
28
+ };
29
+ /**
30
+ * Skeleton for text-containing components. Is can be used inside Paragraph, as title, or single text
31
+ * @since 3.28.0
32
+ */
33
+ declare const SkeletonText: FC<SkeletonTextProps>;
34
+ export default SkeletonText;
@@ -0,0 +1,38 @@
1
+ import React from 'react';
2
+ export declare const Basic: {
3
+ (args: React.PropsWithChildren<{
4
+ lines?: number | undefined;
5
+ lineProps?: import("./Skeleton").SkeletonProps | undefined;
6
+ component?: "symbol" | "object" | "big" | "link" | "small" | "sub" | "sup" | "track" | "progress" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "main" | "map" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "menuitem" | "keygen" | "noindex" | "webview" | "animate" | "animateMotion" | "animateTransform" | "feDropShadow" | "mpath" | React.ComponentClass<{}, any> | React.FunctionComponent<{}> | undefined;
7
+ baseClassName?: string | undefined;
8
+ className?: string | undefined;
9
+ }>): JSX.Element;
10
+ args: {};
11
+ };
12
+ export declare const LinesCount: {
13
+ (args: React.PropsWithChildren<{
14
+ lines?: number | undefined;
15
+ lineProps?: import("./Skeleton").SkeletonProps | undefined;
16
+ component?: "symbol" | "object" | "big" | "link" | "small" | "sub" | "sup" | "track" | "progress" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "main" | "map" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "menuitem" | "keygen" | "noindex" | "webview" | "animate" | "animateMotion" | "animateTransform" | "feDropShadow" | "mpath" | React.ComponentClass<{}, any> | React.FunctionComponent<{}> | undefined;
17
+ baseClassName?: string | undefined;
18
+ className?: string | undefined;
19
+ }>): JSX.Element;
20
+ args: {
21
+ lines: number;
22
+ };
23
+ };
24
+ export declare const Custom: {
25
+ (args: React.PropsWithChildren<{
26
+ lines?: number | undefined;
27
+ lineProps?: import("./Skeleton").SkeletonProps | undefined;
28
+ component?: "symbol" | "object" | "big" | "link" | "small" | "sub" | "sup" | "track" | "progress" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "main" | "map" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "menuitem" | "keygen" | "noindex" | "webview" | "animate" | "animateMotion" | "animateTransform" | "feDropShadow" | "mpath" | React.ComponentClass<{}, any> | React.FunctionComponent<{}> | undefined;
29
+ baseClassName?: string | undefined;
30
+ className?: string | undefined;
31
+ }>): JSX.Element;
32
+ args: {
33
+ lines: number;
34
+ lineProps: {
35
+ width: number;
36
+ };
37
+ };
38
+ };
@@ -0,0 +1,3 @@
1
+ export { default } from './Skeleton';
2
+ export { default as SkeletonText } from './SkeletonText';
3
+ export { default as SkeletonTabs } from './SkeletonTabs';