@progress/kendo-react-spreadsheet 6.1.1 → 7.0.0-develop.2

package/dist/es/tools/tableTools.d.ts

@@ -1,64 +0,0 @@
-import * as React from 'react';
-import { SpreadsheetToolProps } from './utils';
-import { SelectedHeaders } from '@progress/kendo-spreadsheet-common';
-interface TableToolProps extends SpreadsheetToolProps {
-    /**
-     * @hidden
-     */
-    value: SelectedHeaders;
-}
-/**
- * The props of the AddColumnLeft tool component.
- */
-export interface AddColumnLeftProps extends TableToolProps {
-}
-/**
- * The props of the AddColumnRight tool component.
- */
-export interface AddColumnRightProps extends TableToolProps {
-}
-/**
- * The props of the AddRowBelow tool component.
- */
-export interface AddRowBelowProps extends TableToolProps {
-}
-/**
- * The props of the AddRowAbove tool component.
- */
-export interface AddRowAboveProps extends TableToolProps {
-}
-/**
- * The props of the DeleteColumn tool component.
- */
-export interface DeleteColumnProps extends TableToolProps {
-}
-/**
- * The props of the DeleteRow tool component.
- */
-export interface DeleteRowProps extends TableToolProps {
-}
-/**
- * The AddColumnLeft tool component.
- */
-export declare const AddColumnLeft: React.FunctionComponent<AddColumnLeftProps>;
-/**
- * The AddColumnRight tool component.
- */
-export declare const AddColumnRight: React.FunctionComponent<AddColumnRightProps>;
-/**
- * The AddRowBelow tool component.
- */
-export declare const AddRowBelow: React.FunctionComponent<AddRowBelowProps>;
-/**
- * The AddRowAbove tool component.
- */
-export declare const AddRowAbove: React.FunctionComponent<AddRowAboveProps>;
-/**
- * The DeleteColumn tool component.
- */
-export declare const DeleteColumn: React.FunctionComponent<DeleteColumnProps>;
-/**
- * The DeleteRow tool component.
- */
-export declare const DeleteRow: React.FunctionComponent<DeleteRowProps>;
-export {};

package/dist/es/tools/tableTools.js

@@ -1,102 +0,0 @@
-import * as React from 'react';
-import { Button } from '@progress/kendo-react-buttons';
-import { tableColumnInsertLeftIcon, tableColumnInsertRightIcon, tableRowInsertBelowIcon, tableRowInsertAboveIcon, tableColumnDeleteIcon, tableRowDeleteIcon } from '@progress/kendo-svg-icons';
-import { keys, messages } from '../messages';
-import { useLocalization } from '@progress/kendo-react-intl';
-const TableDataTool = (settings) => {
-    const tool = props => {
-        const { spreadsheetRef, value } = props;
-        const onClick = React.useCallback(() => {
-            if (spreadsheetRef.current) {
-                const options = {
-                    command: settings.command, options: { value: settings.value }
-                };
-                spreadsheetRef.current.executeCommand(options);
-            }
-        }, []);
-        return (React.createElement(Button, { type: "button", icon: settings.icon, svgIcon: settings.svgIcon, fillMode: "flat", title: useLocalization().toLanguageString(settings.titleKey, messages[settings.titleKey]), onClick: onClick, disabled: value && settings.disabled(value) }));
-    };
-    return tool;
-};
-const addColumnLeft = {
-    command: 'AddColumnCommand',
-    value: 'left',
-    icon: 'table-column-insert-left',
-    svgIcon: tableColumnInsertLeftIcon,
-    titleKey: keys.addColumnLeft,
-    disabled: (headers) => headers.allCols,
-    displayName: 'AddColumnLeft'
-};
-const addColumnRight = {
-    command: 'AddColumnCommand',
-    value: 'right',
-    icon: 'table-column-insert-right',
-    svgIcon: tableColumnInsertRightIcon,
-    titleKey: keys.addColumnRight,
-    disabled: (headers) => headers.allCols,
-    displayName: 'AddColumnRight'
-};
-const addRowBelow = {
-    command: 'AddRowCommand',
-    value: 'below',
-    icon: 'table-row-insert-below',
-    svgIcon: tableRowInsertBelowIcon,
-    titleKey: keys.addRowBelow,
-    disabled: (headers) => headers.allRows,
-    displayName: 'AddRowBelow'
-};
-const addRowAbove = {
-    command: 'AddRowCommand',
-    value: 'above',
-    icon: 'table-row-insert-above',
-    svgIcon: tableRowInsertAboveIcon,
-    titleKey: keys.addRowAbove,
-    disabled: (headers) => headers.allRows,
-    displayName: 'AddRowAbove'
-};
-const deleteColumn = {
-    command: 'DeleteColumnCommand',
-    icon: 'table-column-delete',
-    svgIcon: tableColumnDeleteIcon,
-    titleKey: keys.deleteColumn,
-    disabled: (headers) => headers.allCols,
-    displayName: 'DeleteColumn'
-};
-const deleteRow = {
-    command: 'DeleteRowCommand',
-    icon: 'table-row-delete',
-    svgIcon: tableRowDeleteIcon,
-    titleKey: keys.deleteRow,
-    disabled: (headers) => headers.allRows,
-    displayName: 'DeleteRow'
-};
-/**
- * The AddColumnLeft tool component.
- */
-export const AddColumnLeft = TableDataTool(addColumnLeft);
-/**
- * The AddColumnRight tool component.
- */
-export const AddColumnRight = TableDataTool(addColumnRight);
-/**
- * The AddRowBelow tool component.
- */
-export const AddRowBelow = TableDataTool(addRowBelow);
-/**
- * The AddRowAbove tool component.
- */
-export const AddRowAbove = TableDataTool(addRowAbove);
-/**
- * The DeleteColumn tool component.
- */
-export const DeleteColumn = TableDataTool(deleteColumn);
-/**
- * The DeleteRow tool component.
- */
-export const DeleteRow = TableDataTool(deleteRow);
-AddColumnLeft.displayName = 'AddColumnLeft';
-AddColumnRight.displayName = 'AddColumnRight';
-AddRowBelow.displayName = 'AddRowBelow';
-AddRowAbove.displayName = 'AddRowAbove';
-DeleteColumn.displayName = 'DeleteColumn';
-DeleteRow.displayName = 'DeleteRow';

package/dist/es/tools/textColor.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { ColorToolProps } from './utils';
-/**
- * The props of the TextColor tool component.
- */
-export interface TextColorProps extends ColorToolProps {
-}
-/**
- * The TextColor tool component.
- */
-export declare const TextColor: React.FunctionComponent<TextColorProps>;

package/dist/es/tools/textColor.js

@@ -1,15 +0,0 @@
-import { keys } from '../messages';
-import { ColorTool } from './utils';
-import { foregroundColorIcon } from '@progress/kendo-svg-icons';
-/**
- * The TextColor tool component.
- */
-export const TextColor = ColorTool({
-    icon: 'foreground-color',
-    svgIcon: foregroundColorIcon,
-    view: 'palette',
-    property: 'color',
-    titleKey: keys.textColor,
-    ariaLabel: 'Text Color'
-});
-TextColor.displayName = 'TextColor';

package/dist/es/tools/textWrap.js

@@ -1,26 +0,0 @@
-import * as React from 'react';
-import { Button } from '@progress/kendo-react-buttons';
-import { textWrapIcon } from '@progress/kendo-svg-icons';
-import { useLocalization } from '@progress/kendo-react-intl';
-import { keys, messages } from '../messages';
-/**
- * The TextWrap tool component.
- */
-export const TextWrap = props => {
-    const { value: selected, spreadsheetRef } = props;
-    const onClick = React.useCallback(() => {
-        if (spreadsheetRef.current) {
-            const sheet = spreadsheetRef.current.activeSheet();
-            if (sheet) {
-                const range = sheet.range(sheet.activeCell());
-                const value = !range.wrap();
-                const options = {
-                    command: 'TextWrapCommand', options: { property: 'wrap', value }
-                };
-                spreadsheetRef.current.executeCommand(options);
-            }
-        }
-    }, []);
-    return (React.createElement(Button, { type: 'button', togglable: true, icon: 'text-wrap', svgIcon: textWrapIcon, fillMode: "flat", title: useLocalization().toLanguageString(keys.textWrap, messages[keys.textWrap]), onClick: onClick, selected: selected }));
-};
-TextWrap.displayName = 'TextWrap';

package/dist/es/tools/underline.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { PropertyChangeToolProps } from './utils';
-/**
- * The props of the Underline tool component.
- */
-export interface UnderlineProps extends PropertyChangeToolProps {
-}
-/**
- * The Underline tool component.
- */
-export declare const Underline: React.FunctionComponent<UnderlineProps>;

package/dist/es/tools/underline.js

@@ -1,9 +0,0 @@
-import { underlineIcon } from '@progress/kendo-svg-icons';
-import { PropertyChangeTool } from './utils';
-import { keys } from '../messages';
-const underlineSettings = { property: 'underline', icon: 'underline', svgIcon: underlineIcon, titleKey: keys.underline };
-/**
- * The Underline tool component.
- */
-export const Underline = PropertyChangeTool(underlineSettings);
-Underline.displayName = 'Underline';

package/dist/es/tools/undo.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { SpreadsheetToolProps } from './utils';
-/**
- * The props of the Undo tool component.
- */
-export interface UndoProps extends SpreadsheetToolProps {
-}
-/**
- * The Undo tool component.
- */
-export declare const Undo: React.FunctionComponent<UndoProps>;

package/dist/es/tools/undo.js

@@ -1,9 +0,0 @@
-import { arrowRotateCcwIcon } from '@progress/kendo-svg-icons';
-import { UndoRedo } from './utils';
-import { keys } from '../messages';
-const undoSettings = { action: 'undo', icon: 'reset', svgIcon: arrowRotateCcwIcon, titleKey: keys.undo };
-/**
- * The Undo tool component.
- */
-export const Undo = UndoRedo(undoSettings);
-Undo.displayName = 'Undo';

package/dist/es/tools/utils.d.ts

@@ -1,91 +0,0 @@
-import * as React from 'react';
-import { SpreadsheetWidget } from './../SpreadsheetProps';
-import { ColorPickerProps } from '@progress/kendo-react-inputs';
-import { SVGIcon } from '@progress/kendo-react-common';
-/**
- * @hidden
- */
-export declare const FONT_FAMILIES: string[];
-/**
- * @hidden
- */
-export declare const DEFAULT_FONT_FAMILY = "Arial";
-/**
- * @hidden
- */
-export declare const FONT_SIZES: number[];
-/**
- * @hidden
- */
-export declare const DEFAULT_FONT_SIZE = 12;
-/**
- * @hidden
- */
-export declare const FORMATS: ({
-    text: string;
-    value: null;
-} | {
-    text: string;
-    value: string;
-})[];
-/**
- * The base props interface of the Spreadsheet tool component.
- */
-export interface SpreadsheetToolProps {
-    /**
-     * The `React.RefObject` object of the SpreadsheetWidget, holding the core functionality of the Spreadsheet.
-     */
-    spreadsheetRef: React.RefObject<SpreadsheetWidget>;
-}
-/**
- * @hidden
- */
-export interface PropertyChangeToolProps extends SpreadsheetToolProps {
-    /**
-     * The selected state of the tool.
-     */
-    value?: boolean;
-}
-/**
- * @hidden
- */
-export interface DropDownToolProps extends SpreadsheetToolProps {
-    /**
-     * The value of the tool.
-     */
-    value?: any;
-}
-/**
- * @hidden
- */
-export declare const PropertyChangeTool: <Props extends PropertyChangeToolProps>(settings: {
-    property: string;
-    icon: string;
-    svgIcon: SVGIcon;
-    titleKey: string;
-}) => React.FunctionComponent<Props>;
-/**
- * @hidden
- */
-export interface ColorToolProps extends SpreadsheetToolProps {
-    /**
-     * The value of the tool.
-     */
-    value?: string;
-}
-/**
- * @hidden
- */
-export declare const ColorTool: <Props extends ColorToolProps>(settings: ColorPickerProps & {
-    property: string;
-    titleKey: string;
-}) => React.FunctionComponent<Props>;
-/**
- * @hidden
- */
-export declare const UndoRedo: <Props extends SpreadsheetToolProps>(settings: {
-    action: string;
-    icon: string;
-    svgIcon: SVGIcon;
-    titleKey: string;
-}) => React.FunctionComponent<Props>;

package/dist/es/tools/utils.js

@@ -1,102 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import * as React from 'react';
-import { Button } from '@progress/kendo-react-buttons';
-import { ColorPicker } from '@progress/kendo-react-inputs';
-import { useLocalization } from '@progress/kendo-react-intl';
-import { messages } from '../messages';
-/**
- * @hidden
- */
-export const FONT_FAMILIES = ['Arial', 'Courier New', 'Georgia', 'Times New Roman', 'Trebuchet MS', 'Verdana'];
-/**
- * @hidden
- */
-export const DEFAULT_FONT_FAMILY = 'Arial';
-/**
- * @hidden
- */
-export const FONT_SIZES = [8, 9, 10, 11, 12, 13, 14, 16, 18, 20, 22, 24, 26, 28, 36, 48, 72];
-/**
- * @hidden
- */
-export const DEFAULT_FONT_SIZE = 12;
-/**
- * @hidden
- */
-export const FORMATS = [
-    { text: 'Automatic', value: null },
-    { text: 'Text', value: '@' },
-    { text: 'Number', value: '#,0.00' },
-    { text: 'Percent', value: '0.00%' },
-    { text: 'Financial', value: '_("$"* #,##0.00_);_("$"* (#,##0.00);_("$"* "-"??_);_(@_)' },
-    { text: 'Currency', value: '$#,##0.00;[Red]$#,##0.00' },
-    { text: 'Date', value: 'm/d/yyyy' },
-    { text: 'Time', value: 'h:mm:ss AM/PM' },
-    { text: 'Date time', value: 'm/d/yyyy h:mm' },
-    { text: 'Duration', value: '[h]:mm:ss' }
-];
-/**
- * @hidden
- */
-export const PropertyChangeTool = (settings) => {
-    const tool = props => {
-        const { property, icon, svgIcon, titleKey } = settings;
-        const { spreadsheetRef, value: selected } = props;
-        const onClick = React.useCallback(() => {
-            if (spreadsheetRef.current) {
-                const value = !selected;
-                const options = {
-                    command: 'PropertyChangeCommand', options: { property, value }
-                };
-                spreadsheetRef.current.executeCommand(options);
-            }
-        }, [selected]);
-        return (React.createElement(Button, { type: "button", icon: icon, svgIcon: svgIcon, fillMode: "flat", togglable: true, onClick: onClick, selected: selected, title: useLocalization().toLanguageString(titleKey, messages[titleKey]) }));
-    };
-    return tool;
-};
-/**
- * @hidden
- */
-export const ColorTool = (settings) => {
-    const tool = props => {
-        const { property, titleKey } = settings, colorPickerProps = __rest(settings, ["property", "titleKey"]);
-        const { spreadsheetRef, value } = props;
-        const onChange = React.useCallback((event) => {
-            if (spreadsheetRef.current) {
-                const options = {
-                    command: 'PropertyChangeCommand', options: { property, value: event.value || null }
-                };
-                spreadsheetRef.current.executeCommand(options);
-            }
-        }, [property]);
-        return (React.createElement(ColorPicker, Object.assign({ onChange: onChange, onActiveColorClick: onChange, fillMode: "flat" }, colorPickerProps, { title: useLocalization().toLanguageString(titleKey, messages[titleKey]), value: value })));
-    };
-    return tool;
-};
-/**
- * @hidden
- */
-export const UndoRedo = (settings) => {
-    const tool = props => {
-        const { spreadsheetRef } = props;
-        const onClick = React.useCallback(() => {
-            if (spreadsheetRef.current) {
-                const workbook = spreadsheetRef.current.workbook;
-                workbook.undoRedoStack[settings.action]();
-            }
-        }, []);
-        return (React.createElement(Button, { type: "button", icon: settings.icon, svgIcon: settings.svgIcon, fillMode: "flat", title: useLocalization().toLanguageString(settings.titleKey, messages[settings.titleKey]), onClick: onClick }));
-    };
-    return tool;
-};

package/dist/npm/FormulaInput.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-/**
- * @hidden
- */
-export declare const FormulaInput: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<any>>;

package/dist/npm/FormulaInput.js

@@ -1,119 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FormulaInput = void 0;
-const React = require("react");
-const kendo_react_popup_1 = require("@progress/kendo-react-popup");
-const List_1 = require("./List");
-const kendo_react_common_1 = require("@progress/kendo-react-common");
-/**
- * @hidden
- */
-exports.FormulaInput = React.forwardRef((props, ref) => {
-    const [showPopup, setShowPopup] = React.useState(false);
-    const [popupContentKey, setPopupContentKey] = React.useState(0);
-    const [data, setData] = React.useState([]);
-    const memo = React.useMemo(() => ({}), []);
-    memo.showPopup = showPopup;
-    memo.popupContentKey = popupContentKey;
-    memo.data = data;
-    const target = React.useRef(null);
-    const elementRef = React.useRef(null);
-    const listRef = React.useRef(null);
-    const focusedItem = React.useCallback(() => {
-        if (listRef.current && listRef.current.element) {
-            return listRef.current.element.querySelector('.k-focus');
-        }
-    }, []);
-    const unfocus = React.useCallback(() => {
-        const focused = focusedItem();
-        if (focused) {
-            focused.classList.remove('k-focus');
-        }
-    }, []);
-    const focusNext = React.useCallback((dir) => {
-        const items = Array.from((listRef.current && listRef.current.element.children) || []);
-        const focused = focusedItem();
-        let next;
-        if (focused) {
-            const index = items.indexOf(focused);
-            focused.classList.remove('k-focus');
-            next = items[index + dir] ? items[index + dir] : (dir === 1 ? items[0] : items[items.length - 1]);
-        }
-        else {
-            next = (dir === 1 ? items[0] : items[items.length - 1]);
-        }
-        if (next) {
-            next.classList.add('k-focus');
-        }
-    }, []);
-    React.useImperativeHandle(target, () => ({
-        element: elementRef.current,
-        props,
-        popup: {
-            open: () => {
-                setShowPopup(true);
-            },
-            close: () => {
-                setShowPopup(false);
-            },
-            position: () => {
-                setPopupContentKey(memo.popupContentKey + 1);
-            },
-            visible: () => {
-                return memo.showPopup;
-            }
-        },
-        list: {
-            get element() { return listRef.current && listRef.current.element; },
-            data: (d) => {
-                if (d) {
-                    setData(d);
-                }
-                else {
-                    return memo.data;
-                }
-            },
-            value: () => { return {}; },
-            focus: () => {
-                const items = Array.from((listRef.current && listRef.current.element && listRef.current.element.children) || []);
-                return items.indexOf(focusedItem());
-            },
-            // select: (x) => {
-            //     console.log('select', x);
-            // },
-            focusNext: () => {
-                focusNext(1);
-            },
-            focusPrev: () => {
-                focusNext(-1);
-            },
-            focusFirst: () => {
-                const list = listRef.current && listRef.current.element;
-                if (list && list.children.item(0)) {
-                    unfocus();
-                    list.children.item(0).classList.add('k-focus');
-                }
-            },
-            focusLast: () => {
-                const list = listRef.current && listRef.current.element;
-                if (list && list.children.length) {
-                    unfocus();
-                    list.children.item(list.children.length - 1).classList.add('k-focus');
-                }
-            },
-            itemClick: (handler) => { memo.itemClick = handler; }
-        }
-    }), []);
-    React.useImperativeHandle(ref, () => target.current, []);
-    const onItemClick = React.useCallback((value) => {
-        if (memo.itemClick) {
-            memo.itemClick(value);
-        }
-    }, []);
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: (0, kendo_react_common_1.classNames)('k-spreadsheet-formula-input', props.className), contentEditable: "true", spellCheck: "false", style: { whiteSpace: 'pre' }, ref: elementRef }),
-        React.createElement(kendo_react_popup_1.Popup, { show: showPopup, anchor: elementRef.current, animate: { openDuration: 100, closeDuration: 100 }, contentKey: popupContentKey, popupClass: "k-list-container" },
-            React.createElement(List_1.List, { data: data, ref: listRef, onItemClick: onItemClick }))));
-});
-exports.FormulaInput.displayName = 'FormulaInput';
-exports.FormulaInput.propTypes = {};

package/dist/npm/List.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-/**
- * @hidden
- */
-export declare const List: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<any>>;

package/dist/npm/List.js

@@ -1,25 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.List = void 0;
-const React = require("react");
-const kendo_react_common_1 = require("@progress/kendo-react-common");
-const kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
-/**
- * @hidden
- */
-exports.List = React.forwardRef((props, ref) => {
-    const target = React.useRef(null);
-    const ulRef = React.useRef(null);
-    React.useImperativeHandle(target, () => ({
-        element: ulRef.current,
-        props
-    }));
-    React.useImperativeHandle(ref, () => target.current);
-    return (React.createElement("div", { className: "k-list k-list-md" },
-        React.createElement("div", { className: "k-list-content" },
-            React.createElement("ul", { ref: ulRef, className: "k-spreadsheet-formula-list k-list-ul", onMouseDown: e => e.preventDefault(), style: { maxHeight: 280 } }, props.data.map((item) => (React.createElement("li", { key: item.text, className: "k-list-item", onClick: () => props.onItemClick(item.value) },
-                React.createElement(kendo_react_common_1.IconWrap, { name: "formula-fx", icon: kendo_svg_icons_1.formulaFxIcon }),
-                React.createElement("span", { className: "k-list-item-text" }, item.text))))))));
-});
-exports.List.displayName = 'List';
-exports.List.propTypes = {};

package/dist/npm/NameBox.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-/**
- * @hidden
- */
-export declare const NameBox: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<any>>;