impact-ui 4.0.14-alpha.1 → 4.0.14-alpha.3
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/README.md +1 -3
- package/dist/_virtual/index15.js +2 -2
- package/dist/_virtual/index16.js +2 -2
- package/dist/_virtual/index2.js +2 -2
- package/dist/_virtual/index3.js +2 -2
- package/dist/components/Chatbot/index.d.ts.map +1 -1
- package/dist/components/Chatbot/index.js +7 -2
- package/dist/components/CommentsPanel/CommentsPanel.impl.d.ts +2 -6
- package/dist/components/CommentsPanel/CommentsPanel.impl.d.ts.map +1 -1
- package/dist/components/CommentsPanel/CommentsPanel.impl.js +6 -1
- package/dist/components/CommentsPanel/CommentsPanel.types.d.ts +2 -2
- package/dist/components/CommentsPanel/CommentsPanel.types.d.ts.map +1 -1
- package/dist/components/CreateItemFlow/CreateItemFlow.types.d.ts +16 -39
- package/dist/components/CreateItemFlow/CreateItemFlow.types.d.ts.map +1 -1
- package/dist/components/CreateItemFlow/index.d.ts +1 -2
- package/dist/components/CreateItemFlow/index.d.ts.map +1 -1
- package/dist/components/CreateItemFlow/index.js +66 -116
- package/dist/components/DynamicLayout/index.d.ts +11 -9
- package/dist/components/DynamicLayout/index.d.ts.map +1 -1
- package/dist/components/DynamicLayout/index.js +34 -37
- package/dist/components/Header/index.js +2 -2
- package/dist/components/HomePage/index.d.ts.map +1 -1
- package/dist/components/HomePage/index.js +5 -7
- package/dist/components/KeyboardShortCuts/ShortcutLandingPage.js +1 -1
- package/dist/components/KeyboardShortCuts/ShortcutModal.js +1 -1
- package/dist/components/KeyboardShortCuts/allSetBox.js +1 -1
- package/dist/components/KeyboardShortCuts/index.d.ts.map +1 -1
- package/dist/components/KeyboardShortCuts/index.js +38 -112
- package/dist/components/KeyboardShortCuts/tutorial.js +1 -1
- package/dist/components/Menu/IconMenuItem.d.ts.map +1 -1
- package/dist/components/Menu/IconMenuItem.js +2 -1
- package/dist/components/Menu/MenuHeaderInfo.js +1 -1
- package/dist/components/Menu/NestedMenuItem.js +2 -2
- package/dist/components/Menu/index.js +1 -1
- package/dist/components/Menu/nestedMenuItemsFromObject.js +1 -1
- package/dist/components/OnboardingTour/index.d.ts +61 -0
- package/dist/components/OnboardingTour/index.d.ts.map +1 -0
- package/dist/components/OnboardingTour/index.js +232 -0
- package/dist/components/OnboardingTour/productTourList.d.ts +39 -0
- package/dist/components/OnboardingTour/productTourList.d.ts.map +1 -0
- package/dist/components/OnboardingTour/productTourList.js +86 -0
- package/dist/components/OnboardingTour/tooltipCard.d.ts +45 -0
- package/dist/components/OnboardingTour/tooltipCard.d.ts.map +1 -0
- package/dist/components/OnboardingTour/tooltipCard.js +96 -0
- package/dist/components/OnboardingTour/useTooltipCardPosition.d.ts +29 -0
- package/dist/components/OnboardingTour/useTooltipCardPosition.d.ts.map +1 -0
- package/dist/components/OnboardingTour/useTooltipCardPosition.js +221 -0
- package/dist/components/RadioButtonGroup/index.js +1 -1
- package/dist/components/TableV36/AdvanceSearchModalItem.d.ts +29 -0
- package/dist/components/TableV36/AdvanceSearchModalItem.d.ts.map +1 -0
- package/dist/components/TableV36/AdvanceSortModal.d.ts +10 -0
- package/dist/components/TableV36/AdvanceSortModal.d.ts.map +1 -0
- package/dist/components/TableV36/AdvanceSortModal.js +297 -0
- package/dist/components/TableV36/AgGridHeader.d.ts +16 -0
- package/dist/components/TableV36/AgGridHeader.d.ts.map +1 -0
- package/dist/components/TableV36/AgGridHeader.js +799 -0
- package/dist/components/TableV36/AgGridHeaderGroup.d.ts +3 -0
- package/dist/components/TableV36/AgGridHeaderGroup.d.ts.map +1 -0
- package/dist/components/TableV36/AgGridHeaderGroup.js +27 -0
- package/dist/components/TableV36/CellTooltip.d.ts +14 -0
- package/dist/components/TableV36/CellTooltip.d.ts.map +1 -0
- package/dist/components/TableV36/CellTooltip.js +11 -0
- package/dist/components/TableV36/CommentsPortal.d.ts +31 -0
- package/dist/components/TableV36/CommentsPortal.d.ts.map +1 -0
- package/dist/components/TableV36/CommentsPortal.js +357 -0
- package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModal.d.ts +15 -0
- package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModal.d.ts.map +1 -0
- package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModal.js +282 -0
- package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModalItem.d.ts +18 -0
- package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModalItem.d.ts.map +1 -0
- package/dist/components/TableV36/NewAdvanceSearchModal/NewAdvanceSearchModalItem.js +302 -0
- package/dist/components/TableV36/NoComments.d.ts +18 -0
- package/dist/components/TableV36/NoComments.d.ts.map +1 -0
- package/dist/components/TableV36/NoComments.js +236 -0
- package/dist/components/TableV36/Table.types.d.ts +97 -0
- package/dist/components/TableV36/Table.types.d.ts.map +1 -0
- package/dist/components/TableV36/actionBar.d.ts +9 -0
- package/dist/components/TableV36/actionBar.d.ts.map +1 -0
- package/dist/components/TableV36/actionBar.js +31 -0
- package/dist/components/TableV36/advanceSearchModal.d.ts +22 -0
- package/dist/components/TableV36/advanceSearchModal.d.ts.map +1 -0
- package/dist/components/TableV36/filterUtils.d.ts +133 -0
- package/dist/components/TableV36/filterUtils.d.ts.map +1 -0
- package/dist/components/TableV36/filterUtils.js +478 -0
- package/dist/components/TableV36/index.d.ts +3 -0
- package/dist/components/TableV36/index.d.ts.map +1 -0
- package/dist/components/TableV36/index.js +1670 -0
- package/dist/components/TableV36/mockData.d.ts +39 -0
- package/dist/components/TableV36/mockData.d.ts.map +1 -0
- package/dist/components/TableV36/tableFunctions.d.ts +61 -0
- package/dist/components/TableV36/tableFunctions.d.ts.map +1 -0
- package/dist/components/TableV36/tableFunctions.js +1876 -0
- package/dist/components/TableV36/tableHeader.d.ts +82 -0
- package/dist/components/TableV36/tableHeader.d.ts.map +1 -0
- package/dist/components/TableV36/tableHeader.js +396 -0
- package/dist/components/TableV36/tableIcons.d.ts +5 -0
- package/dist/components/TableV36/tableIcons.d.ts.map +1 -0
- package/dist/components/TableV36/tableMoreOptions.d.ts +54 -0
- package/dist/components/TableV36/tableMoreOptions.d.ts.map +1 -0
- package/dist/components/TableV36/tableMoreOptions.js +324 -0
- package/dist/components/TableV36/tablePagination.d.ts +9 -0
- package/dist/components/TableV36/tablePagination.d.ts.map +1 -0
- package/dist/components/TableV36/tablePagination.js +67 -0
- package/dist/components/TableV36/tableSettings.d.ts +43 -0
- package/dist/components/TableV36/tableSettings.d.ts.map +1 -0
- package/dist/components/TableV36/tableSettings.js +317 -0
- package/dist/components/TableV36/tableUtils.d.ts +11 -0
- package/dist/components/TableV36/tableUtils.d.ts.map +1 -0
- package/dist/components/TableV36/tableUtils.js +31 -0
- package/dist/components/TableV36/withCommentIcon.d.ts +13 -0
- package/dist/components/TableV36/withCommentIcon.d.ts.map +1 -0
- package/dist/components/TableV36/withCommentIcon.js +125 -0
- package/dist/components/index.d.ts +4 -5
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +4 -4
- package/dist/i18n/I18nContext.d.ts.map +1 -1
- package/dist/i18n/I18nContext.js +1 -0
- package/dist/locales/es-ES.json.d.ts +666 -0
- package/dist/locales/es-ES.json.js +599 -0
- package/dist/locales/index.d.ts.map +1 -1
- package/dist/locales/index.js +11 -3
- package/dist/mcp-component-registry.json +942 -93
- package/dist/node_modules/@impactsmartsuite/impact-icons/dist/index.js +9 -3
- package/dist/node_modules/hoist-non-react-statics/node_modules/react-is/index.js +1 -1
- package/dist/node_modules/is-symbol/index.js +1 -1
- package/dist/node_modules/moment/dist/locale/de.js +21 -1
- package/dist/node_modules/moment/dist/locale/es.js +98 -0
- package/dist/node_modules/moment/dist/moment.js +792 -624
- package/dist/node_modules/prop-types/index.js +1 -1
- package/dist/node_modules/react-is/index.js +1 -1
- package/dist/stories/LocaleDictionaryCollapse.d.ts.map +1 -1
- package/package.json +7 -2
- package/dist/components/NewCreateItemFlow/NewCreateItemFlow.types.d.ts +0 -21
- package/dist/components/NewCreateItemFlow/NewCreateItemFlow.types.d.ts.map +0 -1
- package/dist/components/NewCreateItemFlow/index.d.ts +0 -5
- package/dist/components/NewCreateItemFlow/index.d.ts.map +0 -1
- package/dist/components/NewCreateItemFlow/index.js +0 -93
- package/dist/components/NewDynamicLayout/NewDynamicLayout.types.d.ts +0 -26
- package/dist/components/NewDynamicLayout/NewDynamicLayout.types.d.ts.map +0 -1
- package/dist/components/NewDynamicLayout/index.d.ts +0 -15
- package/dist/components/NewDynamicLayout/index.d.ts.map +0 -1
- package/dist/components/NewDynamicLayout/index.js +0 -45
package/README.md
CHANGED
|
@@ -130,7 +130,6 @@ Live names from the **impact-ui MCP** `list_components` tool, plus source-only p
|
|
|
130
130
|
| `Stepper` | Wizard progress | `StepperStep[]` |
|
|
131
131
|
| `Accordion` / `AccordionModern` | Collapsible | Modern supports sortable items |
|
|
132
132
|
| `DynamicLayout` | Layout slots | Injected layout props |
|
|
133
|
-
| `NewDynamicLayout` | Layout slots | Injected layout props |
|
|
134
133
|
| `AGLocaleMap` | Grid locales | From i18n exports |
|
|
135
134
|
|
|
136
135
|
### 💬 Feedback & overlays
|
|
@@ -164,7 +163,6 @@ Live names from the **impact-ui MCP** `list_components` tool, plus source-only p
|
|
|
164
163
|
| `FilterPanelHeader` / `PanelSidebar` / `PanelFooter` | Filter chrome | Companion exports |
|
|
165
164
|
| `Notification` | Inbox drawer | List, tasks, tabs |
|
|
166
165
|
| `CreateItemFlow` | Create wizard | Multi-step |
|
|
167
|
-
| `NewCreateItemFlow` | Create wizard | Multi-step |
|
|
168
166
|
| `CommentsPanel` | Threads | `CommentsProvider`, `useComments` |
|
|
169
167
|
|
|
170
168
|
### 🤖 Chat, i18n & shortcuts
|
|
@@ -177,7 +175,7 @@ Live names from the **impact-ui MCP** `list_components` tool, plus source-only p
|
|
|
177
175
|
| `ShortcutsProvider` / `ShortcutScope` / `ShortcutHint` / `ShortcutManager` | Hotkeys | Config + display helpers |
|
|
178
176
|
| `KeyboardShortcuts` / `ShortcutModal` | Shortcut UI | List & capture |
|
|
179
177
|
|
|
180
|
-
**MCP names (components):** AGLocaleMap, Accordion, AccordionModern, Alert, AppliedFilters, Avatar, Badge, BottomSheet, Breadcrumbs, Button, ButtonGroup, Card, Chart, ChatBotComponent, Checkbox, Chips, CommentsContext, CommentsProvider, CreateItemFlow,
|
|
178
|
+
**MCP names (components):** AGLocaleMap, Accordion, AccordionModern, Alert, AppliedFilters, Avatar, Badge, BottomSheet, Breadcrumbs, Button, ButtonGroup, Card, Chart, ChatBotComponent, Checkbox, Chips, CommentsContext, CommentsProvider, CreateItemFlow, DatePicker, DateRangePicker, DynamicLayout, EmptyState, FileUpload, FilterDropDown, FilterPanel, FilterPanelHeader, FilterSlider, HelperText, I18nContext, I18nProvider, Input, KeyboardShortcuts, Loader, Menu, MenuHeaderInfo, Modal, MonthPicker, MonthRangePicker, OldTable, Panel, PanelFooter, PanelSidebar, Popover, Portal, ProgressBar, Prompt, RadioButtonGroup, Select, ShortcutHint, ShortcutManager, ShortcutModal, ShortcutScope, ShortcutsConfigContext, ShortcutsProvider, Slider, Stepper, Switch, Table, Tabs, Tag, TagGroup, TextArea, Toast, Tooltip
|
|
181
179
|
|
|
182
180
|
**MCP names (patterns):** FiltersStrip, Header, HomePage, Notification, Sidebar
|
|
183
181
|
|
package/dist/_virtual/index15.js
CHANGED
package/dist/_virtual/index16.js
CHANGED
package/dist/_virtual/index2.js
CHANGED
package/dist/_virtual/index3.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chatbot/index.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAE,YAAY,EAAwB,MAAM,iBAAiB,CAAC;AAC1E,OAAO,sBAAsB,CAAC;AAiD9B,YAAY,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAoCpD,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,YAAiD,EACjD,QAAQ,EAAE,SAAS,EACnB,aAAa,EAAE,cAAc,EAC7B,cAAc,EAAE,eAAe,EAC/B,mBAAmB,EACnB,mBAAmB,EACnB,eAA0B,EAC1B,cAAc,EAAE,eAAoB,EACpC,mBAA2B,EAC3B,UAAe,EACf,aAAwB,EACxB,OAAO,EACP,eAAe,EACf,UAA6C,EAC7C,YAAmB,EACnB,cAAsB,EACtB,eAAsB,EACtB,WAAsB,EACtB,cAAyB,EACzB,kBAA6B,EAC7B,SAAc,EACd,aAAa,EACb,cAAc,EACd,cAAc,EACd,aAAqB,EACrB,aAAqB,EACrB,mBAA2B,EAC3B,gBAAgB,EAChB,UAAkB,EAClB,eAA0B,EAC1B,aAAqB,EACrB,UAAU,EACV,uBAAkC,EAClC,oBAA4B,EAC5B,WAAgB,EAChB,oBAA2B,EAC3B,mBAA8B,EAC9B,gBAAqB,EACrB,qBAAgC,EAChC,2BAAsC,EACtC,oBAA+B,EAC/B,iBAAiB,EACjB,mBAA8B,EAC9B,gBAAuB,EACvB,WAAmB,EACnB,oBAAoB,EACpB,iBAA4B,EAC5B,iBAA4B,EAC5B,iBAAiB,EACjB,eAA0B,GAC3B,EAAE,YAAY,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chatbot/index.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAE,YAAY,EAAwB,MAAM,iBAAiB,CAAC;AAC1E,OAAO,sBAAsB,CAAC;AAiD9B,YAAY,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAoCpD,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,YAAiD,EACjD,QAAQ,EAAE,SAAS,EACnB,aAAa,EAAE,cAAc,EAC7B,cAAc,EAAE,eAAe,EAC/B,mBAAmB,EACnB,mBAAmB,EACnB,eAA0B,EAC1B,cAAc,EAAE,eAAoB,EACpC,mBAA2B,EAC3B,UAAe,EACf,aAAwB,EACxB,OAAO,EACP,eAAe,EACf,UAA6C,EAC7C,YAAmB,EACnB,cAAsB,EACtB,eAAsB,EACtB,WAAsB,EACtB,cAAyB,EACzB,kBAA6B,EAC7B,SAAc,EACd,aAAa,EACb,cAAc,EACd,cAAc,EACd,aAAqB,EACrB,aAAqB,EACrB,mBAA2B,EAC3B,gBAAgB,EAChB,UAAkB,EAClB,eAA0B,EAC1B,aAAqB,EACrB,UAAU,EACV,uBAAkC,EAClC,oBAA4B,EAC5B,WAAgB,EAChB,oBAA2B,EAC3B,mBAA8B,EAC9B,gBAAqB,EACrB,qBAAgC,EAChC,2BAAsC,EACtC,oBAA+B,EAC/B,iBAAiB,EACjB,mBAA8B,EAC9B,gBAAuB,EACvB,WAAmB,EACnB,oBAAoB,EACpB,iBAA4B,EAC5B,iBAA4B,EAC5B,iBAAiB,EACjB,eAA0B,GAC3B,EAAE,YAAY,sCA4cd;yBAngBe,gBAAgB"}
|
|
@@ -176,6 +176,11 @@ function ChatBotComponent({
|
|
|
176
176
|
() => isBookMarkPanelOpen || isHistoryPanelOpen || isPagePanelOpen,
|
|
177
177
|
[isBookMarkPanelOpen, isHistoryPanelOpen, isPagePanelOpen]
|
|
178
178
|
);
|
|
179
|
+
useEffect(() => {
|
|
180
|
+
tabListRef.current = tabList;
|
|
181
|
+
menuItemsRef.current = menuItems$1;
|
|
182
|
+
onChatBotResizeRef.current = onChatBotResize;
|
|
183
|
+
});
|
|
179
184
|
const viewportMargin = isMinimised ? FLOATING_MARGIN : DOCKED_MARGIN;
|
|
180
185
|
const {
|
|
181
186
|
rect,
|
|
@@ -199,7 +204,7 @@ function ChatBotComponent({
|
|
|
199
204
|
viewportMargin,
|
|
200
205
|
disabled: isFullWidth,
|
|
201
206
|
onChange: (nextRect) => {
|
|
202
|
-
|
|
207
|
+
onChatBotResizeRef.current(nextRect.width);
|
|
203
208
|
}
|
|
204
209
|
});
|
|
205
210
|
const resolveDirectionForResize = isCollapsed ? COLLAPSED_RESIZE_DIRECTIONS : EXPANDED_RESIZE_DIRECTION;
|
|
@@ -261,7 +266,7 @@ function ChatBotComponent({
|
|
|
261
266
|
setActiveList((_b = (_a2 = tabListRef.current) == null ? void 0 : _a2.find((tab) => tab.initialClick)) == null ? void 0 : _b.name);
|
|
262
267
|
const initialItem = menuItemsRef.current.find((tab) => tab.initialClick);
|
|
263
268
|
(_c = initialItem == null ? void 0 : initialItem.onClick) == null ? void 0 : _c.call(initialItem, initialItem);
|
|
264
|
-
}, [isChatBotOpen
|
|
269
|
+
}, [isChatBotOpen]);
|
|
265
270
|
useEffect(() => {
|
|
266
271
|
if (isFullWidth || isCollapsed) return;
|
|
267
272
|
const syncDocked = () => {
|
|
@@ -1,8 +1,4 @@
|
|
|
1
|
+
import { CommentsPanelProps } from './CommentsPanel.types';
|
|
1
2
|
|
|
2
|
-
export default function CommentsPanel({ className, style, onClose, visibleSortOptions }:
|
|
3
|
-
className: any;
|
|
4
|
-
style: any;
|
|
5
|
-
onClose: any;
|
|
6
|
-
visibleSortOptions: any;
|
|
7
|
-
}): import("react").JSX.Element | null;
|
|
3
|
+
export default function CommentsPanel({ className, style, onClose, visibleSortOptions, }: CommentsPanelProps): import("react").JSX.Element | null;
|
|
8
4
|
//# sourceMappingURL=CommentsPanel.impl.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommentsPanel.impl.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsPanel.impl.tsx"],"names":[],"mappings":"AAqBA,OAAO,6BAA6B,CAAC;AAgBrC,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,
|
|
1
|
+
{"version":3,"file":"CommentsPanel.impl.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsPanel.impl.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,6BAA6B,CAAC;AAgBrC,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,SAAS,EACT,KAAK,EACL,OAAO,EACP,kBAAkB,GACnB,EAAE,kBAAkB,sCA+ZpB"}
|
|
@@ -23,7 +23,12 @@ const COMMENT_SEARCH_OPTIONS = [
|
|
|
23
23
|
{ labelKey: "commentsPanel.showResolved", value: "opt3" },
|
|
24
24
|
{ labelKey: "commentsPanel.onlyYourThreads", value: "opt4" }
|
|
25
25
|
];
|
|
26
|
-
function CommentsPanel({
|
|
26
|
+
function CommentsPanel({
|
|
27
|
+
className,
|
|
28
|
+
style,
|
|
29
|
+
onClose,
|
|
30
|
+
visibleSortOptions
|
|
31
|
+
}) {
|
|
27
32
|
const { t } = useTranslation();
|
|
28
33
|
const ctx = useComments();
|
|
29
34
|
const [activeItem, setActiveItem] = useState(null);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
2
|
|
|
3
3
|
export interface CommentConfiguration {
|
|
4
4
|
disableMarkAsRead?: boolean;
|
|
@@ -35,7 +35,7 @@ export interface CommentsProviderProps {
|
|
|
35
35
|
}
|
|
36
36
|
export interface CommentsPanelProps {
|
|
37
37
|
className?: string;
|
|
38
|
-
style?:
|
|
38
|
+
style?: CSSProperties;
|
|
39
39
|
onClose?: () => void;
|
|
40
40
|
visibleSortOptions?: string[];
|
|
41
41
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommentsPanel.types.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsPanel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CommentsPanel.types.d.ts","sourceRoot":"","sources":["../../../src/components/CommentsPanel/CommentsPanel.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,44 +1,21 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import { InjectedLayoutProps } from '../DynamicLayout';
|
|
4
|
-
import { StepperStep } from '../Stepper/Stepper.types';
|
|
1
|
+
import { ReactNode, CSSProperties, Ref } from 'react';
|
|
2
|
+
import { ButtonProps } from '../Button/Button.types';
|
|
5
3
|
|
|
6
|
-
export interface CreateItemFlowProps
|
|
7
|
-
/** Current step (1-based) */
|
|
8
|
-
step?: number;
|
|
9
|
-
totalSteps?: number;
|
|
10
|
-
/** Width of the left panel (e.g. "375px") */
|
|
4
|
+
export interface CreateItemFlowProps {
|
|
11
5
|
leftPanelWidth?: string | number;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
leftPanelTitle?: string;
|
|
23
|
-
leftPanelDescription?: string;
|
|
24
|
-
/** Custom left panel image (overrides default) */
|
|
25
|
-
leftPanelImage?: ReactNode | null;
|
|
26
|
-
/** Custom actions (overrides default Prev/Next buttons) */
|
|
27
|
-
actionsChildren?: ReactNode | null;
|
|
28
|
-
showStepper?: boolean;
|
|
6
|
+
leftPanelContent?: ReactNode;
|
|
7
|
+
leftPanelImage?: ReactNode;
|
|
8
|
+
rightContent?: ReactNode;
|
|
9
|
+
title?: string;
|
|
10
|
+
description?: string;
|
|
11
|
+
prevButtonProps?: Partial<ButtonProps>;
|
|
12
|
+
extraButtonProp?: ReactNode;
|
|
13
|
+
nextButtonProps?: Partial<ButtonProps>;
|
|
14
|
+
customCSS?: CSSProperties;
|
|
15
|
+
className?: string;
|
|
29
16
|
}
|
|
30
|
-
export interface RightContentPanelProps
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
step: number;
|
|
34
|
-
stepperVariant: 'default' | 'progress' | 'mui';
|
|
35
|
-
onStepClick?: (step: number) => void;
|
|
36
|
-
headings: string[];
|
|
37
|
-
children?: ReactNode | ReactNode[];
|
|
38
|
-
actionsChildren?: ReactNode | null;
|
|
39
|
-
onCancel?: () => void;
|
|
40
|
-
onPrev?: () => void;
|
|
41
|
-
onNext?: () => void;
|
|
42
|
-
totalSteps: number;
|
|
17
|
+
export interface RightContentPanelProps {
|
|
18
|
+
contentRef?: Ref<HTMLDivElement>;
|
|
19
|
+
children?: ReactNode;
|
|
43
20
|
}
|
|
44
21
|
//# sourceMappingURL=CreateItemFlow.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CreateItemFlow.types.d.ts","sourceRoot":"","sources":["../../../src/components/CreateItemFlow/CreateItemFlow.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"CreateItemFlow.types.d.ts","sourceRoot":"","sources":["../../../src/components/CreateItemFlow/CreateItemFlow.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,aAAa,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAE1D,MAAM,WAAW,mBAAmB;IAClC,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IACvC,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IACvC,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,sBAAsB;IACrC,UAAU,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { CreateItemFlowProps } from './CreateItemFlow.types';
|
|
3
3
|
|
|
4
|
-
export
|
|
5
|
-
export declare const CreateItemFlow: React.NamedExoticComponent<CreateItemFlowProps>;
|
|
4
|
+
export declare const CreateItemFlow: React.MemoExoticComponent<({ leftPanelWidth, leftPanelContent, leftPanelImage, rightContent, title, description, prevButtonProps, extraButtonProp, nextButtonProps, customCSS, className, }: CreateItemFlowProps) => React.JSX.Element>;
|
|
6
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CreateItemFlow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CreateItemFlow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAOpC,OAAO,EAAE,KAAK,mBAAmB,EAA+B,MAAM,wBAAwB,CAAC;AAC/F,OAAO,8BAA8B,CAAC;AAgGtC,eAAO,MAAM,cAAc,+LAnDxB,mBAAmB,uBAmDqC,CAAC"}
|
|
@@ -1,25 +1,19 @@
|
|
|
1
|
-
!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".
|
|
2
|
-
import { jsx, jsxs
|
|
3
|
-
import React__default, { memo
|
|
1
|
+
!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('@keyframes ia-shimmer-horizontal{0%{background-position:100% 0}to{background-position:0 0}}@keyframes ia-shimmer-vertical{0%{background-position:0 100%}to{background-position:0 0}}@property --ia-shimmer-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes ia-shimmer-circular{0%{--ia-shimmer-angle:0deg}to{--ia-shimmer-angle:360deg}}.ia-shimmer{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ltr{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ltr{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--rtl{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(270deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--rtl{animation:none;background-image:linear-gradient(270deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--btt{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--btt{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ttb{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ttb{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--circular{background-color:#e8edf5;background-repeat:no-repeat;--ia-shimmer-angle:0deg;animation:ia-shimmer-circular 1.6s linear infinite;background-image:conic-gradient(from var(--ia-shimmer-angle),#eceef4 0deg,#e8edf5 80deg,#d5dbe8 160deg,#e8edf5 260deg,#eceef4 1turn);background-size:100% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--circular{animation:none;background-image:conic-gradient(from 0deg,#eceef4,#e8edf5,#d5dbe8,#e8edf5 1turn)}}:root{--ia-focus-color:#4259ee;--ia-focus-bg:#fff;--ia-focus-ring-width:2px;--ia-focus-ring-offset:2px;--ia-modal-backdrop:#0d152ccc}*,:after,:before{box-sizing:border-box}body,textarea{font-style:normal;font-weight:500}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:initial}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{font-family:Manrope,sans-serif}.impact-notification-separator{background-color:#d9dde7;display:inline-block;height:16px;width:1.5px}.impact-notification-horizontal-separator{background-color:#d9dde7;display:inline-block;height:1px;width:100%}ul.storybook-order-list{list-style-type:disc;padding-left:12px}ul.storybook-order-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-list li strong{font-weight:800}ul.storybook-order-child-list{list-style-type:circle;padding-left:20px}ul.storybook-order-child-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-child-list li strong{font-weight:800}.content-wrapper{flex:1;min-height:100%}.form-section{width:100%}.form-section .form-section-title{color:#0d152c;font-size:16px;font-weight:600;margin-bottom:12px}.form-section .form-filter-block{background:#f7f9fd;border-radius:8px;margin-top:20px;padding:12px}.form-section .form-filter-block .form-filter-title{color:#0d152c;font-size:14px;font-weight:600;margin-bottom:16px}.form-section .form-filter-block .form-filter-fields{display:flex;flex-wrap:wrap;gap:24px}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import React__default, { memo } from "react";
|
|
4
|
+
import default_1 from "../../node_modules/@mui/icons-material/ChevronLeft.js";
|
|
5
|
+
import default_1$1 from "../../node_modules/@mui/icons-material/ChevronRight.js";
|
|
4
6
|
import { getAssetUrl } from "../../utils/assetBase.js";
|
|
5
7
|
import { Button } from "../Button/index.js";
|
|
6
8
|
import { DynamicLayout } from "../DynamicLayout/index.js";
|
|
7
|
-
import { Stepper } from "../Stepper/index.js";
|
|
8
9
|
|
|
9
10
|
import { useTranslation } from "../../i18n/useTranslation.js";
|
|
10
|
-
const createFlowImage = getAssetUrl("icons/
|
|
11
|
-
|
|
12
|
-
leftPanelTitle,
|
|
13
|
-
leftPanelDescription,
|
|
14
|
-
leftPanelImage
|
|
15
|
-
}) {
|
|
11
|
+
const createFlowImage = getAssetUrl("icons/create-item-flow-img.webp");
|
|
12
|
+
const LeftPanelContent = ({ leftPanelContent, leftPanelImage }) => {
|
|
16
13
|
const { t } = useTranslation();
|
|
17
14
|
return /* @__PURE__ */ jsxs("div", { className: "left-panel-content", children: [
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
/* @__PURE__ */ jsx("p", { children: leftPanelDescription })
|
|
21
|
-
] }),
|
|
22
|
-
leftPanelImage ?? /* @__PURE__ */ jsx(
|
|
15
|
+
leftPanelContent,
|
|
16
|
+
leftPanelImage ? leftPanelImage : /* @__PURE__ */ jsx(
|
|
23
17
|
"img",
|
|
24
18
|
{
|
|
25
19
|
alt: t("createItemFlow.imageAlt"),
|
|
@@ -28,116 +22,72 @@ function LeftPanelContent({
|
|
|
28
22
|
}
|
|
29
23
|
)
|
|
30
24
|
] });
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
steps,
|
|
35
|
-
step,
|
|
36
|
-
stepperVariant,
|
|
37
|
-
onStepClick,
|
|
38
|
-
headings,
|
|
39
|
-
children,
|
|
40
|
-
contentRef,
|
|
41
|
-
hasScroll,
|
|
42
|
-
actionsChildren,
|
|
43
|
-
onCancel,
|
|
44
|
-
onPrev,
|
|
45
|
-
onNext,
|
|
46
|
-
totalSteps
|
|
47
|
-
}) {
|
|
48
|
-
const { t } = useTranslation();
|
|
49
|
-
const childArray = React__default.Children.toArray(children ?? []);
|
|
50
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
51
|
-
showStepper && /* @__PURE__ */ jsx(
|
|
52
|
-
Stepper,
|
|
53
|
-
{
|
|
54
|
-
activeStep: step - 1,
|
|
55
|
-
handleStep: (index) => onStepClick == null ? void 0 : onStepClick(index + 1),
|
|
56
|
-
orientation: "horizontal",
|
|
57
|
-
steps,
|
|
58
|
-
variant: stepperVariant
|
|
59
|
-
}
|
|
60
|
-
),
|
|
61
|
-
/* @__PURE__ */ jsx(
|
|
62
|
-
"div",
|
|
63
|
-
{
|
|
64
|
-
ref: contentRef,
|
|
65
|
-
className: `content-wrapper ${hasScroll === false ? "no-scroll" : ""}`,
|
|
66
|
-
children: headings.map((heading, index) => /* @__PURE__ */ jsxs("div", { className: "heading", children: [
|
|
67
|
-
/* @__PURE__ */ jsx("h2", { children: heading }),
|
|
68
|
-
childArray[index]
|
|
69
|
-
] }, index))
|
|
70
|
-
}
|
|
71
|
-
),
|
|
72
|
-
actionsChildren != null ? /* @__PURE__ */ jsx("div", { className: "actions", children: actionsChildren }) : /* @__PURE__ */ jsxs("div", { className: "actions", children: [
|
|
73
|
-
step === 1 ? /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onCancel, children: t("common.cancel") }) : /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onPrev, children: t("common.previous") }),
|
|
74
|
-
/* @__PURE__ */ jsx(Button, { variant: "primary", onClick: onNext, children: step === totalSteps ? t("common.submit") : t("common.next") })
|
|
75
|
-
] })
|
|
76
|
-
] });
|
|
77
|
-
}
|
|
78
|
-
const CreateItemFlow = memo(function CreateItemFlow2({
|
|
79
|
-
step = 1,
|
|
80
|
-
totalSteps = 3,
|
|
25
|
+
};
|
|
26
|
+
const RightContentPanel = ({ contentRef, children }) => /* @__PURE__ */ jsx("div", { ref: contentRef, className: "content-wrapper", children });
|
|
27
|
+
const CreateItemFlowComponent = ({
|
|
81
28
|
leftPanelWidth,
|
|
82
|
-
|
|
83
|
-
children,
|
|
84
|
-
onCancel,
|
|
85
|
-
onNext,
|
|
86
|
-
onPrev,
|
|
87
|
-
onStepClick,
|
|
88
|
-
stepperVariant = "progress",
|
|
89
|
-
leftPanelTitle,
|
|
90
|
-
leftPanelDescription = "",
|
|
29
|
+
leftPanelContent = null,
|
|
91
30
|
leftPanelImage = null,
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
31
|
+
rightContent,
|
|
32
|
+
title,
|
|
33
|
+
description = "",
|
|
34
|
+
prevButtonProps = {},
|
|
35
|
+
extraButtonProp,
|
|
36
|
+
nextButtonProps = {},
|
|
37
|
+
customCSS,
|
|
38
|
+
className
|
|
39
|
+
}) => {
|
|
95
40
|
const { t } = useTranslation();
|
|
96
|
-
const
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
);
|
|
107
|
-
const rightContent = /* @__PURE__ */ jsx(
|
|
108
|
-
RightContentPanel,
|
|
109
|
-
{
|
|
110
|
-
actionsChildren,
|
|
111
|
-
headings,
|
|
112
|
-
showStepper,
|
|
113
|
-
step,
|
|
114
|
-
stepperVariant,
|
|
115
|
-
steps,
|
|
116
|
-
totalSteps,
|
|
117
|
-
onCancel,
|
|
118
|
-
onNext,
|
|
119
|
-
onPrev,
|
|
120
|
-
onStepClick,
|
|
121
|
-
children
|
|
122
|
-
}
|
|
123
|
-
);
|
|
41
|
+
const {
|
|
42
|
+
children: prevLabel = t("createItemFlow.back"),
|
|
43
|
+
icon: prevIcon,
|
|
44
|
+
...restPrevProps
|
|
45
|
+
} = prevButtonProps;
|
|
46
|
+
const {
|
|
47
|
+
children: nextLabel = t("createItemFlow.next"),
|
|
48
|
+
icon: nextIcon,
|
|
49
|
+
...restNextProps
|
|
50
|
+
} = nextButtonProps;
|
|
51
|
+
const resolvedTitle = title ?? t("createItemFlow.defaultTitle");
|
|
124
52
|
return /* @__PURE__ */ jsx(
|
|
125
53
|
DynamicLayout,
|
|
126
54
|
{
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
55
|
+
className,
|
|
56
|
+
description,
|
|
57
|
+
footer: /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
|
|
58
|
+
/* @__PURE__ */ jsx(
|
|
59
|
+
Button,
|
|
60
|
+
{
|
|
61
|
+
icon: "icon" in prevButtonProps ? prevIcon : /* @__PURE__ */ jsx(default_1, {}),
|
|
62
|
+
variant: restPrevProps.variant ?? "tertiary",
|
|
63
|
+
...restPrevProps,
|
|
64
|
+
children: prevLabel
|
|
65
|
+
}
|
|
66
|
+
),
|
|
67
|
+
/* @__PURE__ */ jsxs("div", { className: "footer-right-group", children: [
|
|
68
|
+
extraButtonProp,
|
|
69
|
+
/* @__PURE__ */ jsx(
|
|
70
|
+
Button,
|
|
71
|
+
{
|
|
72
|
+
icon: "icon" in nextButtonProps ? nextIcon : /* @__PURE__ */ jsx(default_1$1, {}),
|
|
73
|
+
iconPlacement: nextButtonProps.iconPlacement ?? "right",
|
|
74
|
+
variant: restNextProps.variant ?? "primary",
|
|
75
|
+
...restNextProps,
|
|
76
|
+
children: nextLabel
|
|
77
|
+
}
|
|
78
|
+
)
|
|
79
|
+
] })
|
|
80
|
+
] }),
|
|
81
|
+
leftPanel: /* @__PURE__ */ jsx(LeftPanelContent, { leftPanelContent, leftPanelImage }),
|
|
135
82
|
leftPanelWidth,
|
|
136
|
-
rightContent,
|
|
137
|
-
|
|
83
|
+
rightContent: /* @__PURE__ */ jsx(RightContentPanel, { children: rightContent }),
|
|
84
|
+
style: customCSS,
|
|
85
|
+
title: resolvedTitle
|
|
138
86
|
}
|
|
139
87
|
);
|
|
140
|
-
}
|
|
88
|
+
};
|
|
89
|
+
const CreateItemFlow = memo(CreateItemFlowComponent);
|
|
90
|
+
CreateItemFlow.displayName = "CreateItemFlow";
|
|
141
91
|
export {
|
|
142
92
|
CreateItemFlow
|
|
143
93
|
};
|
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
import { DynamicLayoutProps } from './DynamicLayout.types';
|
|
3
2
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
3
|
+
interface DynamicLayoutProps {
|
|
4
|
+
title?: React.ReactNode;
|
|
5
|
+
description?: React.ReactNode;
|
|
6
|
+
leftPanel?: React.ReactNode;
|
|
7
|
+
rightContent: React.ReactElement;
|
|
8
|
+
leftPanelWidth?: string | number;
|
|
9
|
+
className?: string;
|
|
10
|
+
footer?: React.ReactNode;
|
|
11
|
+
[key: string]: unknown;
|
|
12
12
|
}
|
|
13
|
+
export declare const DynamicLayout: ({ title, description, leftPanel, rightContent, leftPanelWidth, className, footer, ...props }: DynamicLayoutProps) => React.JSX.Element;
|
|
14
|
+
export {};
|
|
13
15
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicLayout/index.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicLayout/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAE1D,OAAO,6BAA6B,CAAC;AAGrC,UAAU,kBAAkB;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,aAAa,GAAI,8FAS3B,kBAAkB,sBAgCpB,CAAC"}
|
|
@@ -1,48 +1,45 @@
|
|
|
1
|
-
!function(){"use strict";try{if("undefined"!=typeof document){var
|
|
1
|
+
!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('@keyframes ia-shimmer-horizontal{0%{background-position:100% 0}to{background-position:0 0}}@keyframes ia-shimmer-vertical{0%{background-position:0 100%}to{background-position:0 0}}@property --ia-shimmer-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes ia-shimmer-circular{0%{--ia-shimmer-angle:0deg}to{--ia-shimmer-angle:360deg}}.ia-shimmer{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ltr{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ltr{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--rtl{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(270deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--rtl{animation:none;background-image:linear-gradient(270deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--btt{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--btt{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ttb{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ttb{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--circular{background-color:#e8edf5;background-repeat:no-repeat;--ia-shimmer-angle:0deg;animation:ia-shimmer-circular 1.6s linear infinite;background-image:conic-gradient(from var(--ia-shimmer-angle),#eceef4 0deg,#e8edf5 80deg,#d5dbe8 160deg,#e8edf5 260deg,#eceef4 1turn);background-size:100% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--circular{animation:none;background-image:conic-gradient(from 0deg,#eceef4,#e8edf5,#d5dbe8,#e8edf5 1turn)}}:root{--ia-focus-color:#4259ee;--ia-focus-bg:#fff;--ia-focus-ring-width:2px;--ia-focus-ring-offset:2px;--ia-modal-backdrop:#0d152ccc}*,:after,:before{box-sizing:border-box}body,textarea{font-style:normal;font-weight:500}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:initial}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{font-family:Manrope,sans-serif}.impact-notification-separator{background-color:#d9dde7;display:inline-block;height:16px;width:1.5px}.impact-notification-horizontal-separator{background-color:#d9dde7;display:inline-block;height:1px;width:100%}ul.storybook-order-list{list-style-type:disc;padding-left:12px}ul.storybook-order-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-list li strong{font-weight:800}ul.storybook-order-child-list{list-style-type:circle;padding-left:20px}ul.storybook-order-child-list li{font-size:12px;line-height:20px;padding-bottom:8px}ul.storybook-order-child-list li strong{font-weight:800}.dynamic-layout-container{background-color:#fff;border-radius:24px!important;box-shadow:0 0 4px #ababab40;display:flex;flex-direction:column;top:0;right:24px;bottom:24px;left:24px;justify-content:center;position:absolute}.dynamic-layout-container .dynamic-layout-header{border-bottom:1px solid #d9dde7;display:flex;flex-direction:column;gap:8px;padding:24px}.dynamic-layout-container .dynamic-layout-header h1{color:#0d152c;font-size:24px;font-weight:800;line-height:36px}.dynamic-layout-container .dynamic-layout-header p{color:#7a8294;font-size:12px;font-weight:500;line-height:16px;text-transform:capitalize}.dynamic-layout-container .dynamic-layout-body{background-position:100% 0;background-repeat:no-repeat;background-size:contain;border-bottom-right-radius:24px;display:flex;flex:1;min-height:0;overflow:hidden;padding:24px}.dynamic-layout-container .dynamic-layout-body .left-panel{border-right:1px solid #d9dde7;padding-right:24px;width:var(--left-panel-width,220px)}.dynamic-layout-container .dynamic-layout-body .left-panel .left-panel-content{display:flex;flex-direction:column;height:100%;justify-content:space-between}.dynamic-layout-container .dynamic-layout-body .left-panel .left-panel-image{height:130px;margin:0 auto;width:132px}.dynamic-layout-container .dynamic-layout-body .right-column{display:flex;flex-direction:column;justify-content:space-between;min-height:0;padding-left:24px;width:calc(100% - var(--left-panel-width, 220px))}.dynamic-layout-container .dynamic-layout-body .right-column .right-content{display:flex;flex:1;flex-direction:column;min-height:0;overflow-x:hidden;overflow-y:auto}.dynamic-layout-container .dynamic-layout-body .right-column .dynamic-layout-footer{border-top:1px solid #d9dde7;display:flex;justify-content:space-between;padding-top:24px}.dynamic-layout-container .dynamic-layout-body .right-column .dynamic-layout-footer .footer-right-group{align-items:center;display:flex;gap:12px}@media screen and (min-width:1400px) and (max-width:1600px){.dynamic-layout-body{padding:20px}.left-panel-image{width:100%}}@media screen and (max-width:1399px){.dynamic-layout-body{padding:16px}.left-panel{flex-shrink:0;padding-right:16px;width:fit-content}.right-column{flex:1;padding-left:16px;width:auto}.left-panel-image{height:auto;max-width:132px;width:100%}}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
|
|
2
2
|
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
|
-
import React__default, { useRef
|
|
3
|
+
import React__default, { useRef } from "react";
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
import { getAssetUrl } from "../../utils/assetBase.js";
|
|
6
|
+
import Box from "../../node_modules/@mui/material/Box/Box.js";
|
|
7
|
+
const DynamicLayout = ({
|
|
8
|
+
title,
|
|
9
|
+
description,
|
|
6
10
|
leftPanel,
|
|
7
11
|
rightContent,
|
|
8
12
|
leftPanelWidth,
|
|
9
|
-
className
|
|
10
|
-
|
|
13
|
+
className,
|
|
14
|
+
footer,
|
|
11
15
|
...props
|
|
12
|
-
}) {
|
|
16
|
+
}) => {
|
|
13
17
|
const contentRef = useRef(null);
|
|
14
|
-
const
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
mutationObserver == null ? void 0 : mutationObserver.disconnect();
|
|
38
|
-
};
|
|
39
|
-
}, [rightContent]);
|
|
40
|
-
return /* @__PURE__ */ jsxs("div", { className: `dynamic-layout-container ${className}`.trim(), ...props, children: [
|
|
41
|
-
/* @__PURE__ */ jsx("div", { className: "left-panel", style: { width: leftPanelWidth }, children: leftPanel }),
|
|
42
|
-
/* @__PURE__ */ jsx("div", { className: `right-content ${showStepper ? "with-stepper" : ""}`, children: React__default.cloneElement(rightContent, { contentRef, hasScroll }) })
|
|
18
|
+
const contentBackgroundImage = getAssetUrl("images/review-tech-bg.webp");
|
|
19
|
+
return /* @__PURE__ */ jsxs(Box, { className: `dynamic-layout-container ${className || ""}`, ...props, children: [
|
|
20
|
+
/* @__PURE__ */ jsxs(Box, { className: "dynamic-layout-header", children: [
|
|
21
|
+
/* @__PURE__ */ jsx("h1", { children: title }),
|
|
22
|
+
description && /* @__PURE__ */ jsx("p", { children: description })
|
|
23
|
+
] }),
|
|
24
|
+
/* @__PURE__ */ jsxs(
|
|
25
|
+
Box,
|
|
26
|
+
{
|
|
27
|
+
className: "dynamic-layout-body",
|
|
28
|
+
style: leftPanelWidth ? {
|
|
29
|
+
"--left-panel-width": typeof leftPanelWidth === "number" ? `${leftPanelWidth}px` : leftPanelWidth
|
|
30
|
+
} : void 0,
|
|
31
|
+
sx: { backgroundImage: `url(${contentBackgroundImage})` },
|
|
32
|
+
children: [
|
|
33
|
+
/* @__PURE__ */ jsx(Box, { className: "left-panel", children: leftPanel }),
|
|
34
|
+
/* @__PURE__ */ jsxs(Box, { className: "right-column", children: [
|
|
35
|
+
/* @__PURE__ */ jsx(Box, { className: "right-content", children: React__default.cloneElement(rightContent, { contentRef }) }),
|
|
36
|
+
footer && /* @__PURE__ */ jsx(Box, { className: "dynamic-layout-footer", children: footer })
|
|
37
|
+
] })
|
|
38
|
+
]
|
|
39
|
+
}
|
|
40
|
+
)
|
|
43
41
|
] });
|
|
44
|
-
}
|
|
45
|
-
DynamicLayout.displayName = "DynamicLayout";
|
|
42
|
+
};
|
|
46
43
|
export {
|
|
47
44
|
DynamicLayout
|
|
48
45
|
};
|