@progress/kendo-themes-html 5.6.1-dev.3 → 5.6.1-dev.4

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 (36) hide show
  1. package/dist/datetime-selector/tests/datetime-selector.js +1 -1
  2. package/dist/datetime-selector/tests/datetime-selector.js.map +1 -1
  3. package/dist/dialog/tests/dialog-in-window.js +2 -2
  4. package/dist/dialog/tests/dialog-in-window.js.map +2 -2
  5. package/dist/editor/tests/editor-jquery.js +49 -49
  6. package/dist/editor/tests/editor-jquery.js.map +2 -2
  7. package/dist/icon/tests/icons.js +5 -5
  8. package/dist/icon/tests/icons.js.map +1 -1
  9. package/dist/scheduler/tests/scheduler-angular-day-rtl.js +11 -11
  10. package/dist/scheduler/tests/scheduler-angular-day-rtl.js.map +2 -2
  11. package/dist/scheduler/tests/scheduler-angular-rtl.js +3 -3
  12. package/dist/scheduler/tests/scheduler-angular-rtl.js.map +2 -2
  13. package/dist/scheduler/tests/scheduler-angular.js +3 -3
  14. package/dist/scheduler/tests/scheduler-angular.js.map +2 -2
  15. package/dist/scheduler/tests/scheduler-jquery-agenda.js +2 -2
  16. package/dist/scheduler/tests/scheduler-jquery-agenda.js.map +1 -1
  17. package/dist/time-selector/tests/time-selector.js +2 -2
  18. package/dist/time-selector/tests/time-selector.js.map +1 -1
  19. package/dist/time-selector/time-selector.js +1 -1
  20. package/dist/time-selector/time-selector.js.map +1 -1
  21. package/dist/timepicker/tests/timepicker-adaptive.js +1 -1
  22. package/dist/timepicker/tests/timepicker-adaptive.js.map +1 -1
  23. package/dist/upload/tests/upload-react.js +62 -312
  24. package/dist/upload/tests/upload-react.js.map +4 -4
  25. package/package.json +3 -3
  26. package/src/datetime-selector/tests/datetime-selector.tsx +1 -1
  27. package/src/dialog/tests/dialog-in-window.tsx +2 -2
  28. package/src/editor/tests/editor-jquery.tsx +49 -49
  29. package/src/icon/tests/icons.tsx +5 -5
  30. package/src/scheduler/tests/scheduler-angular-day-rtl.tsx +11 -11
  31. package/src/scheduler/tests/scheduler-angular-rtl.tsx +3 -3
  32. package/src/scheduler/tests/scheduler-angular.tsx +3 -3
  33. package/src/scheduler/tests/scheduler-jquery-agenda.tsx +2 -2
  34. package/src/time-selector/tests/time-selector.tsx +2 -2
  35. package/src/time-selector/time-selector.tsx +1 -1
  36. package/src/upload/tests/upload-react.tsx +29 -236
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/timepicker/tests/timepicker-adaptive.tsx", "../../../src/button/button.tsx", "../../../src/utils/classNames.ts", "../../../src/utils/theme.ts", "../../../src/icon/icon.tsx", "../../../src/time-selector/time-selector.tsx"],
4
- "sourcesContent": ["import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport { Button } from '../../button';\nimport { TimeSelector } from '../../time-selector';\n\nconst root = ReactDOM.createRoot(\n document.getElementById('app') as HTMLElement\n);\n\nconst styles = `\n .k-actionsheet-container {\n width: 100%;\n height: 600px;\n position: relative;\n transform: translateZ(0);\n }\n`;\n\nroot.render(\n <>\n <style>{styles}</style>\n <div id=\"test-area\" className=\"k-d-grid k-grid-cols-2\">\n\n <span>partial</span>\n <span>full screen</span>\n\n <section>\n <div className=\"k-actionsheet-container\">\n <div className=\"k-overlay\"></div>\n\n <div className=\"k-actionsheet k-actionsheet-bottom k-adaptive-actionsheet\">\n <div className=\"k-actionsheet-titlebar\">\n <div className=\"k-actionsheet-title k-text-center\">\n <div>Select dates</div>\n <div className=\"k-text-muted\">DD / MM / YY</div>\n </div>\n <div className=\"k-actionsheet-actions\">\n <Button icon=\"x\" fillMode=\"flat\"></Button>\n </div>\n </div>\n <div className=\"k-actionsheet-content\">\n <TimeSelector size=\"large\"></TimeSelector>\n </div>\n <div className=\"k-actionsheet-footer k-actions k-actions-stretched\">\n <Button size=\"large\" themeColor=\"primary\">Select date</Button>\n </div>\n </div>\n </div>\n </section>\n <section>\n <div className=\"k-actionsheet-container\">\n <div className=\"k-overlay\"></div>\n\n <div className=\"k-actionsheet k-actionsheet-bottom k-actionsheet-fullscreen k-adaptive-actionsheet\">\n <div className=\"k-actionsheet-titlebar\">\n <div className=\"k-actionsheet-title k-text-center\">\n <div>Select dates</div>\n <div className=\"k-text-muted\">DD / MM / YY</div>\n </div>\n <div className=\"k-actionsheet-actions\">\n <Button icon=\"x\" fillMode=\"flat\"></Button>\n </div>\n </div>\n <div className=\"k-actionsheet-content\">\n <TimeSelector size=\"large\"></TimeSelector>\n </div>\n <div className=\"k-actionsheet-footer k-actions k-actions-stretched\">\n <Button size=\"large\" themeColor=\"primary\">Select date</Button>\n </div>\n </div>\n </div>\n </section>\n </div>\n\n </>\n);\n", "import * as React from 'react';\nimport { classNames, kendoThemeMaps } from '../utils';\nimport { Icon } from '../icon/';\n\nexport interface ButtonProps {\n children?: React.ReactNode;\n className?: string;\n dir?: string;\n style?: React.CSSProperties;\n iconClassName?: string;\n text?: string;\n icon?: string;\n size?: null | 'small' | 'medium' | 'large';\n rounded: null | 'small' | 'medium' | 'large' | 'full';\n fillMode?: null | 'solid' | 'outline' | 'flat' | 'link' | 'clear';\n themeColor?: null | 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';\n hover?: boolean;\n focus?: boolean;\n active?: boolean;\n selected?: boolean;\n disabled?: boolean;\n showArrow?: boolean;\n arrowIconName?: string;\n}\n\nexport class Button extends React.Component<ButtonProps> {\n\n static defaultProps = {\n size: 'medium',\n rounded: 'medium',\n fillMode: 'solid',\n themeColor: 'base',\n showArrow: false,\n arrowIconName: 'arrow-s'\n };\n\n render() {\n const {\n children,\n className,\n iconClassName,\n text,\n icon,\n size,\n rounded,\n fillMode,\n themeColor,\n hover,\n focus,\n active,\n selected,\n disabled,\n showArrow,\n arrowIconName,\n ...htmlAttributes\n } = this.props;\n\n const hasIcon = (icon !== undefined);\n const hasChildren = children !== undefined;\n\n return (\n <button\n style={this.props.style}\n {...htmlAttributes}\n dir={this.props.dir}\n className={classNames(\n className,\n 'k-button',\n {\n [`k-button-${kendoThemeMaps.sizeMap[size!] || size}`]: size,\n [`k-button-${fillMode}`]: fillMode,\n [`k-button-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),\n [`k-rounded-${kendoThemeMaps.roundedMap[rounded!] || rounded}`]: rounded,\n 'k-icon-button': !hasChildren && hasIcon,\n 'k-hover': hover,\n 'k-focus': focus,\n 'k-active': active,\n 'k-selected': selected,\n 'k-disabled': disabled\n }\n )}>\n {icon && <Icon className={classNames(iconClassName, 'k-button-icon')} name={icon} />}\n\n {text\n ?\n <>\n {text && <span className=\"k-button-text\">{text}</span>}\n {children}\n </>\n : children && <span className=\"k-button-text\">{children}</span>\n }\n\n {showArrow && <span className=\"k-menu-button-arrow k-button-arrow\"><Icon name={arrowIconName} /></span>}\n </button>\n );\n }\n}\n", "/* eslint-disable no-return-assign */\nexport const classNames = (...args): string => {\n const result = {};\n\n const addLeafKeys = (arg) => {\n (typeof arg === 'object'\n ? Object.keys(arg).forEach((key) => {\n result[key] = arg[key];\n })\n : (result[arg] = true)\n );\n };\n\n const addKeys = (list) =>\n list\n .filter((arg) => arg !== true && Boolean(arg))\n .map((arg: any) =>\n (Array.isArray(arg) ? addKeys(arg) : addLeafKeys(arg))\n );\n\n addKeys(args);\n\n return Object.keys(result)\n .map((key) => (result[key] && key) || null)\n .filter((el) => el !== null)\n .join(' ');\n};\n", "export interface KendoThemeMaps {\n sizeMap: Record<Exclude<any, null>, string>;\n roundedMap: Record<Exclude<any, null>, string>;\n calloutMap: Record<Exclude<any, null>, string>;\n orientationMap: Record<Exclude<any, null>, string>;\n}\n\nexport const kendoThemeMaps: KendoThemeMaps = {\n sizeMap: {\n small: 'sm',\n medium: 'md',\n large: 'lg'\n },\n roundedMap: {\n small: 'sm',\n medium: 'md',\n large: 'lg'\n },\n calloutMap: {\n top: 'n',\n bottom: 's',\n left: 'w',\n right: 'e'\n },\n orientationMap: {\n vertical: 'vstack',\n horizontal: 'hstack',\n },\n};\n", "import * as React from 'react';\nimport { classNames } from '../utils';\n\nexport interface IconProps {\n className?: string;\n style?: React.CSSProperties;\n name?: string;\n}\n\nexport class Icon extends React.Component<IconProps> {\n\n render() {\n const {\n className,\n style,\n name\n } = this.props;\n\n return (\n <>\n { name &&\n <span\n className={classNames(\n className,\n 'k-icon',\n {\n [`k-i-${name}`]: name\n }\n )}\n style={style}>\n </span>\n }\n </>\n );\n }\n}\n", "import * as React from 'react';\nimport { classNames, kendoThemeMaps } from '../utils';\nimport { Button } from '../button';\n\nexport interface TimeSelectorProps {\n className?: string;\n value?: string;\n size?: null | 'small' | 'medium' | 'large';\n disabled?: boolean;\n}\n\nexport class TimeSelector extends React.Component<TimeSelectorProps> {\n\n static defaultProps = {\n size: 'medium'\n };\n\n render() {\n\n const {\n className,\n size\n } = this.props;\n\n return (\n <div\n className={classNames(\n className,\n 'k-timeselector',\n {\n [`k-timeselector-${kendoThemeMaps.sizeMap[size!] || size}`]: size,\n }\n\n )}>\n <div className=\"k-time-part\">\n <div className=\"k-time-header\">\n <span className=\"k-title\">10:00:00 AM</span>\n <Button fillMode=\"flat\" className=\"k-time-now\">Now</Button>\n </div>\n <div className=\"k-time-list-container\">\n <span className=\"k-time-highlight\"></span>\n <div className=\"k-time-list-wrapper\">\n <span className=\"k-title\">Hour</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>0</span>\n </li>\n <li className=\"k-item\">\n <span>1</span>\n </li>\n <li className=\"k-item\">\n <span>2</span>\n </li>\n <li className=\"k-item\">\n <span>3</span>\n </li>\n <li className=\"k-item\">\n <span>4</span>\n </li>\n <li className=\"k-item\">\n <span>5</span>\n </li>\n <li className=\"k-item\">\n <span>6</span>\n </li>\n <li className=\"k-item\">\n <span>7</span>\n </li>\n <li className=\"k-item\">\n <span>8</span>\n </li>\n <li className=\"k-item\">\n <span>9</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n <div className=\"k-time-separator\">:</div>\n <div className=\"k-time-list-wrapper k-state-focused\">\n <span className=\"k-title\">Minute</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>0</span>\n </li>\n <li className=\"k-item\">\n <span>1</span>\n </li>\n <li className=\"k-item\">\n <span>2</span>\n </li>\n <li className=\"k-item\">\n <span>3</span>\n </li>\n <li className=\"k-item\">\n <span>4</span>\n </li>\n <li className=\"k-item\">\n <span>5</span>\n </li>\n <li className=\"k-item\">\n <span>6</span>\n </li>\n <li className=\"k-item\">\n <span>7</span>\n </li>\n <li className=\"k-item\">\n <span>8</span>\n </li>\n <li className=\"k-item\">\n <span>9</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n <div className=\"k-time-separator\">:</div>\n <div className=\"k-time-list-wrapper\">\n <span className=\"k-title\">Second</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>0</span>\n </li>\n <li className=\"k-item\">\n <span>1</span>\n </li>\n <li className=\"k-item\">\n <span>2</span>\n </li>\n <li className=\"k-item\">\n <span>3</span>\n </li>\n <li className=\"k-item\">\n <span>4</span>\n </li>\n <li className=\"k-item\">\n <span>5</span>\n </li>\n <li className=\"k-item\">\n <span>6</span>\n </li>\n <li className=\"k-item\">\n <span>7</span>\n </li>\n <li className=\"k-item\">\n <span>8</span>\n </li>\n <li className=\"k-item\">\n <span>9</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n <div className=\"k-time-separator\">:</div>\n <div className=\"k-time-list-wrapper\">\n <span className=\"k-title\">AM/PM</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>AM</span>\n </li>\n <li className=\"k-item\">\n <span>PM</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n"],
4
+ "sourcesContent": ["import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport { Button } from '../../button';\nimport { TimeSelector } from '../../time-selector';\n\nconst root = ReactDOM.createRoot(\n document.getElementById('app') as HTMLElement\n);\n\nconst styles = `\n .k-actionsheet-container {\n width: 100%;\n height: 600px;\n position: relative;\n transform: translateZ(0);\n }\n`;\n\nroot.render(\n <>\n <style>{styles}</style>\n <div id=\"test-area\" className=\"k-d-grid k-grid-cols-2\">\n\n <span>partial</span>\n <span>full screen</span>\n\n <section>\n <div className=\"k-actionsheet-container\">\n <div className=\"k-overlay\"></div>\n\n <div className=\"k-actionsheet k-actionsheet-bottom k-adaptive-actionsheet\">\n <div className=\"k-actionsheet-titlebar\">\n <div className=\"k-actionsheet-title k-text-center\">\n <div>Select dates</div>\n <div className=\"k-text-muted\">DD / MM / YY</div>\n </div>\n <div className=\"k-actionsheet-actions\">\n <Button icon=\"x\" fillMode=\"flat\"></Button>\n </div>\n </div>\n <div className=\"k-actionsheet-content\">\n <TimeSelector size=\"large\"></TimeSelector>\n </div>\n <div className=\"k-actionsheet-footer k-actions k-actions-stretched\">\n <Button size=\"large\" themeColor=\"primary\">Select date</Button>\n </div>\n </div>\n </div>\n </section>\n <section>\n <div className=\"k-actionsheet-container\">\n <div className=\"k-overlay\"></div>\n\n <div className=\"k-actionsheet k-actionsheet-bottom k-actionsheet-fullscreen k-adaptive-actionsheet\">\n <div className=\"k-actionsheet-titlebar\">\n <div className=\"k-actionsheet-title k-text-center\">\n <div>Select dates</div>\n <div className=\"k-text-muted\">DD / MM / YY</div>\n </div>\n <div className=\"k-actionsheet-actions\">\n <Button icon=\"x\" fillMode=\"flat\"></Button>\n </div>\n </div>\n <div className=\"k-actionsheet-content\">\n <TimeSelector size=\"large\"></TimeSelector>\n </div>\n <div className=\"k-actionsheet-footer k-actions k-actions-stretched\">\n <Button size=\"large\" themeColor=\"primary\">Select date</Button>\n </div>\n </div>\n </div>\n </section>\n </div>\n\n </>\n);\n", "import * as React from 'react';\nimport { classNames, kendoThemeMaps } from '../utils';\nimport { Icon } from '../icon/';\n\nexport interface ButtonProps {\n children?: React.ReactNode;\n className?: string;\n dir?: string;\n style?: React.CSSProperties;\n iconClassName?: string;\n text?: string;\n icon?: string;\n size?: null | 'small' | 'medium' | 'large';\n rounded: null | 'small' | 'medium' | 'large' | 'full';\n fillMode?: null | 'solid' | 'outline' | 'flat' | 'link' | 'clear';\n themeColor?: null | 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';\n hover?: boolean;\n focus?: boolean;\n active?: boolean;\n selected?: boolean;\n disabled?: boolean;\n showArrow?: boolean;\n arrowIconName?: string;\n}\n\nexport class Button extends React.Component<ButtonProps> {\n\n static defaultProps = {\n size: 'medium',\n rounded: 'medium',\n fillMode: 'solid',\n themeColor: 'base',\n showArrow: false,\n arrowIconName: 'arrow-s'\n };\n\n render() {\n const {\n children,\n className,\n iconClassName,\n text,\n icon,\n size,\n rounded,\n fillMode,\n themeColor,\n hover,\n focus,\n active,\n selected,\n disabled,\n showArrow,\n arrowIconName,\n ...htmlAttributes\n } = this.props;\n\n const hasIcon = (icon !== undefined);\n const hasChildren = children !== undefined;\n\n return (\n <button\n style={this.props.style}\n {...htmlAttributes}\n dir={this.props.dir}\n className={classNames(\n className,\n 'k-button',\n {\n [`k-button-${kendoThemeMaps.sizeMap[size!] || size}`]: size,\n [`k-button-${fillMode}`]: fillMode,\n [`k-button-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),\n [`k-rounded-${kendoThemeMaps.roundedMap[rounded!] || rounded}`]: rounded,\n 'k-icon-button': !hasChildren && hasIcon,\n 'k-hover': hover,\n 'k-focus': focus,\n 'k-active': active,\n 'k-selected': selected,\n 'k-disabled': disabled\n }\n )}>\n {icon && <Icon className={classNames(iconClassName, 'k-button-icon')} name={icon} />}\n\n {text\n ?\n <>\n {text && <span className=\"k-button-text\">{text}</span>}\n {children}\n </>\n : children && <span className=\"k-button-text\">{children}</span>\n }\n\n {showArrow && <span className=\"k-menu-button-arrow k-button-arrow\"><Icon name={arrowIconName} /></span>}\n </button>\n );\n }\n}\n", "/* eslint-disable no-return-assign */\nexport const classNames = (...args): string => {\n const result = {};\n\n const addLeafKeys = (arg) => {\n (typeof arg === 'object'\n ? Object.keys(arg).forEach((key) => {\n result[key] = arg[key];\n })\n : (result[arg] = true)\n );\n };\n\n const addKeys = (list) =>\n list\n .filter((arg) => arg !== true && Boolean(arg))\n .map((arg: any) =>\n (Array.isArray(arg) ? addKeys(arg) : addLeafKeys(arg))\n );\n\n addKeys(args);\n\n return Object.keys(result)\n .map((key) => (result[key] && key) || null)\n .filter((el) => el !== null)\n .join(' ');\n};\n", "export interface KendoThemeMaps {\n sizeMap: Record<Exclude<any, null>, string>;\n roundedMap: Record<Exclude<any, null>, string>;\n calloutMap: Record<Exclude<any, null>, string>;\n orientationMap: Record<Exclude<any, null>, string>;\n}\n\nexport const kendoThemeMaps: KendoThemeMaps = {\n sizeMap: {\n small: 'sm',\n medium: 'md',\n large: 'lg'\n },\n roundedMap: {\n small: 'sm',\n medium: 'md',\n large: 'lg'\n },\n calloutMap: {\n top: 'n',\n bottom: 's',\n left: 'w',\n right: 'e'\n },\n orientationMap: {\n vertical: 'vstack',\n horizontal: 'hstack',\n },\n};\n", "import * as React from 'react';\nimport { classNames } from '../utils';\n\nexport interface IconProps {\n className?: string;\n style?: React.CSSProperties;\n name?: string;\n}\n\nexport class Icon extends React.Component<IconProps> {\n\n render() {\n const {\n className,\n style,\n name\n } = this.props;\n\n return (\n <>\n { name &&\n <span\n className={classNames(\n className,\n 'k-icon',\n {\n [`k-i-${name}`]: name\n }\n )}\n style={style}>\n </span>\n }\n </>\n );\n }\n}\n", "import * as React from 'react';\nimport { classNames, kendoThemeMaps } from '../utils';\nimport { Button } from '../button';\n\nexport interface TimeSelectorProps {\n className?: string;\n value?: string;\n size?: null | 'small' | 'medium' | 'large';\n disabled?: boolean;\n}\n\nexport class TimeSelector extends React.Component<TimeSelectorProps> {\n\n static defaultProps = {\n size: 'medium'\n };\n\n render() {\n\n const {\n className,\n size\n } = this.props;\n\n return (\n <div\n className={classNames(\n className,\n 'k-timeselector',\n {\n [`k-timeselector-${kendoThemeMaps.sizeMap[size!] || size}`]: size,\n }\n\n )}>\n <div className=\"k-time-part\">\n <div className=\"k-time-header\">\n <span className=\"k-title\">10:00:00 AM</span>\n <Button fillMode=\"flat\" className=\"k-time-now\">Now</Button>\n </div>\n <div className=\"k-time-list-container\">\n <span className=\"k-time-highlight\"></span>\n <div className=\"k-time-list-wrapper\">\n <span className=\"k-title\">Hour</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>0</span>\n </li>\n <li className=\"k-item\">\n <span>1</span>\n </li>\n <li className=\"k-item\">\n <span>2</span>\n </li>\n <li className=\"k-item\">\n <span>3</span>\n </li>\n <li className=\"k-item\">\n <span>4</span>\n </li>\n <li className=\"k-item\">\n <span>5</span>\n </li>\n <li className=\"k-item\">\n <span>6</span>\n </li>\n <li className=\"k-item\">\n <span>7</span>\n </li>\n <li className=\"k-item\">\n <span>8</span>\n </li>\n <li className=\"k-item\">\n <span>9</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n <div className=\"k-time-separator\">:</div>\n <div className=\"k-time-list-wrapper k-focus\">\n <span className=\"k-title\">Minute</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>0</span>\n </li>\n <li className=\"k-item\">\n <span>1</span>\n </li>\n <li className=\"k-item\">\n <span>2</span>\n </li>\n <li className=\"k-item\">\n <span>3</span>\n </li>\n <li className=\"k-item\">\n <span>4</span>\n </li>\n <li className=\"k-item\">\n <span>5</span>\n </li>\n <li className=\"k-item\">\n <span>6</span>\n </li>\n <li className=\"k-item\">\n <span>7</span>\n </li>\n <li className=\"k-item\">\n <span>8</span>\n </li>\n <li className=\"k-item\">\n <span>9</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n <div className=\"k-time-separator\">:</div>\n <div className=\"k-time-list-wrapper\">\n <span className=\"k-title\">Second</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>0</span>\n </li>\n <li className=\"k-item\">\n <span>1</span>\n </li>\n <li className=\"k-item\">\n <span>2</span>\n </li>\n <li className=\"k-item\">\n <span>3</span>\n </li>\n <li className=\"k-item\">\n <span>4</span>\n </li>\n <li className=\"k-item\">\n <span>5</span>\n </li>\n <li className=\"k-item\">\n <span>6</span>\n </li>\n <li className=\"k-item\">\n <span>7</span>\n </li>\n <li className=\"k-item\">\n <span>8</span>\n </li>\n <li className=\"k-item\">\n <span>9</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n <div className=\"k-time-separator\">:</div>\n <div className=\"k-time-list-wrapper\">\n <span className=\"k-title\">AM/PM</span>\n <div className=\"k-time-list\">\n <div className=\"k-content k-scrollable k-time-container\">\n <ul className=\"k-reset\" style={{ transform: \"translateY(97px)\" }}>\n <li className=\"k-item\">\n <span>AM</span>\n </li>\n <li className=\"k-item\">\n <span>PM</span>\n </li>\n </ul>\n <div className=\"k-scrollable-placeholder\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n"],
5
5
  "mappings": "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",
6
6
  "names": ["React", "React", "ReactDOM", "React"]
7
7
  }
@@ -160,35 +160,6 @@
160
160
  arrowIconName: "arrow-s"
161
161
  };
162
162
 
163
- // src/action-buttons/action-buttons.tsx
164
- var React3 = __toESM(__require("react"));
165
- var ActionButtons = class extends React3.Component {
166
- render() {
167
- const {
168
- children,
169
- className,
170
- alignment,
171
- orientation,
172
- ...htmlAttributes
173
- } = this.props;
174
- return /* @__PURE__ */ React3.createElement("div", {
175
- ...htmlAttributes,
176
- className: classNames(
177
- "k-actions",
178
- {
179
- [`k-actions-${alignment}`]: alignment,
180
- [`k-actions-${orientation}`]: orientation
181
- },
182
- className
183
- )
184
- }, children);
185
- }
186
- };
187
- ActionButtons.defaultProps = {
188
- alignment: "start",
189
- orientation: "horizontal"
190
- };
191
-
192
163
  // src/upload/tests/upload-react.tsx
193
164
  var root = import_client.default.createRoot(
194
165
  document.getElementById("app")
@@ -198,183 +169,87 @@
198
169
  max-width: 400px;
199
170
  }
200
171
  `;
201
- var progressStyle = {
202
- width: "100%",
203
- transition: "opacity 0.5s ease-in-out 0s"
204
- };
205
- var progress70Style = {
206
- width: "70%",
207
- transition: "opacity 0.5s ease-in-out 0s"
208
- };
209
- var progress17Style = {
210
- width: "17%",
211
- transition: "opacity 0.5s ease-in-out 0s"
212
- };
213
- var progress0Style = {
214
- width: "0%",
215
- transition: "opacity 0.5s ease-in-out 0s"
216
- };
217
172
  root.render(
218
173
  /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("style", null, style), /* @__PURE__ */ import_react.default.createElement("div", {
219
174
  id: "test-area",
220
175
  className: "k-d-grid k-grid-cols-2"
221
176
  }, /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
222
- className: "k-widget k-upload k-header"
177
+ className: "k-widget k-upload"
223
178
  }, /* @__PURE__ */ import_react.default.createElement("div", {
224
179
  className: "k-dropzone"
225
180
  }, /* @__PURE__ */ import_react.default.createElement(Button, {
226
181
  className: "k-upload-button"
227
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
182
+ }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("em", {
183
+ className: "k-dropzone-hint k-hidden"
184
+ }, "Drop files here to upload"), /* @__PURE__ */ import_react.default.createElement("strong", {
228
185
  className: "k-upload-status k-upload-status-total"
229
186
  }, /* @__PURE__ */ import_react.default.createElement(Icon, {
230
- name: "loading"
187
+ name: "upload"
231
188
  }), "Uploading...")), /* @__PURE__ */ import_react.default.createElement("ul", {
232
189
  className: "k-upload-files k-reset"
233
190
  }, /* @__PURE__ */ import_react.default.createElement("li", {
234
191
  className: "k-file k-file-invalid"
235
192
  }, /* @__PURE__ */ import_react.default.createElement("div", {
236
193
  className: "k-file-single"
194
+ }, /* @__PURE__ */ import_react.default.createElement("div", {
195
+ className: "k-progressbar k-hidden"
237
196
  }, /* @__PURE__ */ import_react.default.createElement("span", {
238
197
  className: "k-progress",
239
- style: progress0Style
198
+ style: { width: "60%" }
199
+ })), /* @__PURE__ */ import_react.default.createElement("span", {
200
+ className: "k-file-invalid-group-wrapper"
201
+ }, /* @__PURE__ */ import_react.default.createElement(Icon, {
202
+ className: "k-file-group",
203
+ name: "file-image"
240
204
  }), /* @__PURE__ */ import_react.default.createElement("span", {
241
- className: "k-file-invalid-extension-wrapper"
242
- }, /* @__PURE__ */ import_react.default.createElement("span", {
243
- className: "k-file-invalid-icon"
244
- }, "!"), /* @__PURE__ */ import_react.default.createElement("span", {
245
205
  className: "k-file-state"
246
206
  })), /* @__PURE__ */ import_react.default.createElement("span", {
247
207
  className: "k-file-name-size-wrapper"
248
208
  }, /* @__PURE__ */ import_react.default.createElement("span", {
249
209
  className: "k-file-name k-file-name-invalid"
250
- }, "Video_File_with_Very_Very_Very_Very_Long_Name.psd"), /* @__PURE__ */ import_react.default.createElement("span", {
251
- className: "k-file-validation-message"
210
+ }, "Video_File_with_Very_Very_Very_Very_Long_Name.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
211
+ className: "k-file-validation-message k-text-error"
252
212
  }, "File type not allowed.")), /* @__PURE__ */ import_react.default.createElement("strong", {
253
213
  className: "k-upload-status"
254
214
  }, /* @__PURE__ */ import_react.default.createElement(Button, {
215
+ icon: "close",
255
216
  fillMode: "flat",
256
- className: "k-upload-action",
257
- icon: "close"
217
+ className: "k-upload-action"
258
218
  })))), /* @__PURE__ */ import_react.default.createElement("li", {
259
219
  className: "k-file k-file-progress"
260
220
  }, /* @__PURE__ */ import_react.default.createElement("div", {
261
- className: "k-file-single"
221
+ className: "k-progressbar"
262
222
  }, /* @__PURE__ */ import_react.default.createElement("span", {
263
223
  className: "k-progress",
264
- style: progress70Style
265
- }), /* @__PURE__ */ import_react.default.createElement("span", {
266
- className: "k-file-extension-wrapper"
267
- }, /* @__PURE__ */ import_react.default.createElement("span", {
268
- className: "k-file-extension"
269
- }, "mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
270
- className: "k-file-state"
224
+ style: { width: "60%" }
271
225
  })), /* @__PURE__ */ import_react.default.createElement("span", {
272
- className: "k-file-name-size-wrapper"
273
- }, /* @__PURE__ */ import_react.default.createElement("span", {
274
- className: "k-file-name"
275
- }, "Document.mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
276
- className: "k-file-size"
277
- }, "156.33 MB")), /* @__PURE__ */ import_react.default.createElement("strong", {
278
- className: "k-upload-status"
279
- }, /* @__PURE__ */ import_react.default.createElement("span", {
280
- className: "k-upload-pct"
281
- }, "70%"), /* @__PURE__ */ import_react.default.createElement(Button, {
282
- fillMode: "flat",
283
- className: "k-upload-action",
284
- icon: "cancel"
285
- }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
286
- className: "k-widget k-upload k-header"
287
- }, /* @__PURE__ */ import_react.default.createElement("div", {
288
- className: "k-dropzone"
289
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
290
- className: "k-upload-button"
291
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
292
- className: "k-upload-status k-upload-status-total"
226
+ className: "k-file-group-wrapper"
293
227
  }, /* @__PURE__ */ import_react.default.createElement(Icon, {
294
- name: "check"
295
- }), "Done")), /* @__PURE__ */ import_react.default.createElement("ul", {
296
- className: "k-upload-files k-reset"
297
- }, /* @__PURE__ */ import_react.default.createElement("li", {
298
- className: "k-file k-file-success"
299
- }, /* @__PURE__ */ import_react.default.createElement("div", {
300
- className: "k-file-single"
301
- }, /* @__PURE__ */ import_react.default.createElement("span", {
302
- className: "k-progress",
303
- style: progressStyle
304
- }), /* @__PURE__ */ import_react.default.createElement("span", {
305
- className: "k-file-extension-wrapper"
306
- }, /* @__PURE__ */ import_react.default.createElement("span", {
307
- className: "k-file-extension"
308
- }, "png"), /* @__PURE__ */ import_react.default.createElement("span", {
309
- className: "k-file-state"
310
- })), /* @__PURE__ */ import_react.default.createElement("span", {
311
- className: "k-file-name-size-wrapper"
312
- }, /* @__PURE__ */ import_react.default.createElement("span", {
313
- className: "k-file-name"
314
- }, "Image1_With_Very_Very_Very_Very_Long_Name.png"), /* @__PURE__ */ import_react.default.createElement("span", {
315
- className: "k-file-size"
316
- }, "24.34 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
317
- className: "k-upload-status"
318
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
319
- fillMode: "flat",
320
- className: "k-upload-action",
321
- icon: "close"
322
- })))), /* @__PURE__ */ import_react.default.createElement("li", {
323
- className: "k-file k-file-success"
324
- }, /* @__PURE__ */ import_react.default.createElement("div", {
325
- className: "k-file-single"
326
- }, /* @__PURE__ */ import_react.default.createElement("span", {
327
- className: "k-progress",
328
- style: progressStyle
228
+ className: "k-file-group",
229
+ name: "file-pdf"
329
230
  }), /* @__PURE__ */ import_react.default.createElement("span", {
330
- className: "k-file-extension-wrapper"
331
- }, /* @__PURE__ */ import_react.default.createElement("span", {
332
- className: "k-file-extension"
333
- }, "png"), /* @__PURE__ */ import_react.default.createElement("span", {
334
231
  className: "k-file-state"
335
- })), /* @__PURE__ */ import_react.default.createElement("span", {
232
+ }, "uploaded")), /* @__PURE__ */ import_react.default.createElement("span", {
336
233
  className: "k-file-name-size-wrapper"
337
234
  }, /* @__PURE__ */ import_react.default.createElement("span", {
338
235
  className: "k-file-name"
339
- }, "Image2.png"), /* @__PURE__ */ import_react.default.createElement("span", {
236
+ }, "Document.txt"), /* @__PURE__ */ import_react.default.createElement("span", {
340
237
  className: "k-file-size"
341
- }, "19.85 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
238
+ }, "225.68 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
342
239
  className: "k-upload-status"
343
240
  }, /* @__PURE__ */ import_react.default.createElement(Button, {
241
+ icon: "close",
344
242
  fillMode: "flat",
345
- className: "k-upload-action",
346
- icon: "close"
347
- }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
348
- className: "k-widget k-upload k-header"
243
+ className: "k-upload-action"
244
+ })))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
245
+ className: "k-widget k-upload"
349
246
  }, /* @__PURE__ */ import_react.default.createElement("div", {
350
247
  className: "k-dropzone"
351
248
  }, /* @__PURE__ */ import_react.default.createElement(Button, {
352
249
  className: "k-upload-button"
353
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
354
- className: "k-dropzone-hint"
355
- }, "Drop files here to upload")))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
356
- className: "k-widget k-upload k-header"
357
- }, /* @__PURE__ */ import_react.default.createElement("div", {
358
- className: "k-dropzone k-dropzone-active k-dropzone-hovered"
359
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
360
- className: "k-upload-button"
361
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
362
- className: "k-dropzone-hint"
363
- }, "Drop files here to upload")))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
364
- className: "k-widget k-upload k-header k-state-disabled"
365
- }, /* @__PURE__ */ import_react.default.createElement("div", {
366
- className: "k-dropzone"
367
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
368
- className: "k-upload-button"
369
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
370
- className: "k-dropzone-hint"
371
- }, "Drop files here to upload")))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
372
- className: "k-widget k-upload k-header"
373
- }, /* @__PURE__ */ import_react.default.createElement("div", {
374
- className: "k-dropzone"
375
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
376
- className: "k-upload-button"
377
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
250
+ }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("em", {
251
+ className: "k-dropzone-hint k-hidden"
252
+ }, "Drop files here to upload"), /* @__PURE__ */ import_react.default.createElement("strong", {
378
253
  className: "k-upload-status k-upload-status-total"
379
254
  }, /* @__PURE__ */ import_react.default.createElement(Icon, {
380
255
  name: "check"
@@ -384,181 +259,56 @@
384
259
  className: "k-file k-file-success"
385
260
  }, /* @__PURE__ */ import_react.default.createElement("div", {
386
261
  className: "k-file-multiple"
262
+ }, /* @__PURE__ */ import_react.default.createElement("div", {
263
+ className: "k-progressbar",
264
+ hidden: true
387
265
  }, /* @__PURE__ */ import_react.default.createElement("span", {
388
266
  className: "k-progress",
389
- style: progressStyle
390
- }), /* @__PURE__ */ import_react.default.createElement("span", {
391
- className: "k-multiple-files-extension-wrapper"
392
- }, /* @__PURE__ */ import_react.default.createElement("span", {
393
- className: "k-file-state"
267
+ style: { width: "0%" }
394
268
  })), /* @__PURE__ */ import_react.default.createElement("span", {
395
- className: "k-file-name-size-wrapper"
396
- }, /* @__PURE__ */ import_react.default.createElement("span", {
397
- className: "k-file-name"
398
- }, "Video_File_with_Very_Very_Very_Very_Long_Name.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
399
- className: "k-file-name"
400
- }, "Video_File_with_Very_Very_Very_Very_Long_Name2.png"), /* @__PURE__ */ import_react.default.createElement("span", {
401
- className: "k-file-name"
402
- }, "Video3.png"), /* @__PURE__ */ import_react.default.createElement("span", {
403
- className: "k-file-name"
404
- }, "Video4.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
405
- className: "k-file-information"
406
- }, "Total: 4 files, 152.21 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
407
- className: "k-upload-status"
408
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
409
- fillMode: "flat",
410
- className: "k-upload-action",
411
- icon: "close"
412
- }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
413
- className: "k-widget k-upload k-header"
414
- }, /* @__PURE__ */ import_react.default.createElement("div", {
415
- className: "k-dropzone"
416
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
417
- className: "k-upload-button"
418
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
419
- className: "k-upload-status k-upload-status-total"
269
+ className: "k-multiple-files-group-wrapper"
420
270
  }, /* @__PURE__ */ import_react.default.createElement(Icon, {
421
- name: "loading"
422
- }), "Uploading...")), /* @__PURE__ */ import_react.default.createElement("ul", {
423
- className: "k-upload-files k-reset"
424
- }, /* @__PURE__ */ import_react.default.createElement("li", {
425
- className: "k-file k-file-progress"
426
- }, /* @__PURE__ */ import_react.default.createElement("div", {
427
- className: "k-file-multiple"
428
- }, /* @__PURE__ */ import_react.default.createElement("span", {
429
- className: "k-progress",
430
- style: progress17Style
271
+ className: "k-file-group",
272
+ name: "files"
431
273
  }), /* @__PURE__ */ import_react.default.createElement("span", {
432
- className: "k-multiple-files-extension-wrapper"
433
- }, /* @__PURE__ */ import_react.default.createElement("span", {
434
274
  className: "k-file-state"
435
- })), /* @__PURE__ */ import_react.default.createElement("span", {
436
- className: "k-file-name-size-wrapper"
437
- }, /* @__PURE__ */ import_react.default.createElement("span", {
438
- className: "k-file-name"
439
- }, "Image_With_Very_Very_Very_Very_Very_Long_Name1.pdf"), /* @__PURE__ */ import_react.default.createElement("span", {
440
- className: "k-file-name"
441
- }, "Image_With_Very_Very_Very_Very_Very_Long_Name2.pdf"), /* @__PURE__ */ import_react.default.createElement("span", {
442
- className: "k-file-name"
443
- }, "Image3.pdf"), /* @__PURE__ */ import_react.default.createElement("span", {
444
- className: "k-file-name"
445
- }, "Image4.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
446
- className: "k-file-information"
447
- }, "Total: 4 files, 1.35 MB")), /* @__PURE__ */ import_react.default.createElement("strong", {
448
- className: "k-upload-status"
449
- }, /* @__PURE__ */ import_react.default.createElement("span", {
450
- className: "k-upload-pct"
451
- }, "17%"), /* @__PURE__ */ import_react.default.createElement(Button, {
452
- fillMode: "flat",
453
- className: "k-upload-action",
454
- icon: "cancel"
455
- }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
456
- className: "k-widget k-upload k-header"
457
- }, /* @__PURE__ */ import_react.default.createElement("div", {
458
- className: "k-dropzone"
459
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
460
- className: "k-upload-button"
461
- }, "Select files...")), /* @__PURE__ */ import_react.default.createElement("ul", {
462
- className: "k-upload-files k-reset"
463
- }, /* @__PURE__ */ import_react.default.createElement("li", {
464
- className: "k-file k-file-invalid"
465
- }, /* @__PURE__ */ import_react.default.createElement("div", {
466
- className: "k-file-multiple"
467
- }, /* @__PURE__ */ import_react.default.createElement("span", {
468
- className: "k-progress",
469
- style: progress0Style
470
- }), /* @__PURE__ */ import_react.default.createElement("span", {
471
- className: "k-multiple-files-invalid-extension-wrapper"
275
+ }, "uploaded")), /* @__PURE__ */ import_react.default.createElement("span", {
276
+ className: "k-multiple-files-wrapper"
472
277
  }, /* @__PURE__ */ import_react.default.createElement("span", {
473
- className: "k-file-invalid-icon"
474
- }, "!"), /* @__PURE__ */ import_react.default.createElement("span", {
475
- className: "k-file-state"
476
- })), /* @__PURE__ */ import_react.default.createElement("span", {
477
278
  className: "k-file-name-size-wrapper"
478
279
  }, /* @__PURE__ */ import_react.default.createElement("span", {
479
280
  className: "k-file-name"
480
- }, "Movie_With_Very_Very_Very_Very_Very_Long_Name1.png"), /* @__PURE__ */ import_react.default.createElement("span", {
281
+ }, "Video_File_with_Very_Very_Very_Very_Long_Name.png"), /* @__PURE__ */ import_react.default.createElement("span", {
282
+ className: "k-file-size"
283
+ }, "19.61 KB")), /* @__PURE__ */ import_react.default.createElement("span", {
284
+ className: "k-file-name-size-wrapper"
285
+ }, " ", /* @__PURE__ */ import_react.default.createElement("span", {
481
286
  className: "k-file-name"
482
- }, "Movie2.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
483
- className: "k-file-name k-file-name-invalid"
484
- }, "Image1.mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
485
- className: "k-file-name k-file-name-invalid"
486
- }, "Image2.mkv"), /* @__PURE__ */ import_react.default.createElement("span", {
487
- className: "k-file-validation-message"
488
- }, "Invalid file(s). Please check file upload requirements.")), /* @__PURE__ */ import_react.default.createElement("strong", {
489
- className: "k-upload-status"
490
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
491
- fillMode: "flat",
492
- className: "k-upload-action",
493
- icon: "close"
494
- }))))))), /* @__PURE__ */ import_react.default.createElement("section", null, /* @__PURE__ */ import_react.default.createElement("div", {
495
- className: "k-widget k-upload k-header"
496
- }, /* @__PURE__ */ import_react.default.createElement("div", {
497
- className: "k-dropzone"
498
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
499
- className: "k-upload-button"
500
- }, "Select files..."), /* @__PURE__ */ import_react.default.createElement("div", {
501
- className: "k-dropzone-hint"
502
- }, "Drop files here to upload")), /* @__PURE__ */ import_react.default.createElement("ul", {
503
- className: "k-upload-files k-reset"
504
- }, /* @__PURE__ */ import_react.default.createElement("li", {
505
- className: "k-file"
506
- }, /* @__PURE__ */ import_react.default.createElement("div", {
507
- className: "k-file-single"
508
- }, /* @__PURE__ */ import_react.default.createElement("span", {
509
- className: "k-progress",
510
- style: progress0Style
511
- }), /* @__PURE__ */ import_react.default.createElement("span", {
512
- className: "k-file-extension-wrapper"
513
- }, /* @__PURE__ */ import_react.default.createElement("span", {
514
- className: "k-file-extension"
515
- }, "png"), /* @__PURE__ */ import_react.default.createElement("span", {
516
- className: "k-file-state"
517
- })), /* @__PURE__ */ import_react.default.createElement("span", {
287
+ }, "Video_File_with_Very_Very_Very_VeryLong_Name2.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
288
+ className: "k-file-size"
289
+ }, "106.43 KB"), " "), /* @__PURE__ */ import_react.default.createElement("span", {
518
290
  className: "k-file-name-size-wrapper"
519
- }, /* @__PURE__ */ import_react.default.createElement("span", {
291
+ }, " ", /* @__PURE__ */ import_react.default.createElement("span", {
520
292
  className: "k-file-name"
521
- }, "Image_With_Very_Very_Very_Very_Very_Long_Name1.png"), /* @__PURE__ */ import_react.default.createElement("span", {
293
+ }, "Video3.png"), /* @__PURE__ */ import_react.default.createElement("span", {
522
294
  className: "k-file-size"
523
- }, "51.23 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
524
- className: "k-upload-status"
525
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
526
- fillMode: "flat",
527
- className: "k-upload-action",
528
- icon: "close"
529
- })))), /* @__PURE__ */ import_react.default.createElement("li", {
530
- className: "k-file"
531
- }, /* @__PURE__ */ import_react.default.createElement("div", {
532
- className: "k-file-single"
533
- }, /* @__PURE__ */ import_react.default.createElement("span", {
534
- className: "k-progress",
535
- style: progress0Style
536
- }), /* @__PURE__ */ import_react.default.createElement("span", {
537
- className: "k-file-extension-wrapper"
538
- }, /* @__PURE__ */ import_react.default.createElement("span", {
539
- className: "k-file-extension"
540
- }, "jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
541
- className: "k-file-state"
542
- })), /* @__PURE__ */ import_react.default.createElement("span", {
295
+ }, "24.34 KB"), " "), /* @__PURE__ */ import_react.default.createElement("span", {
543
296
  className: "k-file-name-size-wrapper"
544
- }, /* @__PURE__ */ import_react.default.createElement("span", {
297
+ }, " ", /* @__PURE__ */ import_react.default.createElement("span", {
545
298
  className: "k-file-name"
546
- }, "Image_With_Very_Very_Very_Very_Very_Long_Name2.jpg"), /* @__PURE__ */ import_react.default.createElement("span", {
299
+ }, "Video4.png"), /* @__PURE__ */ import_react.default.createElement("span", {
547
300
  className: "k-file-size"
548
- }, "106.43 KB")), /* @__PURE__ */ import_react.default.createElement("strong", {
301
+ }, "19.85 KB"), " "), /* @__PURE__ */ import_react.default.createElement("span", {
302
+ className: "k-file-information k-hidden"
303
+ }, "Total: 4 files, 170.22 KB"), /* @__PURE__ */ import_react.default.createElement("span", {
304
+ className: "k-file-validation-message k-text-success"
305
+ }, "4 File(s) uploaded successfully.")), /* @__PURE__ */ import_react.default.createElement("strong", {
549
306
  className: "k-upload-status"
550
307
  }, /* @__PURE__ */ import_react.default.createElement(Button, {
308
+ icon: "close",
551
309
  fillMode: "flat",
552
- className: "k-upload-action",
553
- icon: "close"
554
- }))))), /* @__PURE__ */ import_react.default.createElement(ActionButtons, {
555
- alignment: "end"
556
- }, /* @__PURE__ */ import_react.default.createElement(Button, {
557
- className: "k-clear-selected"
558
- }, "Clear"), /* @__PURE__ */ import_react.default.createElement(Button, {
559
- themeColor: "primary",
560
- className: "k-upload-selected"
561
- }, "Upload"))))))
310
+ className: "k-upload-action"
311
+ })))))))))
562
312
  );
563
313
  })();
564
314
  //# sourceMappingURL=upload-react.js.map