npm - @progress/kendo-themes-html - Versions diffs - 5.6.1-dev.6 → 5.8.0 - Mend

@progress/kendo-themes-html 5.6.1-dev.6 → 5.8.0

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 (382) hide show

package/dist/action-sheet/tests/action-sheet-position.js CHANGED Viewed

@@ -114,7 +114,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-hover"
+      className: "k-actionsheet-action k-hover"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -128,7 +128,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-focus"
+      className: "k-actionsheet-action k-focus"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -142,7 +142,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-disabled"
+      className: "k-actionsheet-action k-disabled"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -208,7 +208,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-hover"
+      className: "k-actionsheet-action k-hover"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -222,7 +222,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-focus"
+      className: "k-actionsheet-action k-focus"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -236,7 +236,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-disabled"
+      className: "k-actionsheet-action k-disabled"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -302,7 +302,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-hover"
+      className: "k-actionsheet-action k-hover"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -316,7 +316,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-focus"
+      className: "k-actionsheet-action k-focus"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -330,7 +330,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-disabled"
+      className: "k-actionsheet-action k-disabled"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -396,7 +396,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-hover"
+      className: "k-actionsheet-action k-hover"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -410,7 +410,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-focus"
+      className: "k-actionsheet-action k-focus"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -424,7 +424,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-disabled"
+      className: "k-actionsheet-action k-disabled"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"

package/dist/action-sheet/tests/action-sheet-position.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/action-sheet/tests/action-sheet-position.tsx", "../../../src/icon/icon.tsx", "../../../src/utils/classNames.ts"],
-  "sourcesContent": ["import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport { Icon } from '../../icon';\n\nconst root = ReactDOM.createRoot(\n    document.getElementById('app') as HTMLElement\n);\n\nconst styles = `\n    #test-area {\n        height: 600px;\n        transform: scale(1);\n        overflow: hidden;\n    }\n    .k-actionsheet {\n        max-width: 200px;\n        max-height: 280px;\n    }\n`;\n\nroot.render(\n    <>\n        <style>{styles}</style>\n        <div id=\"test-area\">\n            <div className=\"k-actionsheet-container\">\n                <div className=\"k-overlay\"></div>\n                <div className=\"k-actionsheet k-actionsheet-top\">\n                    <div className=\"k-actionsheet-header\">\n                        Top action sheet\n                    </div>\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-left\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Left action sheet\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-right\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Right action sheet\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-bottom\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Bottom action sheet\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n            </div>\n        </div>\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", "/* 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"],
+  "sourcesContent": ["import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport { Icon } from '../../icon';\n\nconst root = ReactDOM.createRoot(\n    document.getElementById('app') as HTMLElement\n);\n\nconst styles = `\n    #test-area {\n        height: 600px;\n        transform: scale(1);\n        overflow: hidden;\n    }\n    .k-actionsheet {\n        max-width: 200px;\n        max-height: 280px;\n    }\n`;\n\nroot.render(\n    <>\n        <style>{styles}</style>\n        <div id=\"test-area\">\n            <div className=\"k-actionsheet-container\">\n                <div className=\"k-overlay\"></div>\n                <div className=\"k-actionsheet k-actionsheet-top\">\n                    <div className=\"k-actionsheet-header\">\n                        Top action sheet\n                    </div>\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-left\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Left action sheet\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-right\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Right action sheet\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-bottom\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Bottom action sheet\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n            </div>\n        </div>\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", "/* 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"],
   "mappings": "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",
   "names": ["ReactDOM", "React"]
 }

package/dist/action-sheet/tests/action-sheet.js CHANGED Viewed

@@ -116,7 +116,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-hover"
+      className: "k-actionsheet-action k-hover"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -130,7 +130,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-focus"
+      className: "k-actionsheet-action k-focus"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -144,7 +144,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-disabled"
+      className: "k-actionsheet-action k-disabled"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -210,7 +210,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-hover"
+      className: "k-actionsheet-action k-hover"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -224,7 +224,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-focus"
+      className: "k-actionsheet-action k-focus"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"
@@ -238,7 +238,7 @@
       className: "k-actionsheet-item"
     }, /* @__PURE__ */ import_react.default.createElement("a", {
       href: "#",
-      className: "k-actionsheet-action k-state-disabled"
+      className: "k-actionsheet-action k-disabled"
     }, /* @__PURE__ */ import_react.default.createElement(Icon, {
       className: "k-actionsheet-item-icon",
       name: "cog"

package/dist/action-sheet/tests/action-sheet.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/action-sheet/tests/action-sheet.tsx", "../../../src/icon/icon.tsx", "../../../src/utils/classNames.ts"],
-  "sourcesContent": ["import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport { Icon } from '../../icon';\n\nconst root = ReactDOM.createRoot(\n    document.getElementById('app') as HTMLElement\n);\n\nconst styles = `\n    #test-area {\n        height: 600px;\n        transform: scale(1);\n        overflow: hidden;\n    }\n    .k-actionsheet:not(.k-rtl) {\n        left: 200px;\n    }\n    .k-actionsheet.k-rtl {\n        left: 600px;\n    }\n`;\n\nroot.render(\n    <>\n        <style>{styles}</style>\n        <div id=\"test-area\">\n            <div className=\"k-actionsheet-container\">\n                <div className=\"k-overlay\"></div>\n\n                <div className=\"k-actionsheet k-actionsheet-bottom\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Header\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-bottom k-rtl\">\n                    <div className=\"k-actionsheet-header\">\n                        Header\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-state-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </div>\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", "/* 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"],
+  "sourcesContent": ["import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport { Icon } from '../../icon';\n\nconst root = ReactDOM.createRoot(\n    document.getElementById('app') as HTMLElement\n);\n\nconst styles = `\n    #test-area {\n        height: 600px;\n        transform: scale(1);\n        overflow: hidden;\n    }\n    .k-actionsheet:not(.k-rtl) {\n        left: 200px;\n    }\n    .k-actionsheet.k-rtl {\n        left: 600px;\n    }\n`;\n\nroot.render(\n    <>\n        <style>{styles}</style>\n        <div id=\"test-area\">\n            <div className=\"k-actionsheet-container\">\n                <div className=\"k-overlay\"></div>\n\n                <div className=\"k-actionsheet k-actionsheet-bottom\">\n\n                    <div className=\"k-actionsheet-header\">\n                        Header\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div className=\"k-actionsheet k-actionsheet-bottom k-rtl\">\n                    <div className=\"k-actionsheet-header\">\n                        Header\n                    </div>\n\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-hover\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Hover action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-focus\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Focus action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action Description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action k-disabled\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Disabled action</span>\n                                    <span className=\"k-actionsheet-item-description\">Action description</span>\n                                </span>\n                            </a>\n                        </li>\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Action</span>\n                                    <span className=\"k-actionsheet-item-description\">Some longer subtitle to break on multiple rows, for testing purposes</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                    <hr className=\"k-hr\" />\n                    <ul className=\"k-actionsheet-items\">\n                        <li className=\"k-actionsheet-item\">\n                            <a href=\"#\" className=\"k-actionsheet-action\">\n                                <Icon className=\"k-actionsheet-item-icon\" name=\"cog\" />\n                                <span className=\"k-actionsheet-item-text\">\n                                    <span className=\"k-actionsheet-item-title\">Cancel</span>\n                                    <span className=\"k-actionsheet-item-description\">Action in second group</span>\n                                </span>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </div>\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", "/* 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"],
   "mappings": "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",
   "names": ["ReactDOM", "React"]
 }