@neo4j-ndl/react 4.21.2-alpha.c774957.15.1 → 4.22.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.
- package/lib/cjs/ai/reasoning/Reasoning.js +1 -1
- package/lib/cjs/ai/reasoning/Reasoning.js.map +1 -1
- package/lib/cjs/clean-icon-button/stories/clean-icon-button-sizes.story.js +1 -1
- package/lib/cjs/clean-icon-button/stories/clean-icon-button-sizes.story.js.map +1 -1
- package/lib/cjs/clean-icon-button/stories/clean-icon-button-tone.story.js +1 -1
- package/lib/cjs/clean-icon-button/stories/clean-icon-button-tone.story.js.map +1 -1
- package/lib/cjs/date-picker/stories/date-picker-with-timezone-both-mode.story.js +1 -1
- package/lib/cjs/date-picker/stories/date-picker-with-timezone-both-mode.story.js.map +1 -1
- package/lib/cjs/dropzone/stories/dropzone-full.story.js +1 -1
- package/lib/cjs/dropzone/stories/dropzone-full.story.js.map +1 -1
- package/lib/cjs/helpers/index.js +1 -0
- package/lib/cjs/helpers/index.js.map +1 -1
- package/lib/cjs/helpers/platform.js +59 -0
- package/lib/cjs/helpers/platform.js.map +1 -0
- package/lib/cjs/icon-button/stories/icon-button-sizes.story.js +1 -1
- package/lib/cjs/icon-button/stories/icon-button-sizes.story.js.map +1 -1
- package/lib/cjs/icon-button/stories/icon-button-tone.story.js +1 -1
- package/lib/cjs/icon-button/stories/icon-button-tone.story.js.map +1 -1
- package/lib/cjs/kbd/kbd-utils.js +6 -22
- package/lib/cjs/kbd/kbd-utils.js.map +1 -1
- package/lib/cjs/next/tree-view/TreeView.js +384 -66
- package/lib/cjs/next/tree-view/TreeView.js.map +1 -1
- package/lib/cjs/next/tree-view/selection.js +181 -0
- package/lib/cjs/next/tree-view/selection.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/index.js +13 -1
- package/lib/cjs/next/tree-view/stories/index.js.map +1 -1
- package/lib/cjs/next/tree-view/stories/tree-view-large.story.js +57 -0
- package/lib/cjs/next/tree-view/stories/tree-view-large.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-lazy.story.js +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-lazy.story.js.map +1 -1
- package/lib/cjs/next/tree-view/stories/tree-view-multi.story.js +16 -40
- package/lib/cjs/next/tree-view/stories/tree-view-multi.story.js.map +1 -1
- package/lib/cjs/next/tree-view/stories/tree-view-multiple-replace.story.js +38 -0
- package/lib/cjs/next/tree-view/stories/tree-view-multiple-replace.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-non-selectable-folders.story.js +7 -4
- package/lib/cjs/next/tree-view/stories/tree-view-non-selectable-folders.story.js.map +1 -1
- package/lib/cjs/next/tree-view/stories/tree-view-root-selection.story.js +125 -0
- package/lib/cjs/next/tree-view/stories/tree-view-root-selection.story.js.map +1 -0
- package/lib/cjs/radio/stories/radio-custom-label.story.js +1 -1
- package/lib/cjs/radio/stories/radio-custom-label.story.js.map +1 -1
- package/lib/cjs/select-icon-button/stories/select-icon-button-sizes.story.js +1 -1
- package/lib/cjs/select-icon-button/stories/select-icon-button-sizes.story.js.map +1 -1
- package/lib/cjs/select-icon-button/stories/select-icon-button-states.story.js +1 -1
- package/lib/cjs/select-icon-button/stories/select-icon-button-states.story.js.map +1 -1
- package/lib/cjs/side-navigation/SideNavigation.js +1 -1
- package/lib/cjs/side-navigation/SideNavigation.js.map +1 -1
- package/lib/cjs/status-indicator/stories/status-indicator-variants.story.js +1 -1
- package/lib/cjs/status-indicator/stories/status-indicator-variants.story.js.map +1 -1
- package/lib/cjs/tabs/stories/tabs-fill-variants.story.js +1 -1
- package/lib/cjs/tabs/stories/tabs-fill-variants.story.js.map +1 -1
- package/lib/cjs/tabs/stories/tabs-sizes.story.js +1 -1
- package/lib/cjs/tabs/stories/tabs-sizes.story.js.map +1 -1
- package/lib/cjs/toast/ToastControlled.js +1 -1
- package/lib/cjs/toast/ToastControlled.js.map +1 -1
- package/lib/cjs/typography/Typography.js.map +1 -1
- package/lib/esm/ai/reasoning/Reasoning.js +1 -1
- package/lib/esm/ai/reasoning/Reasoning.js.map +1 -1
- package/lib/esm/clean-icon-button/stories/clean-icon-button-sizes.story.js +1 -1
- package/lib/esm/clean-icon-button/stories/clean-icon-button-sizes.story.js.map +1 -1
- package/lib/esm/clean-icon-button/stories/clean-icon-button-tone.story.js +1 -1
- package/lib/esm/clean-icon-button/stories/clean-icon-button-tone.story.js.map +1 -1
- package/lib/esm/date-picker/stories/date-picker-with-timezone-both-mode.story.js +1 -1
- package/lib/esm/date-picker/stories/date-picker-with-timezone-both-mode.story.js.map +1 -1
- package/lib/esm/dropzone/stories/dropzone-full.story.js +1 -1
- package/lib/esm/dropzone/stories/dropzone-full.story.js.map +1 -1
- package/lib/esm/helpers/index.js +1 -0
- package/lib/esm/helpers/index.js.map +1 -1
- package/lib/esm/helpers/platform.js +55 -0
- package/lib/esm/helpers/platform.js.map +1 -0
- package/lib/esm/icon-button/stories/icon-button-sizes.story.js +1 -1
- package/lib/esm/icon-button/stories/icon-button-sizes.story.js.map +1 -1
- package/lib/esm/icon-button/stories/icon-button-tone.story.js +1 -1
- package/lib/esm/icon-button/stories/icon-button-tone.story.js.map +1 -1
- package/lib/esm/kbd/kbd-utils.js +2 -18
- package/lib/esm/kbd/kbd-utils.js.map +1 -1
- package/lib/esm/next/tree-view/TreeView.js +385 -67
- package/lib/esm/next/tree-view/TreeView.js.map +1 -1
- package/lib/esm/next/tree-view/selection.js +175 -0
- package/lib/esm/next/tree-view/selection.js.map +1 -0
- package/lib/esm/next/tree-view/stories/index.js +9 -0
- package/lib/esm/next/tree-view/stories/index.js.map +1 -1
- package/lib/esm/next/tree-view/stories/tree-view-large.story.js +55 -0
- package/lib/esm/next/tree-view/stories/tree-view-large.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-lazy.story.js +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-lazy.story.js.map +1 -1
- package/lib/esm/next/tree-view/stories/tree-view-multi.story.js +16 -40
- package/lib/esm/next/tree-view/stories/tree-view-multi.story.js.map +1 -1
- package/lib/esm/next/tree-view/stories/tree-view-multiple-replace.story.js +36 -0
- package/lib/esm/next/tree-view/stories/tree-view-multiple-replace.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-non-selectable-folders.story.js +7 -4
- package/lib/esm/next/tree-view/stories/tree-view-non-selectable-folders.story.js.map +1 -1
- package/lib/esm/next/tree-view/stories/tree-view-root-selection.story.js +123 -0
- package/lib/esm/next/tree-view/stories/tree-view-root-selection.story.js.map +1 -0
- package/lib/esm/radio/stories/radio-custom-label.story.js +1 -1
- package/lib/esm/radio/stories/radio-custom-label.story.js.map +1 -1
- package/lib/esm/select-icon-button/stories/select-icon-button-sizes.story.js +1 -1
- package/lib/esm/select-icon-button/stories/select-icon-button-sizes.story.js.map +1 -1
- package/lib/esm/select-icon-button/stories/select-icon-button-states.story.js +1 -1
- package/lib/esm/select-icon-button/stories/select-icon-button-states.story.js.map +1 -1
- package/lib/esm/side-navigation/SideNavigation.js +1 -1
- package/lib/esm/side-navigation/SideNavigation.js.map +1 -1
- package/lib/esm/status-indicator/stories/status-indicator-variants.story.js +1 -1
- package/lib/esm/status-indicator/stories/status-indicator-variants.story.js.map +1 -1
- package/lib/esm/tabs/stories/tabs-fill-variants.story.js +1 -1
- package/lib/esm/tabs/stories/tabs-fill-variants.story.js.map +1 -1
- package/lib/esm/tabs/stories/tabs-sizes.story.js +1 -1
- package/lib/esm/tabs/stories/tabs-sizes.story.js.map +1 -1
- package/lib/esm/toast/ToastControlled.js +1 -1
- package/lib/esm/toast/ToastControlled.js.map +1 -1
- package/lib/esm/typography/Typography.js.map +1 -1
- package/lib/types/helpers/index.d.ts +1 -0
- package/lib/types/helpers/index.d.ts.map +1 -1
- package/lib/types/helpers/platform.d.ts +29 -0
- package/lib/types/helpers/platform.d.ts.map +1 -0
- package/lib/types/kbd/kbd-utils.d.ts +2 -5
- package/lib/types/kbd/kbd-utils.d.ts.map +1 -1
- package/lib/types/next/tree-view/TreeView.d.ts +29 -5
- package/lib/types/next/tree-view/TreeView.d.ts.map +1 -1
- package/lib/types/next/tree-view/selection.d.ts +78 -0
- package/lib/types/next/tree-view/selection.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/index.d.ts +6 -0
- package/lib/types/next/tree-view/stories/index.d.ts.map +1 -1
- package/lib/types/next/tree-view/stories/tree-view-large.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-large.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-lazy.story.d.ts.map +1 -1
- package/lib/types/next/tree-view/stories/tree-view-multi.story.d.ts +10 -0
- package/lib/types/next/tree-view/stories/tree-view-multi.story.d.ts.map +1 -1
- package/lib/types/next/tree-view/stories/tree-view-multiple-replace.story.d.ts +29 -0
- package/lib/types/next/tree-view/stories/tree-view-multiple-replace.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-non-selectable-folders.story.d.ts +5 -0
- package/lib/types/next/tree-view/stories/tree-view-non-selectable-folders.story.d.ts.map +1 -1
- package/lib/types/next/tree-view/stories/tree-view-root-selection.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-root-selection.story.d.ts.map +1 -0
- package/lib/types/typography/Typography.d.ts +1 -6
- package/lib/types/typography/Typography.d.ts.map +1 -1
- package/package.json +3 -4
- package/skills/ndl-react/SKILL.md +1 -1
- package/skills/ndl-react/components/clean-icon-button.md +5 -5
- package/skills/ndl-react/components/color-picker.md +32 -32
- package/skills/ndl-react/components/date-picker.md +1 -1
- package/skills/ndl-react/components/dropzone.md +6 -6
- package/skills/ndl-react/components/icon-button.md +5 -5
- package/skills/ndl-react/components/next/tree-view.md +358 -104
- package/skills/ndl-react/components/radio.md +1 -1
- package/skills/ndl-react/components/select-icon-button.md +6 -6
- package/skills/ndl-react/components/status-indicator.md +5 -5
- package/skills/ndl-react/components/tabs.md +4 -4
- package/skills/ndl-react/components/typography.md +1 -1
|
@@ -56,7 +56,7 @@ const ReasoningComponent = (_a) => {
|
|
|
56
56
|
const buttonId = (0, react_2.useId)();
|
|
57
57
|
const panelId = (0, react_2.useId)();
|
|
58
58
|
const { value: thinkingDuration, unit } = (0, thinking_duration_formatter_1.formatThinkingDuration)(thinkingMs);
|
|
59
|
-
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsx)(react_1.Typography, Object.assign({ variant: "
|
|
59
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsx)(react_1.Typography, Object.assign({ variant: "label", className: (0, classnames_1.default)('ndl-ai-reasoning-header', {
|
|
60
60
|
'ndl-expanded': isExpanded,
|
|
61
61
|
}) }, (!isThinking
|
|
62
62
|
? {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Reasoning.js","sourceRoot":"","sources":["../../../../src/ai/reasoning/Reasoning.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,4CAA8C;AAC9C,4DAAoC;AACpC,iCAAwC;AAGxC,mGAAgG;AAChG,0CAAuC;AACvC,yFAAiF;AAajF;;;;;GAKG;AACH,MAAM,kBAAkB,GAAG,CAAC,EAUS,EAAE,EAAE;QAVb,EAC1B,UAAU,GAAG,IAAI,EACjB,UAAU,GAAG,IAAI,EACjB,aAAa,GAAG,UAAU,EAC1B,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAEgC,EADhC,SAAS,cATc,wGAU3B,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;IAC1D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACpD,MAAM,kBAAkB,GAAG,UAAU,IAAI,UAAU,KAAK,KAAK,CAAC;IAC9D,MAAM,QAAQ,GAAG,IAAA,aAAK,GAAE,CAAC;IACzB,MAAM,OAAO,GAAG,IAAA,aAAK,GAAE,CAAC;IAExB,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,IAAA,oDAAsB,EAAC,UAAU,CAAC,CAAC;IAE7E,OAAO,CACL,+CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,eAElB,uBAAC,kBAAU,kBACT,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"Reasoning.js","sourceRoot":"","sources":["../../../../src/ai/reasoning/Reasoning.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { useId, useState } from 'react';\n\nimport { type CommonProps } from '../../_common/types';\nimport { ChevronDownIconOutline } from '../../icons/generated/heroIcons/ChevronDownIconOutline';\nimport { Presence } from '../presence';\nimport { formatThinkingDuration } from '../thinking/thinking-duration-formatter';\n\ntype ReasoningProps = {\n /** What should be displayed inside the reasoning component. */\n children?: React.ReactNode;\n /** Whether the AI is thinking */\n isThinking?: boolean;\n /** The duration of the thinking in milliseconds */\n thinkingMs?: number;\n /** The current action the AI is performing */\n currentAction?: string;\n};\n\n/**\n * The component is used to display the reasoning state of an LLM.\n * It has an accordion like behavior to show the reasoning steps.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst ReasoningComponent = ({\n isThinking = true,\n thinkingMs = 1000,\n currentAction = 'Thinking',\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', ReasoningProps>) => {\n const classes = classNames('ndl-ai-reasoning', className);\n const [isExpanded, setIsExpanded] = useState(false);\n const shouldShowChildren = isExpanded && isThinking === false;\n const buttonId = useId();\n const panelId = useId();\n\n const { value: thinkingDuration, unit } = formatThinkingDuration(thinkingMs);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <Typography\n variant=\"label\"\n className={classNames('ndl-ai-reasoning-header', {\n 'ndl-expanded': isExpanded,\n })}\n {...(!isThinking\n ? {\n as: 'button',\n htmlAttributes: {\n 'aria-controls': panelId,\n 'aria-expanded': isExpanded,\n id: buttonId,\n onClick: () => setIsExpanded(!isExpanded),\n type: 'button',\n },\n }\n : { as: 'div', htmlAttributes: { id: buttonId } })}\n >\n {isThinking === true ? (\n <>\n <Presence\n isThinking={isThinking}\n className=\"ndl-ai-reasoning-presence\"\n />\n <span className=\"ndl-ai-reasoning-header-text\">\n {currentAction}...\n </span>\n </>\n ) : (\n <>\n <span>\n Thought for {thinkingDuration} {unit}\n </span>\n <ChevronDownIconOutline\n className={classNames('ndl-ai-reasoning-chevron', {\n 'ndl-expanded': isExpanded,\n })}\n />\n </>\n )}\n </Typography>\n <div\n className={classNames('ndl-ai-reasoning-content', {\n 'ndl-expanded': shouldShowChildren,\n })}\n inert={!shouldShowChildren}\n aria-hidden={!shouldShowChildren}\n aria-labelledby={buttonId}\n role=\"region\"\n id={panelId}\n >\n <div className=\"ndl-ai-reasoning-content-inner\">\n <div className=\"ndl-ai-reasoning-content-inner-2\">{children}</div>\n </div>\n </div>\n </div>\n );\n};\n\ntype SectionProps = {\n /** The heading of the section */\n heading?: React.ReactNode;\n /** The children of the section */\n children?: React.ReactNode;\n /** The visual leading the section */\n leadingVisual?: React.ReactNode;\n // TODO v5: remove this prop\n /** Whether the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 */\n isExpanded?: boolean;\n // TODO v5: remove this prop\n /** The default value of the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 */\n isDefaultExpanded?: boolean;\n // TODO v5: remove this prop\n /** Callback function triggered when the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 */\n onExpandChange?: (isExpanded: boolean) => void;\n};\n\nconst Section = ({\n heading,\n leadingVisual,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n isExpanded: _isExpanded,\n isDefaultExpanded: _isDefaultExpanded,\n onExpandChange: _onExpandChange,\n ...restProps\n}: CommonProps<'div', SectionProps>) => {\n const classes = classNames('ndl-ai-reasoning-section', className);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"ndl-ai-reasoning-section-header\">\n <div className=\"ndl-ai-reasoning-section-leading\">{leadingVisual}</div>\n <Typography variant=\"subheading-small\">{heading}</Typography>\n </div>\n <div className=\"ndl-ai-reasoning-section-content\">\n <div className=\"ndl-ai-reasoning-section-content-line-container\">\n <div className=\"ndl-ai-reasoning-section-content-line\" />\n </div>\n <div className=\"ndl-ai-reasoning-section-content-children\">\n {children}\n </div>\n </div>\n </div>\n );\n};\n\nconst Footer = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-ai-reasoning-footer', className);\n return (\n <Typography\n as=\"div\"\n variant=\"body-small\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n};\n\nconst Reasoning = Object.assign(ReasoningComponent, {\n Footer,\n Section,\n});\n\nexport { Reasoning };\n"]}
|
|
@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
|
|
|
25
25
|
const react_1 = require("@neo4j-ndl/react");
|
|
26
26
|
const icons_1 = require("@neo4j-ndl/react/icons");
|
|
27
27
|
const Component = () => {
|
|
28
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "
|
|
28
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Small" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "medium", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Medium" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "large", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Large" })] })] }));
|
|
29
29
|
};
|
|
30
30
|
exports.default = Component;
|
|
31
31
|
//# sourceMappingURL=clean-icon-button-sizes.story.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"clean-icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAChD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"clean-icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAChD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,YACjD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAChD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { CleanIconButton, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"small\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"label\"> Small</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"medium\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"label\"> Medium</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"large\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"label\"> Large</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
|
|
|
25
25
|
const react_1 = require("@neo4j-ndl/react");
|
|
26
26
|
const icons_1 = require("@neo4j-ndl/react/icons");
|
|
27
27
|
const Component = () => {
|
|
28
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "
|
|
28
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: "Default" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", variant: "danger", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: "Danger" })] })] }));
|
|
29
29
|
};
|
|
30
30
|
exports.default = Component;
|
|
31
31
|
//# sourceMappingURL=clean-icon-button-tone.story.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"clean-icon-button-tone.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-tone.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,YACrD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"clean-icon-button-tone.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-tone.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,YACrD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,YACpD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { CleanIconButton, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" variant=\"neutral\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"label\">Default</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" variant=\"danger\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"label\">Danger</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -55,7 +55,7 @@ const DatePickerWithTimeZoneBothMode = () => {
|
|
|
55
55
|
flexDirection: 'column',
|
|
56
56
|
marginTop: '24px',
|
|
57
57
|
padding: '16px',
|
|
58
|
-
}, children: [(0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: "
|
|
58
|
+
}, children: [(0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: "label", children: "Selected Values:" }), (0, jsx_runtime_1.jsxs)(typography_1.Typography, { variant: "body-small", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Date: " }), (_a = selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.toISOString()) !== null && _a !== void 0 ? _a : 'None'] }), (0, jsx_runtime_1.jsxs)(typography_1.Typography, { variant: "body-small", children: [(0, jsx_runtime_1.jsx)("strong", { children: "Timezone:" }), " ", selectedTimeZone || 'None'] })] })] }));
|
|
59
59
|
};
|
|
60
60
|
exports.DatePickerWithTimeZoneBothMode = DatePickerWithTimeZoneBothMode;
|
|
61
61
|
exports.default = exports.DatePickerWithTimeZoneBothMode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker-with-timezone-both-mode.story.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/date-picker-with-timezone-both-mode.story.tsx"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,iCAAiC;AAEjC,iDAA8C;AAC9C,8CAA2C;AAEpC,MAAM,8BAA8B,GAAG,GAAG,EAAE;;IACjD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ;IAC9C,sCAAsC;IACtC,IAAI,IAAI,CAAC,YAAY,CAAC,CACvB,CAAC;IACF,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAC3C,IAAA,gBAAQ,EAAS,kBAAkB,CAAC,CAAC;IAEvC,OAAO,CACL,iCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,aAChD,uBAAC,uBAAU,IAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,qDAEhD,EACb,uBAAC,uBAAU,IAAC,OAAO,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,uKAIpD,EAEb,uBAAC,uBAAU,IACT,cAAc,EAAE;oBACd,KAAK,EAAE,oCAAoC;iBAC5C,EACD,eAAe,EAAE;oBACf,MAAM,EAAE,OAAO;iBAChB,EACD,mBAAmB,EAAE;oBACnB,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;wBACf,mBAAmB,CAAC,EAAE,CAAC,CAAC;oBAC1B,CAAC;oBACD,KAAK,EAAE,gBAAgB;iBACxB,EACD,oBAAoB,EAAE;oBACpB,UAAU,EAAE,kBAAkB;oBAC9B,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;wBACjB,eAAe,CAAC,IAAI,CAAC,CAAC;oBACxB,CAAC;oBACD,QAAQ,EAAE,YAAY;oBACtB,aAAa,EAAE,IAAI;iBACpB,GACD,EAEF,iCACE,KAAK,EAAE;oBACL,eAAe,EAAE,uCAAuC;oBACxD,YAAY,EAAE,KAAK;oBACnB,OAAO,EAAE,MAAM;oBACf,aAAa,EAAE,QAAQ;oBACvB,SAAS,EAAE,MAAM;oBACjB,OAAO,EAAE,MAAM;iBAChB,aAED,uBAAC,uBAAU,IAAC,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"date-picker-with-timezone-both-mode.story.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/date-picker-with-timezone-both-mode.story.tsx"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,iCAAiC;AAEjC,iDAA8C;AAC9C,8CAA2C;AAEpC,MAAM,8BAA8B,GAAG,GAAG,EAAE;;IACjD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ;IAC9C,sCAAsC;IACtC,IAAI,IAAI,CAAC,YAAY,CAAC,CACvB,CAAC;IACF,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAC3C,IAAA,gBAAQ,EAAS,kBAAkB,CAAC,CAAC;IAEvC,OAAO,CACL,iCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,aAChD,uBAAC,uBAAU,IAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,qDAEhD,EACb,uBAAC,uBAAU,IAAC,OAAO,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,uKAIpD,EAEb,uBAAC,uBAAU,IACT,cAAc,EAAE;oBACd,KAAK,EAAE,oCAAoC;iBAC5C,EACD,eAAe,EAAE;oBACf,MAAM,EAAE,OAAO;iBAChB,EACD,mBAAmB,EAAE;oBACnB,IAAI,EAAE,MAAM;oBACZ,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;wBACf,mBAAmB,CAAC,EAAE,CAAC,CAAC;oBAC1B,CAAC;oBACD,KAAK,EAAE,gBAAgB;iBACxB,EACD,oBAAoB,EAAE;oBACpB,UAAU,EAAE,kBAAkB;oBAC9B,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;wBACjB,eAAe,CAAC,IAAI,CAAC,CAAC;oBACxB,CAAC;oBACD,QAAQ,EAAE,YAAY;oBACtB,aAAa,EAAE,IAAI;iBACpB,GACD,EAEF,iCACE,KAAK,EAAE;oBACL,eAAe,EAAE,uCAAuC;oBACxD,YAAY,EAAE,KAAK;oBACnB,OAAO,EAAE,MAAM;oBACf,aAAa,EAAE,QAAQ;oBACvB,SAAS,EAAE,MAAM;oBACjB,OAAO,EAAE,MAAM;iBAChB,aAED,uBAAC,uBAAU,IAAC,OAAO,EAAC,OAAO,iCAA8B,EACzD,wBAAC,uBAAU,IAAC,OAAO,EAAC,YAAY,aAC9B,wDAAuB,EACtB,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,WAAW,EAAE,mCAAI,MAAM,IAC3B,EACb,wBAAC,uBAAU,IAAC,OAAO,EAAC,YAAY,aAC9B,2DAA0B,OAAE,gBAAgB,IAAI,MAAM,IAC3C,IACT,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAhEW,QAAA,8BAA8B,kCAgEzC;AAEF,kBAAe,sCAA8B,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { useState } from 'react';\n\nimport { Typography } from '../../typography';\nimport { DatePicker } from '../DatePicker';\n\nexport const DatePickerWithTimeZoneBothMode = () => {\n const [selectedDate, setSelectedDate] = useState<Date | null>(\n // Every day is Christmas in Needle :)\n new Date('2025-12-24'),\n );\n const [selectedTimeZone, setSelectedTimeZone] =\n useState<string>('America/New_York');\n\n return (\n <div style={{ maxWidth: '400px', padding: '20px' }}>\n <Typography variant=\"title-4\" style={{ marginBottom: '16px' }}>\n DatePicker with TimeZone (Both Mode)\n </Typography>\n <Typography variant=\"body-medium\" style={{ marginBottom: '24px' }}>\n This example shows the DatePicker with the TimeZonePicker in\n "both" mode, displaying both UTC offsets and city-based\n timezones in separate sections.\n </Typography>\n\n <DatePicker\n textInputProps={{\n label: 'Select Date and Time with Timezone',\n }}\n timePickerProps={{\n format: 'hh:mm',\n }}\n timeZonePickerProps={{\n mode: 'both',\n onChange: (tz) => {\n setSelectedTimeZone(tz);\n },\n value: selectedTimeZone,\n }}\n reactDatePickerProps={{\n dateFormat: 'yyyy-MM-dd hh:mm',\n onChange: (date) => {\n setSelectedDate(date);\n },\n selected: selectedDate,\n showTimeInput: true,\n }}\n />\n\n <div\n style={{\n backgroundColor: 'var(--theme-color-neutral-bg-default)',\n borderRadius: '4px',\n display: 'flex',\n flexDirection: 'column',\n marginTop: '24px',\n padding: '16px',\n }}\n >\n <Typography variant=\"label\">Selected Values:</Typography>\n <Typography variant=\"body-small\">\n <strong>Date: </strong>\n {selectedDate?.toISOString() ?? 'None'}\n </Typography>\n <Typography variant=\"body-small\">\n <strong>Timezone:</strong> {selectedTimeZone || 'None'}\n </Typography>\n </div>\n </div>\n );\n};\n\nexport default DatePickerWithTimeZoneBothMode;\n"]}
|
|
@@ -90,7 +90,7 @@ const Component = () => {
|
|
|
90
90
|
case UploadState.Success:
|
|
91
91
|
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32", children: [(0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", className: "n-text-success-text n-font-semibold", children: "Upload Complete!" }), (0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-small", className: "n-text-neutral-text-weak", children: ["Successfully uploaded: ", files.map((file) => file.name).join(', ')] }), (0, jsx_runtime_1.jsx)(react_1.FilledButton, { onClick: resetUpload, children: "Upload More Files" })] }));
|
|
92
92
|
case UploadState.Error:
|
|
93
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32", children: [(0, jsx_runtime_1.jsx)(solid_1.XMarkIcon, { className: "n-w-token-32 n-h-token-32 n-text-danger-text" }), (0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-col n-gap-y-token-2", children: errors.map((message, index) => ((0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "
|
|
93
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32", children: [(0, jsx_runtime_1.jsx)(solid_1.XMarkIcon, { className: "n-w-token-32 n-h-token-32 n-text-danger-text" }), (0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-col n-gap-y-token-2", children: errors.map((message, index) => ((0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", className: "n-text-danger-text n-font-semibold", htmlAttributes: { role: 'alert' }, children: message }, index))) }), (0, jsx_runtime_1.jsx)(react_1.FilledButton, { onClick: resetUpload, children: "Try Again" })] }));
|
|
94
94
|
default:
|
|
95
95
|
return undefined;
|
|
96
96
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropzone-full.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-full.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { XMarkIcon } from '@heroicons/react/24/solid';\nimport { Dropzone, FilledButton, Typography } from '@neo4j-ndl/react';\nimport { useCallback, useState } from 'react';\nimport {\n type DropEvent,\n type DropzoneOptions,\n type FileRejection,\n} from 'react-dropzone';\n\n// Configuration constants\nconst CONFIG = {\n ACCEPTED_EXTENSIONS: ['.txt', '.json'] as string[],\n MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n MAX_FILES: 3,\n PROGRESS_INCREMENT: 5,\n UPDATE_INTERVAL: 100,\n} as const;\n\nenum UploadState {\n Idle = 'idle',\n Uploading = 'uploading',\n Success = 'success',\n Error = 'error',\n}\n\ninterface UploadData {\n state: UploadState;\n progress: number;\n files: File[];\n errors: string[];\n}\n\nconst Component = () => {\n const [uploadData, setUploadData] = useState<UploadData>({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n\n const resetUpload = useCallback(() => {\n setUploadData({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n }, []);\n\n const simulateUpload = useCallback((files: File[]) => {\n setUploadData((prev) => ({\n ...prev,\n files,\n progress: 0,\n state: UploadState.Uploading,\n }));\n\n const interval = setInterval(() => {\n setUploadData((prev) => {\n const newProgress = prev.progress + CONFIG.PROGRESS_INCREMENT;\n if (newProgress >= 100) {\n clearInterval(interval);\n setTimeout(\n () =>\n setUploadData((current) => ({\n ...current,\n state: UploadState.Success,\n })),\n 500,\n );\n return { ...prev, progress: 100 };\n }\n return { ...prev, progress: newProgress };\n });\n }, CONFIG.UPDATE_INTERVAL);\n }, []);\n\n const handleDrop: DropzoneOptions['onDrop'] = useCallback(\n (\n acceptedFiles: File[],\n rejectedFiles: FileRejection[],\n event: DropEvent,\n ) => {\n console.info('Drop event:', { acceptedFiles, event, rejectedFiles });\n\n if (acceptedFiles.length > 0) {\n simulateUpload(acceptedFiles);\n }\n },\n [simulateUpload],\n );\n\n const handleDropRejected: DropzoneOptions['onDropRejected'] = useCallback(\n (rejectedFiles: FileRejection[]) => {\n const errors = rejectedFiles.map(\n (file) =>\n `${file.file.name}: ${file.errors.map((error) => error.message).join(', ')}`,\n );\n setUploadData((prev) => ({ ...prev, errors, state: UploadState.Error }));\n },\n [],\n );\n\n const handleError = useCallback((error: Error) => {\n console.error('Dropzone error:', error);\n setUploadData((prev) => ({\n ...prev,\n errors: [error.message],\n state: UploadState.Error,\n }));\n }, []);\n\n const renderStatusContent = () => {\n const { state, progress, files, errors } = uploadData;\n\n switch (state) {\n case UploadState.Uploading:\n return (\n <Dropzone.LoadingProgressBar\n progressBarPrecentage={Math.round(progress)}\n />\n );\n\n case UploadState.Success:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <Typography\n variant=\"title-4\"\n className=\"n-text-success-text n-font-semibold\"\n >\n Upload Complete!\n </Typography>\n <Typography\n variant=\"body-small\"\n className=\"n-text-neutral-text-weak\"\n >\n Successfully uploaded: {files.map((file) => file.name).join(', ')}\n </Typography>\n <FilledButton onClick={resetUpload}>Upload More Files</FilledButton>\n </div>\n );\n\n case UploadState.Error:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <XMarkIcon className=\"n-w-token-32 n-h-token-32 n-text-danger-text\" />\n <div className=\"n-flex n-flex-col n-gap-y-token-2\">\n {errors.map((message, index) => (\n <Typography\n key={index}\n variant=\"title-4\"\n className=\"n-text-danger-text n-font-semibold\"\n htmlAttributes={{ role: 'alert' }}\n >\n {message}\n </Typography>\n ))}\n </div>\n <FilledButton onClick={resetUpload}>Try Again</FilledButton>\n </div>\n );\n\n default:\n return undefined;\n }\n };\n\n return (\n <Dropzone\n dropZoneOptions={{\n disabled: uploadData.state === UploadState.Uploading,\n maxFiles: CONFIG.MAX_FILES,\n maxSize: CONFIG.MAX_FILE_SIZE,\n multiple: true,\n onDrop: handleDrop,\n onDropRejected: handleDropRejected,\n onError: handleError,\n }}\n supportedFilesDescription={\n <div className=\"n-text-center n-flex n-flex-col n-gap-y-token-2\">\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Supports: Text files (.txt, .json) only\n </Typography>\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Max {CONFIG.MAX_FILES} files •{' '}\n {CONFIG.MAX_FILE_SIZE / (1024 * 1024)}MB per file\n </Typography>\n </div>\n }\n acceptedFileExtensions={CONFIG.ACCEPTED_EXTENSIONS}\n loadingElement={renderStatusContent()}\n rejectedText=\"Error: Please make sure to only upload .json or .txt files\"\n heading=\"Drag & Drop your files\"\n />\n );\n};\n\nexport default Component;\n"]}
|
|
1
|
+
{"version":3,"file":"dropzone-full.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-full.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { XMarkIcon } from '@heroicons/react/24/solid';\nimport { Dropzone, FilledButton, Typography } from '@neo4j-ndl/react';\nimport { useCallback, useState } from 'react';\nimport {\n type DropEvent,\n type DropzoneOptions,\n type FileRejection,\n} from 'react-dropzone';\n\n// Configuration constants\nconst CONFIG = {\n ACCEPTED_EXTENSIONS: ['.txt', '.json'] as string[],\n MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n MAX_FILES: 3,\n PROGRESS_INCREMENT: 5,\n UPDATE_INTERVAL: 100,\n} as const;\n\nenum UploadState {\n Idle = 'idle',\n Uploading = 'uploading',\n Success = 'success',\n Error = 'error',\n}\n\ninterface UploadData {\n state: UploadState;\n progress: number;\n files: File[];\n errors: string[];\n}\n\nconst Component = () => {\n const [uploadData, setUploadData] = useState<UploadData>({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n\n const resetUpload = useCallback(() => {\n setUploadData({\n errors: [],\n files: [],\n progress: 0,\n state: UploadState.Idle,\n });\n }, []);\n\n const simulateUpload = useCallback((files: File[]) => {\n setUploadData((prev) => ({\n ...prev,\n files,\n progress: 0,\n state: UploadState.Uploading,\n }));\n\n const interval = setInterval(() => {\n setUploadData((prev) => {\n const newProgress = prev.progress + CONFIG.PROGRESS_INCREMENT;\n if (newProgress >= 100) {\n clearInterval(interval);\n setTimeout(\n () =>\n setUploadData((current) => ({\n ...current,\n state: UploadState.Success,\n })),\n 500,\n );\n return { ...prev, progress: 100 };\n }\n return { ...prev, progress: newProgress };\n });\n }, CONFIG.UPDATE_INTERVAL);\n }, []);\n\n const handleDrop: DropzoneOptions['onDrop'] = useCallback(\n (\n acceptedFiles: File[],\n rejectedFiles: FileRejection[],\n event: DropEvent,\n ) => {\n console.info('Drop event:', { acceptedFiles, event, rejectedFiles });\n\n if (acceptedFiles.length > 0) {\n simulateUpload(acceptedFiles);\n }\n },\n [simulateUpload],\n );\n\n const handleDropRejected: DropzoneOptions['onDropRejected'] = useCallback(\n (rejectedFiles: FileRejection[]) => {\n const errors = rejectedFiles.map(\n (file) =>\n `${file.file.name}: ${file.errors.map((error) => error.message).join(', ')}`,\n );\n setUploadData((prev) => ({ ...prev, errors, state: UploadState.Error }));\n },\n [],\n );\n\n const handleError = useCallback((error: Error) => {\n console.error('Dropzone error:', error);\n setUploadData((prev) => ({\n ...prev,\n errors: [error.message],\n state: UploadState.Error,\n }));\n }, []);\n\n const renderStatusContent = () => {\n const { state, progress, files, errors } = uploadData;\n\n switch (state) {\n case UploadState.Uploading:\n return (\n <Dropzone.LoadingProgressBar\n progressBarPrecentage={Math.round(progress)}\n />\n );\n\n case UploadState.Success:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <Typography\n variant=\"title-4\"\n className=\"n-text-success-text n-font-semibold\"\n >\n Upload Complete!\n </Typography>\n <Typography\n variant=\"body-small\"\n className=\"n-text-neutral-text-weak\"\n >\n Successfully uploaded: {files.map((file) => file.name).join(', ')}\n </Typography>\n <FilledButton onClick={resetUpload}>Upload More Files</FilledButton>\n </div>\n );\n\n case UploadState.Error:\n return (\n <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n <XMarkIcon className=\"n-w-token-32 n-h-token-32 n-text-danger-text\" />\n <div className=\"n-flex n-flex-col n-gap-y-token-2\">\n {errors.map((message, index) => (\n <Typography\n key={index}\n variant=\"label\"\n className=\"n-text-danger-text n-font-semibold\"\n htmlAttributes={{ role: 'alert' }}\n >\n {message}\n </Typography>\n ))}\n </div>\n <FilledButton onClick={resetUpload}>Try Again</FilledButton>\n </div>\n );\n\n default:\n return undefined;\n }\n };\n\n return (\n <Dropzone\n dropZoneOptions={{\n disabled: uploadData.state === UploadState.Uploading,\n maxFiles: CONFIG.MAX_FILES,\n maxSize: CONFIG.MAX_FILE_SIZE,\n multiple: true,\n onDrop: handleDrop,\n onDropRejected: handleDropRejected,\n onError: handleError,\n }}\n supportedFilesDescription={\n <div className=\"n-text-center n-flex n-flex-col n-gap-y-token-2\">\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Supports: Text files (.txt, .json) only\n </Typography>\n <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n Max {CONFIG.MAX_FILES} files •{' '}\n {CONFIG.MAX_FILE_SIZE / (1024 * 1024)}MB per file\n </Typography>\n </div>\n }\n acceptedFileExtensions={CONFIG.ACCEPTED_EXTENSIONS}\n loadingElement={renderStatusContent()}\n rejectedText=\"Error: Please make sure to only upload .json or .txt files\"\n heading=\"Drag & Drop your files\"\n />\n );\n};\n\nexport default Component;\n"]}
|
package/lib/cjs/helpers/index.js
CHANGED
|
@@ -35,4 +35,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
35
35
|
};
|
|
36
36
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
37
|
__exportStar(require("./debounce"), exports);
|
|
38
|
+
__exportStar(require("./platform"), exports);
|
|
38
39
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/helpers/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;;;;;AAEH,6CAA2B","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport * from './debounce';\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/helpers/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;;;;;AAEH,6CAA2B;AAC3B,6CAA2B","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport * from './debounce';\nexport * from './platform';\n"]}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) "Neo4j"
|
|
5
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
6
|
+
*
|
|
7
|
+
* This file is part of Neo4j.
|
|
8
|
+
*
|
|
9
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
10
|
+
* it under the terms of the GNU General Public License as published by
|
|
11
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
12
|
+
* (at your option) any later version.
|
|
13
|
+
*
|
|
14
|
+
* This program is distributed in the hope that it will be useful,
|
|
15
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
16
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
17
|
+
* GNU General Public License for more details.
|
|
18
|
+
*
|
|
19
|
+
* You should have received a copy of the GNU General Public License
|
|
20
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
21
|
+
*/
|
|
22
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
23
|
+
exports.detectOS = detectOS;
|
|
24
|
+
exports.isApplePlatform = isApplePlatform;
|
|
25
|
+
/**
|
|
26
|
+
* `navigator.platform` comes first because it describes the machine the
|
|
27
|
+
* keyboard is attached to, while the user agent and its client hints can be
|
|
28
|
+
* pinned to another platform by the embedder.
|
|
29
|
+
*/
|
|
30
|
+
function getPlatformHint() {
|
|
31
|
+
var _a;
|
|
32
|
+
if (typeof navigator === 'undefined') {
|
|
33
|
+
return '';
|
|
34
|
+
}
|
|
35
|
+
const navigatorWithHints = navigator;
|
|
36
|
+
return (navigator.platform ||
|
|
37
|
+
((_a = navigatorWithHints.userAgentData) === null || _a === void 0 ? void 0 : _a.platform) ||
|
|
38
|
+
navigator.userAgent ||
|
|
39
|
+
'');
|
|
40
|
+
}
|
|
41
|
+
/** Detects the operating system the keyboard is attached to. */
|
|
42
|
+
function detectOS() {
|
|
43
|
+
const platform = getPlatformHint();
|
|
44
|
+
if (/mac|iphone|ipad|ipod/i.test(platform)) {
|
|
45
|
+
return 'mac';
|
|
46
|
+
}
|
|
47
|
+
if (/win/i.test(platform)) {
|
|
48
|
+
return 'windows';
|
|
49
|
+
}
|
|
50
|
+
return 'linux';
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* Apple platforms take `Cmd` where the rest take `Ctrl`, since `Ctrl` + click
|
|
54
|
+
* is the macOS context menu gesture.
|
|
55
|
+
*/
|
|
56
|
+
function isApplePlatform() {
|
|
57
|
+
return detectOS() === 'mac';
|
|
58
|
+
}
|
|
59
|
+
//# sourceMappingURL=platform.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"platform.js","sourceRoot":"","sources":["../../../src/helpers/platform.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;AAyBH,4BASC;AAMD,0CAEC;AAtCD;;;;GAIG;AACH,SAAS,eAAe;;IACtB,IAAI,OAAO,SAAS,KAAK,WAAW,EAAE,CAAC;QACrC,OAAO,EAAE,CAAC;IACZ,CAAC;IACD,MAAM,kBAAkB,GAAG,SAE1B,CAAC;IACF,OAAO,CACL,SAAS,CAAC,QAAQ;SAClB,MAAA,kBAAkB,CAAC,aAAa,0CAAE,QAAQ,CAAA;QAC1C,SAAS,CAAC,SAAS;QACnB,EAAE,CACH,CAAC;AACJ,CAAC;AAED,gEAAgE;AAChE,SAAgB,QAAQ;IACtB,MAAM,QAAQ,GAAG,eAAe,EAAE,CAAC;IACnC,IAAI,uBAAuB,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC3C,OAAO,KAAK,CAAC;IACf,CAAC;IACD,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC1B,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;;GAGG;AACH,SAAgB,eAAe;IAC7B,OAAO,QAAQ,EAAE,KAAK,KAAK,CAAC;AAC9B,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport type OperatingSystem = 'mac' | 'windows' | 'linux';\n\n/**\n * `navigator.platform` comes first because it describes the machine the\n * keyboard is attached to, while the user agent and its client hints can be\n * pinned to another platform by the embedder.\n */\nfunction getPlatformHint(): string {\n if (typeof navigator === 'undefined') {\n return '';\n }\n const navigatorWithHints = navigator as Navigator & {\n userAgentData?: { platform?: string };\n };\n return (\n navigator.platform ||\n navigatorWithHints.userAgentData?.platform ||\n navigator.userAgent ||\n ''\n );\n}\n\n/** Detects the operating system the keyboard is attached to. */\nexport function detectOS(): OperatingSystem {\n const platform = getPlatformHint();\n if (/mac|iphone|ipad|ipod/i.test(platform)) {\n return 'mac';\n }\n if (/win/i.test(platform)) {\n return 'windows';\n }\n return 'linux';\n}\n\n/**\n * Apple platforms take `Cmd` where the rest take `Ctrl`, since `Ctrl` + click\n * is the macOS context menu gesture.\n */\nexport function isApplePlatform(): boolean {\n return detectOS() === 'mac';\n}\n"]}
|
|
@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
|
|
|
25
25
|
const react_1 = require("@neo4j-ndl/react");
|
|
26
26
|
const icons_1 = require("@neo4j-ndl/react/icons");
|
|
27
27
|
const Component = () => {
|
|
28
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { description: "Search", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "
|
|
28
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { description: "Search", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Small" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { description: "Search", size: "medium", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Medium" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { description: "Search", size: "large", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Large" })] })] }));
|
|
29
29
|
};
|
|
30
30
|
exports.default = Component;
|
|
31
31
|
//# sourceMappingURL=icon-button-sizes.story.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/icon-button/stories/icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0D;AAC1D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,kBAAU,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAC3C,uBAAC,kCAA0B,KAAG,GACnB,EACb,uBAAC,kBAAU,IAAC,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/icon-button/stories/icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0D;AAC1D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,kBAAU,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAC3C,uBAAC,kCAA0B,KAAG,GACnB,EACb,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,kBAAU,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,YAC5C,uBAAC,kCAA0B,KAAG,GACnB,EACb,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,kBAAU,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAC3C,uBAAC,kCAA0B,KAAG,GACnB,EACb,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { IconButton, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <IconButton description=\"Search\" size=\"small\">\n <MagnifyingGlassIconOutline />\n </IconButton>\n <Typography variant=\"label\"> Small</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <IconButton description=\"Search\" size=\"medium\">\n <MagnifyingGlassIconOutline />\n </IconButton>\n <Typography variant=\"label\"> Medium</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <IconButton description=\"Search\" size=\"large\">\n <MagnifyingGlassIconOutline />\n </IconButton>\n <Typography variant=\"label\"> Large</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
|
|
|
25
25
|
const react_1 = require("@neo4j-ndl/react");
|
|
26
26
|
const icons_1 = require("@neo4j-ndl/react/icons");
|
|
27
27
|
const Component = () => {
|
|
28
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { description: "Search", variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "
|
|
28
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { description: "Search", variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: "Default" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.IconButton, { description: "Search", variant: "danger", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: "Danger" })] })] }));
|
|
29
29
|
};
|
|
30
30
|
exports.default = Component;
|
|
31
31
|
//# sourceMappingURL=icon-button-tone.story.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button-tone.story.js","sourceRoot":"","sources":["../../../../src/icon-button/stories/icon-button-tone.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0D;AAC1D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,kBAAU,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,YAChD,uBAAC,kCAA0B,KAAG,GACnB,EACb,uBAAC,kBAAU,IAAC,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"icon-button-tone.story.js","sourceRoot":"","sources":["../../../../src/icon-button/stories/icon-button-tone.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0D;AAC1D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,kBAAU,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,YAChD,uBAAC,kCAA0B,KAAG,GACnB,EACb,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,kBAAU,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,YAC/C,uBAAC,kCAA0B,KAAG,GACnB,EACb,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { IconButton, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <IconButton description=\"Search\" variant=\"neutral\">\n <MagnifyingGlassIconOutline />\n </IconButton>\n <Typography variant=\"label\">Default</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <IconButton description=\"Search\" variant=\"danger\">\n <MagnifyingGlassIconOutline />\n </IconButton>\n <Typography variant=\"label\">Danger</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
|
package/lib/cjs/kbd/kbd-utils.js
CHANGED
|
@@ -21,32 +21,16 @@
|
|
|
21
21
|
|
|
22
22
|
"use strict";
|
|
23
23
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
24
|
-
exports.detectOS =
|
|
24
|
+
exports.detectOS = void 0;
|
|
25
25
|
exports.getKbdKeysMap = getKbdKeysMap;
|
|
26
26
|
exports.getKbdKeysLabelMap = getKbdKeysLabelMap;
|
|
27
27
|
exports.getKbdScreenReaderFriendlyText = getKbdScreenReaderFriendlyText;
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
*/
|
|
31
|
-
function detectOS() {
|
|
32
|
-
if (typeof window === 'undefined') {
|
|
33
|
-
return 'linux';
|
|
34
|
-
}
|
|
35
|
-
const userAgent = window.navigator.userAgent.toLowerCase();
|
|
36
|
-
if (userAgent.includes('mac')) {
|
|
37
|
-
return 'mac';
|
|
38
|
-
}
|
|
39
|
-
else if (userAgent.includes('win')) {
|
|
40
|
-
return 'windows';
|
|
41
|
-
}
|
|
42
|
-
else {
|
|
43
|
-
return 'linux';
|
|
44
|
-
}
|
|
45
|
-
}
|
|
28
|
+
const platform_1 = require("../helpers/platform");
|
|
29
|
+
Object.defineProperty(exports, "detectOS", { enumerable: true, get: function () { return platform_1.detectOS; } });
|
|
46
30
|
/**
|
|
47
31
|
* Returns OS-aware keyboard key symbols
|
|
48
32
|
*/
|
|
49
|
-
function getKbdKeysMap(os = detectOS()) {
|
|
33
|
+
function getKbdKeysMap(os = (0, platform_1.detectOS)()) {
|
|
50
34
|
const baseMap = {
|
|
51
35
|
alt: os === 'mac' ? '⌥' : 'alt',
|
|
52
36
|
capslock: '⇪',
|
|
@@ -73,7 +57,7 @@ function getKbdKeysMap(os = detectOS()) {
|
|
|
73
57
|
/**
|
|
74
58
|
* Returns OS-aware keyboard key labels
|
|
75
59
|
*/
|
|
76
|
-
function getKbdKeysLabelMap(os = detectOS()) {
|
|
60
|
+
function getKbdKeysLabelMap(os = (0, platform_1.detectOS)()) {
|
|
77
61
|
return {
|
|
78
62
|
alt: 'Alt',
|
|
79
63
|
capslock: 'Caps Lock',
|
|
@@ -108,7 +92,7 @@ function resolveKeyLabel(key, labels) {
|
|
|
108
92
|
}
|
|
109
93
|
return '';
|
|
110
94
|
}
|
|
111
|
-
function getKbdScreenReaderFriendlyText(keys, modifierKeys, os = detectOS()) {
|
|
95
|
+
function getKbdScreenReaderFriendlyText(keys, modifierKeys, os = (0, platform_1.detectOS)()) {
|
|
112
96
|
const labels = getKbdKeysLabelMap(os);
|
|
113
97
|
const modStr = (modifierKeys !== null && modifierKeys !== void 0 ? modifierKeys : []).map((key) => labels[key]).join(' + ');
|
|
114
98
|
const keyLabels = (keys !== null && keys !== void 0 ? keys : [])
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kbd-utils.js","sourceRoot":"","sources":["../../../src/kbd/kbd-utils.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"kbd-utils.js","sourceRoot":"","sources":["../../../src/kbd/kbd-utils.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport type { ReactNode } from 'react';\n\nimport { detectOS, type OperatingSystem } from '../helpers/platform';\n\nexport { detectOS, type OperatingSystem };\n\nexport type KbdKey =\n | 'meta'\n | 'shift'\n | 'ctrl'\n | 'enter'\n | 'delete'\n | 'escape'\n | 'tab'\n | 'capslock'\n | 'up'\n | 'right'\n | 'down'\n | 'left'\n | 'pageup'\n | 'pagedown'\n | 'home'\n | 'end'\n | 'space'\n | 'fn'\n | 'alt';\n\n/**\n * Returns OS-aware keyboard key symbols\n */\nexport function getKbdKeysMap(\n os: OperatingSystem = detectOS(),\n): Record<KbdKey, string> {\n const baseMap: Record<KbdKey, string> = {\n alt: os === 'mac' ? '⌥' : 'alt',\n capslock: '⇪',\n ctrl: os === 'mac' ? '⌃' : 'ctrl',\n delete: os === 'mac' ? '⌫' : 'delete',\n down: '↓',\n end: 'end',\n enter: '↵',\n escape: '⎋',\n fn: 'Fn',\n home: 'home',\n left: '←',\n meta: os === 'mac' ? '⌘' : os === 'windows' ? '⊞' : 'meta',\n pagedown: '⇟',\n pageup: '⇞',\n right: '→',\n shift: '⇧',\n space: '␣',\n tab: '⇥',\n up: '↑',\n };\n\n return baseMap;\n}\n\n/**\n * Returns OS-aware keyboard key labels\n */\nexport function getKbdKeysLabelMap(\n os: OperatingSystem = detectOS(),\n): Record<KbdKey, string> {\n return {\n alt: 'Alt',\n capslock: 'Caps Lock',\n ctrl: 'Control',\n delete: 'Delete',\n down: 'Down',\n end: 'End',\n enter: 'Enter',\n escape: 'Escape',\n fn: 'Fn',\n home: 'Home',\n left: 'Left',\n meta: os === 'mac' ? 'Command' : os === 'windows' ? 'Windows' : 'Meta',\n pagedown: 'Page Down',\n pageup: 'Page Up',\n right: 'Right',\n shift: 'Shift',\n space: 'Space',\n tab: 'Tab',\n up: 'Up',\n };\n}\n\nfunction resolveKeyLabel(\n key: KbdKey | ReactNode,\n labels: Record<KbdKey, string>,\n): string {\n if (key === null || key === undefined || typeof key === 'boolean') {\n return '';\n }\n if (typeof key === 'string') {\n return key in labels ? labels[key as KbdKey] : key;\n }\n if (typeof key === 'number') {\n return String(key);\n }\n return '';\n}\n\nexport function getKbdScreenReaderFriendlyText(\n keys: readonly (KbdKey | ReactNode)[] | undefined,\n modifierKeys: readonly KbdKey[] | undefined,\n os: OperatingSystem = detectOS(),\n): string {\n const labels = getKbdKeysLabelMap(os);\n const modStr = (modifierKeys ?? []).map((key) => labels[key]).join(' + ');\n const keyLabels = (keys ?? [])\n .map((key) => resolveKeyLabel(key, labels))\n .filter(Boolean);\n let keyStr = '';\n if (keyLabels.length === 1) {\n keyStr = keyLabels[0];\n } else if (keyLabels.length > 1) {\n keyStr = keyLabels.join(' then ');\n }\n const body = [modStr, keyStr].filter(Boolean).join(' + ');\n return body ? `Shortcut: ${body}` : '';\n}\n"]}
|