framework7-react 7.1.5 → 8.0.0-beta.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.
- package/components/accordion-content.js +2 -2
- package/components/accordion-item.js +2 -11
- package/components/accordion-toggle.js +2 -2
- package/components/accordion.js +2 -2
- package/components/actions-button.d.ts +1 -1
- package/components/actions-button.js +4 -8
- package/components/actions-group.js +2 -2
- package/components/actions-label.js +4 -6
- package/components/actions.js +4 -14
- package/components/app.js +4 -8
- package/components/area-chart.js +6 -45
- package/components/badge.js +2 -2
- package/components/block-footer.js +2 -2
- package/components/block-header.js +2 -2
- package/components/block-title.js +2 -2
- package/components/block.d.ts +17 -4
- package/components/block.js +37 -11
- package/components/breadcrumbs-collapsed.js +2 -4
- package/components/breadcrumbs-item.js +2 -4
- package/components/breadcrumbs-separator.js +2 -2
- package/components/breadcrumbs.js +2 -2
- package/components/button.d.ts +3 -7
- package/components/button.js +8 -24
- package/components/card-content.js +2 -2
- package/components/card-footer.js +2 -2
- package/components/card-header.js +2 -2
- package/components/card.d.ts +5 -2
- package/components/card.js +14 -23
- package/components/checkbox.js +2 -4
- package/components/chip.d.ts +0 -1
- package/components/chip.js +2 -9
- package/components/fab-backdrop.js +2 -2
- package/components/fab-button.js +2 -6
- package/components/fab-buttons.js +2 -2
- package/components/fab.js +2 -10
- package/components/gauge.js +2 -2
- package/components/icon.d.ts +0 -1
- package/components/icon.js +3 -17
- package/components/input.js +1 -57
- package/components/link.d.ts +0 -1
- package/components/link.js +5 -12
- package/components/list-button.js +2 -4
- package/components/list-group.js +2 -2
- package/components/list-index.d.ts +0 -1
- package/components/list-index.js +3 -13
- package/components/list-input.d.ts +0 -1
- package/components/list-input.js +1 -55
- package/components/list-item-content.js +9 -20
- package/components/list-item.d.ts +1 -1
- package/components/list-item.js +6 -35
- package/components/list.d.ts +21 -9
- package/components/list.js +43 -37
- package/components/login-screen-title.js +2 -2
- package/components/login-screen.js +3 -15
- package/components/message.js +2 -10
- package/components/messagebar-attachment.js +2 -5
- package/components/messagebar-attachments.js +2 -2
- package/components/messagebar-sheet-image.js +4 -5
- package/components/messagebar-sheet-item.js +2 -2
- package/components/messagebar-sheet.js +2 -2
- package/components/messagebar.js +1 -19
- package/components/messages-title.js +2 -2
- package/components/messages.js +2 -15
- package/components/nav-left.js +2 -6
- package/components/nav-right.js +2 -2
- package/components/nav-title-large.js +2 -2
- package/components/nav-title.js +2 -4
- package/components/navbar.d.ts +1 -2
- package/components/navbar.js +5 -31
- package/components/page-content.js +2 -16
- package/components/page.d.ts +0 -1
- package/components/page.js +4 -62
- package/components/panel.d.ts +1 -0
- package/components/panel.js +6 -26
- package/components/photo-browser.js +1 -17
- package/components/pie-chart.js +6 -18
- package/components/popover.d.ts +1 -0
- package/components/popover.js +4 -14
- package/components/popup.js +3 -19
- package/components/preloader.js +5 -14
- package/components/progressbar.js +2 -4
- package/components/radio.js +2 -4
- package/components/range.js +2 -9
- package/components/routable-modals.js +2 -7
- package/components/searchbar.d.ts +1 -2
- package/components/searchbar.js +5 -30
- package/components/segmented.d.ts +0 -3
- package/components/segmented.js +4 -10
- package/components/sheet.js +2 -22
- package/components/stepper.d.ts +0 -5
- package/components/stepper.js +3 -33
- package/components/subnavbar.js +2 -2
- package/components/swipeout-actions.js +2 -4
- package/components/swipeout-button.js +2 -4
- package/components/tab.js +4 -15
- package/components/tabs.js +1 -4
- package/components/text-editor.js +1 -18
- package/components/toggle.js +1 -13
- package/components/toolbar.d.ts +2 -6
- package/components/toolbar.js +9 -20
- package/components/treeview-item.d.ts +0 -1
- package/components/treeview-item.js +2 -11
- package/components/treeview.js +2 -2
- package/components/view.d.ts +0 -6
- package/components/view.js +3 -30
- package/components/views.js +2 -2
- package/framework7-react.d.ts +2 -14
- package/framework7-react.js +3 -14
- package/package.json +1 -1
- package/shared/components-router.js +0 -32
- package/shared/f7.js +5 -19
- package/shared/get-router-initial-component.js +0 -4
- package/shared/mixins.js +2 -8
- package/shared/plugin.js +2 -8
- package/shared/router-open-in.js +4 -15
- package/shared/tabbar-context.js +1 -1
- package/shared/use-icon.js +1 -6
- package/shared/use-isomorphic-layout-effect.js +0 -2
- package/shared/use-route-props.js +0 -1
- package/shared/use-smart-select.js +0 -3
- package/shared/use-store.js +4 -8
- package/shared/use-tab.js +0 -4
- package/shared/use-theme.js +0 -2
- package/shared/use-tooltip.js +0 -5
- package/shared/utils.js +0 -18
- package/shared/watch-prop.js +0 -1
- package/components/appbar.d.ts +0 -28
- package/components/appbar.js +0 -45
- package/components/col.d.ts +0 -36
- package/components/col.js +0 -75
- package/components/list-item-cell.d.ts +0 -23
- package/components/list-item-cell.js +0 -28
- package/components/list-item-row.d.ts +0 -23
- package/components/list-item-row.js +0 -28
- package/components/menu-dropdown-item.d.ts +0 -68
- package/components/menu-dropdown-item.js +0 -59
- package/components/menu-dropdown.d.ts +0 -28
- package/components/menu-dropdown.js +0 -42
- package/components/menu-item.d.ts +0 -81
- package/components/menu-item.js +0 -101
- package/components/menu.d.ts +0 -23
- package/components/menu.js +0 -30
- package/components/row.d.ts +0 -31
- package/components/row.js +0 -64
- package/components/swiper-slide.d.ts +0 -4
- package/components/swiper-slide.js +0 -3
- package/components/swiper.d.ts +0 -4
- package/components/swiper.js +0 -3
package/components/menu-item.js
DELETED
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
|
-
import React, { forwardRef, useRef, useImperativeHandle } from 'react';
|
|
4
|
-
import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect.js';
|
|
5
|
-
import { classNames, getExtraAttrs, getSlots, emit } from '../shared/utils.js';
|
|
6
|
-
import { colorClasses, routerAttrs, routerClasses, actionsClasses, actionsAttrs } from '../shared/mixins.js';
|
|
7
|
-
import { useRouteProps } from '../shared/use-route-props.js';
|
|
8
|
-
import { useIcon } from '../shared/use-icon.js';
|
|
9
|
-
import { f7ready, f7 } from '../shared/f7.js';
|
|
10
|
-
import { useTooltip } from '../shared/use-tooltip.js';
|
|
11
|
-
|
|
12
|
-
const MenuItem = /*#__PURE__*/forwardRef((props, ref) => {
|
|
13
|
-
const {
|
|
14
|
-
className,
|
|
15
|
-
id,
|
|
16
|
-
style,
|
|
17
|
-
link,
|
|
18
|
-
href,
|
|
19
|
-
target,
|
|
20
|
-
text,
|
|
21
|
-
dropdown,
|
|
22
|
-
iconOnly
|
|
23
|
-
} = props;
|
|
24
|
-
const extraAttrs = getExtraAttrs(props);
|
|
25
|
-
const elRef = useRef(null);
|
|
26
|
-
|
|
27
|
-
const onClick = e => {
|
|
28
|
-
emit(props, 'click', e);
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
const onOpened = el => {
|
|
32
|
-
if (elRef.current !== el) return;
|
|
33
|
-
emit(props, 'menuOpened', el);
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
const onClosed = el => {
|
|
37
|
-
if (elRef.current !== el) return;
|
|
38
|
-
emit(props, 'menuClosed', el);
|
|
39
|
-
};
|
|
40
|
-
|
|
41
|
-
useImperativeHandle(ref, () => ({
|
|
42
|
-
el: elRef.current
|
|
43
|
-
}));
|
|
44
|
-
useTooltip(elRef, props);
|
|
45
|
-
useRouteProps(elRef, props);
|
|
46
|
-
|
|
47
|
-
const attachEvents = () => {
|
|
48
|
-
f7ready(() => {
|
|
49
|
-
f7.on('menuOpened', onOpened);
|
|
50
|
-
f7.on('menuClosed', onClosed);
|
|
51
|
-
});
|
|
52
|
-
};
|
|
53
|
-
|
|
54
|
-
const detachEvents = () => {
|
|
55
|
-
f7.off('menuOpened', onOpened);
|
|
56
|
-
f7.off('menuClosed', onOpened);
|
|
57
|
-
};
|
|
58
|
-
|
|
59
|
-
useIsomorphicLayoutEffect(() => {
|
|
60
|
-
attachEvents();
|
|
61
|
-
return detachEvents;
|
|
62
|
-
});
|
|
63
|
-
const iconEl = useIcon(props);
|
|
64
|
-
const slots = getSlots(props);
|
|
65
|
-
let iconOnlyComputed;
|
|
66
|
-
|
|
67
|
-
if (iconOnly || !text && slots.text && slots.text.length === 0 || !text && !slots.text) {
|
|
68
|
-
iconOnlyComputed = true;
|
|
69
|
-
} else {
|
|
70
|
-
iconOnlyComputed = false;
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
const isLink = link || href || href === '';
|
|
74
|
-
const Tag = isLink ? 'a' : 'div';
|
|
75
|
-
const isDropdown = dropdown || dropdown === '';
|
|
76
|
-
const classes = classNames({
|
|
77
|
-
'menu-item': true,
|
|
78
|
-
'menu-item-dropdown': isDropdown,
|
|
79
|
-
'icon-only': iconOnlyComputed
|
|
80
|
-
}, className, colorClasses(props), routerClasses(props), actionsClasses(props));
|
|
81
|
-
let hrefComputed = href;
|
|
82
|
-
if (typeof hrefComputed === 'undefined' && link) hrefComputed = '#';
|
|
83
|
-
const attrs = {
|
|
84
|
-
href: hrefComputed,
|
|
85
|
-
target,
|
|
86
|
-
...routerAttrs(props),
|
|
87
|
-
...actionsAttrs(props)
|
|
88
|
-
};
|
|
89
|
-
return /*#__PURE__*/React.createElement(Tag, _extends({
|
|
90
|
-
ref: elRef,
|
|
91
|
-
className: classes,
|
|
92
|
-
id: id,
|
|
93
|
-
style: style
|
|
94
|
-
}, attrs, extraAttrs, {
|
|
95
|
-
onClick: onClick
|
|
96
|
-
}), (text || slots.text && slots.text.length || iconEl) && /*#__PURE__*/React.createElement("div", {
|
|
97
|
-
className: "menu-item-content"
|
|
98
|
-
}, text, iconEl, slots.text), slots.default);
|
|
99
|
-
});
|
|
100
|
-
MenuItem.displayName = 'f7-menu-item';
|
|
101
|
-
export default MenuItem;
|
package/components/menu.d.ts
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export interface MenuProps {
|
|
6
|
-
slot?: string;
|
|
7
|
-
id?: string | number;
|
|
8
|
-
className?: string;
|
|
9
|
-
style?: React.CSSProperties;
|
|
10
|
-
ref?: React.MutableRefObject<{el: HTMLElement | null}>;
|
|
11
|
-
children?: React.ReactNode;
|
|
12
|
-
color?: string;
|
|
13
|
-
colorTheme?: string;
|
|
14
|
-
textColor?: string;
|
|
15
|
-
bgColor?: string;
|
|
16
|
-
borderColor?: string;
|
|
17
|
-
rippleColor?: string;
|
|
18
|
-
dark?: boolean;
|
|
19
|
-
}
|
|
20
|
-
declare const Menu: React.FunctionComponent<MenuProps>;
|
|
21
|
-
|
|
22
|
-
export default Menu;
|
|
23
|
-
|
package/components/menu.js
DELETED
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
|
-
import React, { forwardRef, useRef, useImperativeHandle } from 'react';
|
|
4
|
-
import { classNames, getExtraAttrs } from '../shared/utils.js';
|
|
5
|
-
import { colorClasses } from '../shared/mixins.js';
|
|
6
|
-
|
|
7
|
-
const Menu = /*#__PURE__*/forwardRef((props, ref) => {
|
|
8
|
-
const {
|
|
9
|
-
className,
|
|
10
|
-
id,
|
|
11
|
-
style,
|
|
12
|
-
children
|
|
13
|
-
} = props;
|
|
14
|
-
const extraAttrs = getExtraAttrs(props);
|
|
15
|
-
const elRef = useRef(null);
|
|
16
|
-
useImperativeHandle(ref, () => ({
|
|
17
|
-
el: elRef.current
|
|
18
|
-
}));
|
|
19
|
-
const classes = classNames('menu', colorClasses(props), className);
|
|
20
|
-
return /*#__PURE__*/React.createElement("div", _extends({
|
|
21
|
-
id: id,
|
|
22
|
-
style: style,
|
|
23
|
-
className: classes,
|
|
24
|
-
ref: elRef
|
|
25
|
-
}, extraAttrs), /*#__PURE__*/React.createElement("div", {
|
|
26
|
-
className: "menu-inner"
|
|
27
|
-
}, children));
|
|
28
|
-
});
|
|
29
|
-
Menu.displayName = 'f7-menu';
|
|
30
|
-
export default Menu;
|
package/components/row.d.ts
DELETED
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export interface RowProps {
|
|
6
|
-
slot?: string;
|
|
7
|
-
id?: string | number;
|
|
8
|
-
className?: string;
|
|
9
|
-
style?: React.CSSProperties;
|
|
10
|
-
noGap ?: boolean;
|
|
11
|
-
tag ?: string;
|
|
12
|
-
resizable ?: boolean;
|
|
13
|
-
resizableFixed ?: boolean;
|
|
14
|
-
resizableAbsolute ?: boolean;
|
|
15
|
-
resizableHandler ?: boolean;
|
|
16
|
-
onClick ?: (event?: any) => void;
|
|
17
|
-
onGridResize ?: (...args: any[]) => void;
|
|
18
|
-
ref?: React.MutableRefObject<{el: HTMLElement | null}>;
|
|
19
|
-
children?: React.ReactNode;
|
|
20
|
-
color?: string;
|
|
21
|
-
colorTheme?: string;
|
|
22
|
-
textColor?: string;
|
|
23
|
-
bgColor?: string;
|
|
24
|
-
borderColor?: string;
|
|
25
|
-
rippleColor?: string;
|
|
26
|
-
dark?: boolean;
|
|
27
|
-
}
|
|
28
|
-
declare const Row: React.FunctionComponent<RowProps>;
|
|
29
|
-
|
|
30
|
-
export default Row;
|
|
31
|
-
|
package/components/row.js
DELETED
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
|
-
import React, { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';
|
|
4
|
-
import { classNames, getExtraAttrs, emit } from '../shared/utils.js';
|
|
5
|
-
import { colorClasses } from '../shared/mixins.js';
|
|
6
|
-
import { f7ready, f7 } from '../shared/f7.js';
|
|
7
|
-
|
|
8
|
-
const Row = /*#__PURE__*/forwardRef((props, ref) => {
|
|
9
|
-
const {
|
|
10
|
-
className,
|
|
11
|
-
id,
|
|
12
|
-
style,
|
|
13
|
-
children,
|
|
14
|
-
tag = 'div',
|
|
15
|
-
noGap,
|
|
16
|
-
resizable,
|
|
17
|
-
resizableFixed,
|
|
18
|
-
resizableAbsolute,
|
|
19
|
-
resizableHandler = true
|
|
20
|
-
} = props;
|
|
21
|
-
const extraAttrs = getExtraAttrs(props);
|
|
22
|
-
const elRef = useRef(null);
|
|
23
|
-
|
|
24
|
-
const onClick = event => {
|
|
25
|
-
emit(props, 'click', event);
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
const onResize = el => {
|
|
29
|
-
if (el === elRef.current) {
|
|
30
|
-
emit(props, 'gridResize');
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
useImperativeHandle(ref, () => ({
|
|
35
|
-
el: elRef.current
|
|
36
|
-
}));
|
|
37
|
-
useEffect(() => {
|
|
38
|
-
f7ready(() => {
|
|
39
|
-
f7.on('gridResize', onResize);
|
|
40
|
-
});
|
|
41
|
-
return () => {
|
|
42
|
-
f7.off('gridResize', onResize);
|
|
43
|
-
};
|
|
44
|
-
});
|
|
45
|
-
const RowTag = tag;
|
|
46
|
-
const classes = classNames(className, 'row', {
|
|
47
|
-
'no-gap': noGap,
|
|
48
|
-
resizable,
|
|
49
|
-
'resizable-fixed': resizableFixed,
|
|
50
|
-
'resizable-absolute': resizableAbsolute
|
|
51
|
-
}, colorClasses(props));
|
|
52
|
-
return /*#__PURE__*/React.createElement(RowTag, _extends({
|
|
53
|
-
id: id,
|
|
54
|
-
style: style,
|
|
55
|
-
className: classes,
|
|
56
|
-
ref: elRef
|
|
57
|
-
}, extraAttrs, {
|
|
58
|
-
onClick: onClick
|
|
59
|
-
}), children, resizable && resizableHandler && /*#__PURE__*/React.createElement("span", {
|
|
60
|
-
className: "resize-handler"
|
|
61
|
-
}));
|
|
62
|
-
});
|
|
63
|
-
Row.displayName = 'f7-row';
|
|
64
|
-
export default Row;
|
package/components/swiper.d.ts
DELETED
package/components/swiper.js
DELETED