@progress/kendo-react-layout 5.17.0-dev.202308231133 → 5.17.0-dev.202308231321

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 (13) hide show
  1. package/dist/cdn/js/kendo-react-layout.js +1 -1
  2. package/dist/es/breadcrumb/Breadcrumb.d.ts +11 -0
  3. package/dist/es/breadcrumb/Breadcrumb.js +24 -9
  4. package/dist/es/breadcrumb/BreadcrumbOrderedList.d.ts +4 -0
  5. package/dist/es/breadcrumb/BreadcrumbOrderedList.js +6 -2
  6. package/dist/es/package-metadata.js +1 -1
  7. package/dist/npm/breadcrumb/Breadcrumb.d.ts +11 -0
  8. package/dist/npm/breadcrumb/Breadcrumb.js +23 -8
  9. package/dist/npm/breadcrumb/BreadcrumbOrderedList.d.ts +4 -0
  10. package/dist/npm/breadcrumb/BreadcrumbOrderedList.js +6 -2
  11. package/dist/npm/package-metadata.js +1 -1
  12. package/dist/systemjs/kendo-react-layout.js +1 -1
  13. package/package.json +13 -13
package/dist/es/breadcrumb/Breadcrumb.d.ts CHANGED
@@ -40,6 +40,17 @@ export interface BreadcrumbProps {
40
40
  * Represents the data of the Breadcrumb from type DataModel.
41
41
  */
42
42
  data: DataModel[];
43
+ /**
44
+ * Specifies the padding of all Breadcrumb elements.
45
+ *
46
+ * The possible values are:
47
+ * * `small`
48
+ * * `medium`
49
+ * * `large`
50
+ *
51
+ * @default `medium`
52
+ */
53
+ size?: 'small' | 'medium' | 'large';
43
54
  /**
44
55
  * The Breadcrumb direction `ltr` or `rtl`.
45
56
  */
package/dist/es/breadcrumb/Breadcrumb.js CHANGED
@@ -13,7 +13,7 @@ import * as React from 'react';
13
13
  import * as PropTypes from 'prop-types';
14
14
  import { validatePackage } from '@progress/kendo-licensing';
15
15
  import { packageMetadata } from '../package-metadata';
16
- import { classNames, useDir, dispatchEvent } from '@progress/kendo-react-common';
16
+ import { classNames, useDir, dispatchEvent, kendoThemeMaps } from '@progress/kendo-react-common';
17
17
  import { BreadcrumbListItem } from './BreadcrumbListItem';
18
18
  import { BreadcrumbDelimiter } from './BreadcrumbDelimiter';
19
19
  import { BreadcrumbLink } from './BreadcrumbLink';
@@ -22,6 +22,7 @@ import { BreadcrumbOrderedList } from './BreadcrumbOrderedList';
22
22
  * Represents the Breadcrumb component.
23
23
  */
24
24
  export var Breadcrumb = React.forwardRef(function (props, ref) {
25
+ var _a;
25
26
  validatePackage(packageMetadata);
26
27
  var target = React.useRef(null);
27
28
  var breadcrumbRef = React.useRef(null);
@@ -56,16 +57,30 @@ export var Breadcrumb = React.forwardRef(function (props, ref) {
56
57
  var iconField = (props.iconField || defaultProps.iconField);
57
58
  var iconClassField = (props.iconClassField || defaultProps.iconClassField);
58
59
  var textField = (props.textField || defaultProps.textField);
59
- return (React.createElement("nav", { "aria-label": props.ariaLabel, id: props.id, style: props.style, ref: breadcrumbRef, dir: dir, className: classNames('k-breadcrumb', {
60
- 'k-rtl': dir === 'rtl',
61
- 'k-disabled': disabled
62
- }, props.className) },
63
- React.createElement(OrderedListComponent, null,
60
+ var size = props.size || 'medium';
61
+ return (React.createElement("nav", { "aria-label": props.ariaLabel, id: props.id, style: props.style, ref: breadcrumbRef, dir: dir, className: classNames('k-breadcrumb k-breadcrumb-wrap', (_a = {
62
+ 'k-rtl': dir === 'rtl',
63
+ 'k-disabled': disabled,
64
+ 'k-breadcrumb-md': !props.size
65
+ },
66
+ _a["k-breadcrumb-".concat(kendoThemeMaps.sizeMap[size] || size)] = size,
67
+ _a), props.className) },
68
+ React.createElement(OrderedListComponent, { rootItem: true },
64
69
  React.createElement(React.Fragment, null, props.data.map(function (item, index, data) {
65
70
  var key = item[valueField];
66
- return (React.createElement(ListItemComponent, { key: key, isFirstItem: index === 0, isLastItem: data.length - 1 === index },
67
- index !== 0 && React.createElement(DelimiterComponent, { dir: dir }),
68
- React.createElement(LinkComponent, __assign({ isLast: data.length - 1 === index, isFirst: index === 0, id: String(key), icon: item[iconField] || undefined, iconClass: item[iconClassField] ? String(item[iconClassField]) : undefined, text: item[textField] ? String(item[textField]) : undefined, disabled: item.disabled || false, onItemSelect: handleItemSelect, onKeyDown: handleKeyDown }, props))));
71
+ if (index === 0) {
72
+ return (React.createElement(ListItemComponent, { key: key, isFirstItem: true, isLastItem: data.length - 1 === index },
73
+ React.createElement(LinkComponent, __assign({ isLast: data.length - 1 === index, isFirst: true, id: String(key), icon: item[iconField] || undefined, iconClass: item[iconClassField] ? String(item[iconClassField]) : undefined, text: item[textField] ? String(item[textField]) : undefined, disabled: item.disabled || false, onItemSelect: handleItemSelect, onKeyDown: handleKeyDown }, props))));
74
+ }
75
+ }))),
76
+ React.createElement(OrderedListComponent, { rootItem: false },
77
+ React.createElement(React.Fragment, null, props.data.map(function (item, index, data) {
78
+ var key = item[valueField];
79
+ if (index !== 0) {
80
+ return (React.createElement(ListItemComponent, { key: key, isFirstItem: false, isLastItem: data.length - 1 === index },
81
+ React.createElement(DelimiterComponent, { dir: dir }),
82
+ React.createElement(LinkComponent, __assign({ isLast: data.length - 1 === index, isFirst: false, id: String(key), icon: item[iconField] || undefined, iconClass: item[iconClassField] ? String(item[iconClassField]) : undefined, text: item[textField] ? String(item[textField]) : undefined, disabled: item.disabled || false, onItemSelect: handleItemSelect, onKeyDown: handleKeyDown }, props))));
83
+ }
69
84
  })))));
70
85
  });
71
86
  var propTypes = {
package/dist/es/breadcrumb/BreadcrumbOrderedList.d.ts CHANGED
@@ -31,6 +31,10 @@ export interface BreadcrumbOrderedListProps {
31
31
  * Determines the `disabled` mode of the BreadcrumbOrderedList. If `true`, the component is disabled.
32
32
  */
33
33
  disabled?: boolean;
34
+ /**
35
+ * @hidden
36
+ */
37
+ rootItem?: boolean;
34
38
  }
35
39
  /**
36
40
  * Represents the target (element, props, and focus()) of the BreadcrumbOrderedList.
package/dist/es/breadcrumb/BreadcrumbOrderedList.js CHANGED
@@ -15,9 +15,13 @@ export var BreadcrumbOrderedList = React.forwardRef(function (props, ref) {
15
15
  props: props
16
16
  }); });
17
17
  React.useImperativeHandle(ref, function () { return target.current; });
18
- return (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: useDir(orderedListRef, props.dir), tabIndex: getTabIndex(props.tabIndex, props.disabled), className: classNames('k-breadcrumb-container', {
18
+ return (React.createElement(React.Fragment, null, props.rootItem ? (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: useDir(orderedListRef, props.dir), tabIndex: getTabIndex(props.tabIndex, props.disabled), className: classNames('k-breadcrumb-root-item-container', {
19
19
  'k-disabled': props.disabled
20
- }, props.className) }, props.children));
20
+ }, props.className) }, props.children))
21
+ :
22
+ (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: useDir(orderedListRef, props.dir), tabIndex: getTabIndex(props.tabIndex, props.disabled), className: classNames('k-breadcrumb-container !k-flex-wrap', {
23
+ 'k-disabled': props.disabled
24
+ }, props.className) }, props.children))));
21
25
  });
22
26
  var propTypes = {
23
27
  id: PropTypes.string,
package/dist/es/package-metadata.js CHANGED
@@ -5,7 +5,7 @@ export var packageMetadata = {
5
5
  name: '@progress/kendo-react-layout',
6
6
  productName: 'KendoReact',
7
7
  productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
8
- publishDate: 1692787576,
8
+ publishDate: 1692794693,
9
9
  version: '',
10
10
  licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
11
11
  };
package/dist/npm/breadcrumb/Breadcrumb.d.ts CHANGED
@@ -40,6 +40,17 @@ export interface BreadcrumbProps {
40
40
  * Represents the data of the Breadcrumb from type DataModel.
41
41
  */
42
42
  data: DataModel[];
43
+ /**
44
+ * Specifies the padding of all Breadcrumb elements.
45
+ *
46
+ * The possible values are:
47
+ * * `small`
48
+ * * `medium`
49
+ * * `large`
50
+ *
51
+ * @default `medium`
52
+ */
53
+ size?: 'small' | 'medium' | 'large';
43
54
  /**
44
55
  * The Breadcrumb direction `ltr` or `rtl`.
45
56
  */
package/dist/npm/breadcrumb/Breadcrumb.js CHANGED
@@ -25,6 +25,7 @@ var BreadcrumbOrderedList_1 = require("./BreadcrumbOrderedList");
25
25
  * Represents the Breadcrumb component.
26
26
  */
27
27
  exports.Breadcrumb = React.forwardRef(function (props, ref) {
28
+ var _a;
28
29
  (0, kendo_licensing_1.validatePackage)(package_metadata_1.packageMetadata);
29
30
  var target = React.useRef(null);
30
31
  var breadcrumbRef = React.useRef(null);
@@ -59,16 +60,30 @@ exports.Breadcrumb = React.forwardRef(function (props, ref) {
59
60
  var iconField = (props.iconField || defaultProps.iconField);
60
61
  var iconClassField = (props.iconClassField || defaultProps.iconClassField);
61
62
  var textField = (props.textField || defaultProps.textField);
62
- return (React.createElement("nav", { "aria-label": props.ariaLabel, id: props.id, style: props.style, ref: breadcrumbRef, dir: dir, className: (0, kendo_react_common_1.classNames)('k-breadcrumb', {
63
- 'k-rtl': dir === 'rtl',
64
- 'k-disabled': disabled
65
- }, props.className) },
66
- React.createElement(OrderedListComponent, null,
63
+ var size = props.size || 'medium';
64
+ return (React.createElement("nav", { "aria-label": props.ariaLabel, id: props.id, style: props.style, ref: breadcrumbRef, dir: dir, className: (0, kendo_react_common_1.classNames)('k-breadcrumb k-breadcrumb-wrap', (_a = {
65
+ 'k-rtl': dir === 'rtl',
66
+ 'k-disabled': disabled,
67
+ 'k-breadcrumb-md': !props.size
68
+ },
69
+ _a["k-breadcrumb-".concat(kendo_react_common_1.kendoThemeMaps.sizeMap[size] || size)] = size,
70
+ _a), props.className) },
71
+ React.createElement(OrderedListComponent, { rootItem: true },
67
72
  React.createElement(React.Fragment, null, props.data.map(function (item, index, data) {
68
73
  var key = item[valueField];
69
- return (React.createElement(ListItemComponent, { key: key, isFirstItem: index === 0, isLastItem: data.length - 1 === index },
70
- index !== 0 && React.createElement(DelimiterComponent, { dir: dir }),
71
- React.createElement(LinkComponent, __assign({ isLast: data.length - 1 === index, isFirst: index === 0, id: String(key), icon: item[iconField] || undefined, iconClass: item[iconClassField] ? String(item[iconClassField]) : undefined, text: item[textField] ? String(item[textField]) : undefined, disabled: item.disabled || false, onItemSelect: handleItemSelect, onKeyDown: handleKeyDown }, props))));
74
+ if (index === 0) {
75
+ return (React.createElement(ListItemComponent, { key: key, isFirstItem: true, isLastItem: data.length - 1 === index },
76
+ React.createElement(LinkComponent, __assign({ isLast: data.length - 1 === index, isFirst: true, id: String(key), icon: item[iconField] || undefined, iconClass: item[iconClassField] ? String(item[iconClassField]) : undefined, text: item[textField] ? String(item[textField]) : undefined, disabled: item.disabled || false, onItemSelect: handleItemSelect, onKeyDown: handleKeyDown }, props))));
77
+ }
78
+ }))),
79
+ React.createElement(OrderedListComponent, { rootItem: false },
80
+ React.createElement(React.Fragment, null, props.data.map(function (item, index, data) {
81
+ var key = item[valueField];
82
+ if (index !== 0) {
83
+ return (React.createElement(ListItemComponent, { key: key, isFirstItem: false, isLastItem: data.length - 1 === index },
84
+ React.createElement(DelimiterComponent, { dir: dir }),
85
+ React.createElement(LinkComponent, __assign({ isLast: data.length - 1 === index, isFirst: false, id: String(key), icon: item[iconField] || undefined, iconClass: item[iconClassField] ? String(item[iconClassField]) : undefined, text: item[textField] ? String(item[textField]) : undefined, disabled: item.disabled || false, onItemSelect: handleItemSelect, onKeyDown: handleKeyDown }, props))));
86
+ }
72
87
  })))));
73
88
  });
74
89
  var propTypes = {
package/dist/npm/breadcrumb/BreadcrumbOrderedList.d.ts CHANGED
@@ -31,6 +31,10 @@ export interface BreadcrumbOrderedListProps {
31
31
  * Determines the `disabled` mode of the BreadcrumbOrderedList. If `true`, the component is disabled.
32
32
  */
33
33
  disabled?: boolean;
34
+ /**
35
+ * @hidden
36
+ */
37
+ rootItem?: boolean;
34
38
  }
35
39
  /**
36
40
  * Represents the target (element, props, and focus()) of the BreadcrumbOrderedList.
package/dist/npm/breadcrumb/BreadcrumbOrderedList.js CHANGED
@@ -18,9 +18,13 @@ exports.BreadcrumbOrderedList = React.forwardRef(function (props, ref) {
18
18
  props: props
19
19
  }); });
20
20
  React.useImperativeHandle(ref, function () { return target.current; });
21
- return (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: (0, kendo_react_common_1.useDir)(orderedListRef, props.dir), tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, props.disabled), className: (0, kendo_react_common_1.classNames)('k-breadcrumb-container', {
21
+ return (React.createElement(React.Fragment, null, props.rootItem ? (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: (0, kendo_react_common_1.useDir)(orderedListRef, props.dir), tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, props.disabled), className: (0, kendo_react_common_1.classNames)('k-breadcrumb-root-item-container', {
22
22
  'k-disabled': props.disabled
23
- }, props.className) }, props.children));
23
+ }, props.className) }, props.children))
24
+ :
25
+ (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: (0, kendo_react_common_1.useDir)(orderedListRef, props.dir), tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, props.disabled), className: (0, kendo_react_common_1.classNames)('k-breadcrumb-container !k-flex-wrap', {
26
+ 'k-disabled': props.disabled
27
+ }, props.className) }, props.children))));
24
28
  });
25
29
  var propTypes = {
26
30
  id: PropTypes.string,
package/dist/npm/package-metadata.js CHANGED
@@ -8,7 +8,7 @@ exports.packageMetadata = {
8
8
  name: '@progress/kendo-react-layout',
9
9
  productName: 'KendoReact',
10
10
  productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
11
- publishDate: 1692787576,
11
+ publishDate: 1692794693,
12
12
  version: '',
13
13
  licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
14
14
  };