npm - @itwin/core-react - Versions diffs - 4.0.0-dev.16 → 4.0.0-dev.17 - Mend

@itwin/core-react 4.0.0-dev.16 → 4.0.0-dev.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (384) hide show

package/lib/esm/core-react/inputs/variables.scss CHANGED Viewed

@@ -1,38 +1,38 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "../style/baseline";
-@import "../style/themecolors";
-// cspell:ignore unbordered
-$uicore-inputs-height: 22px;
-$uicore-inputs-height-large: 40px;
-$uicore-line-height: calc(var(--iui-size-s) * 1.4);
-$uicore-bordered-padding: calc(#{$uicore-bordered-padding} * 0.5);
-$uicore-unbordered-padding: calc(#{$uicore-unbordered-padding} * 0.5);
-$uicore-inputs-padding: calc(
-  (#{$uicore-inputs-height} - #{$uicore-line-height}) * 0.5
-);
-$uicore-inputs-padding-large: calc(
-  (#{$uicore-inputs-height-large} - #{$uicore-line-height}) * 0.5
-);
-$uicore-inputs-padding-bordered: calc(#{$uicore-inputs-padding} - 2px);
-$uicore-inputs-padding-bordered-large: calc(
-  #{$uicore-inputs-padding-large} - 2px
-);
-$uicore-inputs-margin: calc(
-  (#{$uicore-line-height} * 2 - #{$uicore-inputs-height}) * 0.5
-);
-$uicore-inputs-margin-large: calc(
-  (#{$uicore-line-height} * 3 - #{$uicore-inputs-height-large}) * 0.5
-);
-$uicore-inputs-border-color: $buic-inputs-border;
-$uicore-inputs-focus-boxshadow: $buic-focus-boxshadow 0px 0px 0px 2px;
-$uicore-iui-input-padding: var(--iui-size-3xs) var(--iui-size-xs);
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/baseline";
+@import "../style/themecolors";
+// cspell:ignore unbordered
+$uicore-inputs-height: 22px;
+$uicore-inputs-height-large: 40px;
+$uicore-line-height: calc(var(--iui-size-s) * 1.4);
+$uicore-bordered-padding: calc(#{$uicore-bordered-padding} * 0.5);
+$uicore-unbordered-padding: calc(#{$uicore-unbordered-padding} * 0.5);
+$uicore-inputs-padding: calc(
+  (#{$uicore-inputs-height} - #{$uicore-line-height}) * 0.5
+);
+$uicore-inputs-padding-large: calc(
+  (#{$uicore-inputs-height-large} - #{$uicore-line-height}) * 0.5
+);
+$uicore-inputs-padding-bordered: calc(#{$uicore-inputs-padding} - 2px);
+$uicore-inputs-padding-bordered-large: calc(
+  #{$uicore-inputs-padding-large} - 2px
+);
+$uicore-inputs-margin: calc(
+  (#{$uicore-line-height} * 2 - #{$uicore-inputs-height}) * 0.5
+);
+$uicore-inputs-margin-large: calc(
+  (#{$uicore-line-height} * 3 - #{$uicore-inputs-height-large}) * 0.5
+);
+$uicore-inputs-border-color: $buic-inputs-border;
+$uicore-inputs-focus-boxshadow: $buic-focus-boxshadow 0px 0px 0px 2px;
+$uicore-iui-input-padding: var(--iui-size-3xs) var(--iui-size-xs);

package/lib/esm/core-react/layout-variables.scss CHANGED Viewed

@@ -1,17 +1,17 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "./z-index";
-:root {
-  /** Default Widget Opacity */
-  --buic-widget-opacity:      0.90;
-  /** Default Toolbar Opacity */
-  --buic-toolbar-opacity:     0.50;
-  /** CSS variables for each z-index layer */
-  @include uicore-z-index-variables();
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "./z-index";
+:root {
+  /** Default Widget Opacity */
+  --buic-widget-opacity:      0.90;
+  /** Default Toolbar Opacity */
+  --buic-toolbar-opacity:     0.50;
+  /** CSS variables for each z-index layer */
+  @include uicore-z-index-variables();
+}

package/lib/esm/core-react/listbox/Listbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Listbox.js","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"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","sourcesContent":["/---------------------------------------------------------------------------------------------\r\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n--------------------------------------------------------------------------------------------/\r\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\n\r\nimport \"./Listbox.scss\";\r\nimport { Guid } from \"@itwin/core-bentley\";\r\nimport { SpecialKey } from \"@itwin/appui-abstract\";\r\n\r\n/** Ideas borrowed from https://reacttraining.com/reach-ui/listbox /\r\n\r\n/\r\n `Listbox` value.\r\n * @alpha\r\n /\r\nexport type ListboxValue = string;\r\n\r\n/\r\n `Listbox` Props.\r\n * @alpha\r\n /\r\nexport interface ListboxProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement> {\r\n id?: string;\r\n selectedValue?: ListboxValue;\r\n ariaLabel?: any;\r\n ariaLabelledBy?: any;\r\n onListboxValueChange?: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\r\n}\r\n\r\n/\r\n `ListboxItem` Props.\r\n * @alpha\r\n /\r\nexport interface ListboxItemProps extends React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement> {\r\n /* The unique item's value. /\r\n value: ListboxValue;\r\n /* set if item is disabled. /\r\n disabled?: boolean;\r\n}\r\n\r\n/\r\n `Listbox` Context.\r\n * @alpha\r\n /\r\nexport interface ListboxContextProps {\r\n listboxId?: string;\r\n listboxValue?: ListboxValue;\r\n focusValue?: ListboxValue;\r\n onListboxValueChange: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\r\n listboxRef?: React.RefObject<HTMLUListElement>;\r\n}\r\n\r\n/\r\n Context set up by listbox for use by `ListboxItems` .\r\n * @alpha\r\n /\r\n// istanbul ignore next\r\nexport const ListboxContext = React.createContext<ListboxContextProps>({ onListboxValueChange: (_newValue: ListboxValue \| undefined) => { } }); // eslint-disable-line @typescript-eslint/naming-convention\r\n\r\nfunction makeId(...args: Array<string \| number \| null \| undefined>) {\r\n return args.filter((val) => val != null).join(\"--\");\r\n}\r\n\r\nfunction getOptionValueArray(childNodes: React.ReactNode): ListboxItemProps[] {\r\n return React.Children.toArray(childNodes).filter((node) => React.isValidElement(node) && node.props.value).map((optionNode) => ((optionNode as React.ReactElement).props as ListboxItemProps));\r\n}\r\n\r\nfunction processKeyboardNavigation(optionValues: ListboxItemProps[], itemIndex: number, key: string): [number, boolean] {\r\n let keyProcessed = false;\r\n let newIndex = itemIndex >= 0 ? itemIndex : 0;\r\n\r\n // Note: In aria example Page Up/Down just moves up or down by one item. See https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js\r\n if (key === SpecialKey.ArrowDown \|\| key === SpecialKey.PageDown) {\r\n for (let i = itemIndex + 1; i < optionValues.length; i++) {\r\n if (!optionValues[i].disabled) {\r\n newIndex = i;\r\n break;\r\n }\r\n }\r\n keyProcessed = true;\r\n } else if (key === SpecialKey.ArrowUp \|\| key === SpecialKey.PageUp) {\r\n for (let i = itemIndex - 1; i >= 0; i--) {\r\n if (!optionValues[i].disabled) {\r\n newIndex = i;\r\n break;\r\n }\r\n }\r\n keyProcessed = true;\r\n } else if (key === SpecialKey.Home) {\r\n for (let i = 0; i < optionValues.length; i++) {\r\n if (!optionValues[i].disabled) {\r\n newIndex = i;\r\n break;\r\n }\r\n }\r\n keyProcessed = true;\r\n } else if (key === SpecialKey.End) {\r\n for (let i = optionValues.length - 1; i >= 0; i--) {\r\n if (!optionValues[i].disabled) {\r\n newIndex = i;\r\n break;\r\n }\r\n }\r\n keyProcessed = true;\r\n }\r\n return [newIndex, keyProcessed];\r\n}\r\n\r\n/\r\n Single select `Listbox` component\r\n * @alpha\r\n /\r\nexport function Listbox(props: ListboxProps) {\r\n const { ariaLabel, ariaLabelledBy, id, children, selectedValue, className, onListboxValueChange, onKeyDown, ...otherProps } = props;\r\n const listRef = React.useRef<HTMLUListElement>(null);\r\n const [listId] = React.useState(() => { return id ?? Guid.createValue(); });\r\n const optionValues = React.useMemo(() => getOptionValueArray(children), [children]);\r\n const classes = React.useMemo(() => classnames(\"core-listbox\", className), [className]);\r\n const [currentValue, setCurrentValue] = React.useState<ListboxValue \| undefined>(selectedValue);\r\n const [focusValue, setFocusValue] = React.useState<ListboxValue \| undefined>(currentValue);\r\n\r\n React.useEffect(() => {\r\n setCurrentValue(selectedValue);\r\n setFocusValue(selectedValue);\r\n }, [selectedValue]);\r\n\r\n const scrollTopRef = React.useRef(0);\r\n const handleValueChange = React.useCallback((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => {\r\n // istanbul ignore else\r\n if (newValue !== currentValue) {\r\n setCurrentValue(newValue);\r\n setFocusValue(newValue);\r\n if (onListboxValueChange)\r\n onListboxValueChange(newValue, isControlOrCommandPressed);\r\n }\r\n }, [setCurrentValue, currentValue, onListboxValueChange]);\r\n\r\n const focusOption = React.useCallback((itemIndex: number) => {\r\n // istanbul ignore else\r\n if (itemIndex >= 0 && itemIndex < optionValues.length) {\r\n const newSelection = optionValues[itemIndex];\r\n const listElement = listRef.current as HTMLUListElement;\r\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\r\n const optionToFocus = listElement.querySelector(`li[data-value=\"${newSelection.value}\"]`) as HTMLLIElement \| null;\r\n // istanbul ignore else\r\n if (optionToFocus && listElement) {\r\n let newScrollTop = listElement.scrollTop;\r\n\r\n // istanbul ignore next\r\n if (listElement.scrollHeight > listElement.clientHeight) {\r\n const scrollBottom = listElement.clientHeight + listElement.scrollTop;\r\n const elementBottom = optionToFocus.offsetTop + optionToFocus.offsetHeight;\r\n if (elementBottom > scrollBottom) {\r\n newScrollTop = elementBottom - listElement.clientHeight;\r\n } else if (optionToFocus.offsetTop < listElement.scrollTop) {\r\n newScrollTop = optionToFocus.offsetTop;\r\n }\r\n scrollTopRef.current = newScrollTop;\r\n }\r\n setFocusValue(newSelection.value);\r\n }\r\n }\r\n }, [optionValues]);\r\n\r\n const handleKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLUListElement>) => {\r\n if (optionValues.length < 1)\r\n return;\r\n\r\n const itemIndex = (undefined === focusValue) ? -1 : optionValues.findIndex((optionValue) => ((optionValue.value === focusValue)));\r\n\r\n if (event.key === SpecialKey.Space) {\r\n event.preventDefault();\r\n // istanbul ignore else\r\n if (focusValue)\r\n handleValueChange(focusValue, event.getModifierState(\"Control\") \|\| event.getModifierState(\"Meta\")); // Control or Command\r\n return;\r\n } else {\r\n const [newItemIndex, keyProcessed] = processKeyboardNavigation(optionValues, itemIndex, event.key);\r\n // istanbul ignore else\r\n if (keyProcessed) {\r\n event.preventDefault();\r\n focusOption(newItemIndex);\r\n return;\r\n }\r\n }\r\n\r\n // istanbul ignore else\r\n if (onKeyDown)\r\n onKeyDown(event);\r\n }, [focusValue, optionValues, focusOption, onKeyDown, handleValueChange]);\r\n\r\n const isInitialMount = React.useRef(true);\r\n\r\n React.useEffect(() => {\r\n const list = listRef.current as HTMLUListElement;\r\n\r\n if (isInitialMount.current) {\r\n isInitialMount.current = false;\r\n\r\n if (undefined !== focusValue) {\r\n const itemIndex = optionValues.findIndex((optionValue) => (optionValue.value === focusValue));\r\n focusOption(itemIndex);\r\n }\r\n } else {\r\n list.scrollTop = scrollTopRef.current;\r\n }\r\n }, [focusValue, focusOption, optionValues]);\r\n\r\n // istanbul ignore next\r\n const handleOnScroll = React.useCallback((_event: React.UIEvent<HTMLUListElement, UIEvent>) => {\r\n if (listRef.current)\r\n scrollTopRef.current = listRef.current.scrollTop;\r\n }, []);\r\n\r\n // istanbul ignore next\r\n const handleOnFocus = React.useCallback((_event: React.FocusEvent<HTMLUListElement>) => {\r\n if (!focusValue \|\| 0 === focusValue.length) {\r\n if (currentValue) {\r\n setFocusValue(currentValue);\r\n } else {\r\n if (optionValues.length > 0)\r\n setFocusValue(optionValues[0].value);\r\n }\r\n }\r\n }, [currentValue, focusValue, optionValues]);\r\n\r\n return <ul\r\n className={classes}\r\n // If the listbox is not part of another widget, then it has a visible\r\n // label referenced by `aria-labelledby` on the element with role\r\n // `listbox`.\r\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n // If an `aria-label` is passed, we should skip `aria-labelledby` to\r\n // avoid confusion.\r\n aria-labelledby={ariaLabel ? undefined : ariaLabelledBy}\r\n aria-label={ariaLabel}\r\n // An element that contains or owns all the listbox options has role\r\n // listbox.\r\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n role=\"listbox\"\r\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-collapsible.html\r\n tabIndex={0}\r\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-scrollable.html\r\n aria-activedescendant={makeId(currentValue, listId)}\r\n {...otherProps}\r\n ref={listRef}\r\n id={listId}\r\n onKeyDown={handleKeyDown}\r\n onScroll={handleOnScroll}\r\n data-value={currentValue}\r\n data-focusvalue={focusValue}\r\n onFocus={handleOnFocus}\r\n >\r\n <ListboxContext.Provider\r\n value={{\r\n listboxValue: currentValue,\r\n focusValue,\r\n listboxId: listId,\r\n onListboxValueChange: handleValueChange,\r\n listboxRef: listRef,\r\n }}\r\n >\r\n {children}\r\n </ListboxContext.Provider>\r\n </ul>;\r\n}\r\n\r\n/\r\n `ListboxItem` component.\r\n * @alpha\r\n */\r\nexport function ListboxItem(props: ListboxItemProps) {\r\n const {\r\n children,\r\n value,\r\n className,\r\n disabled,\r\n ...otherProps\r\n } = props;\r\n\r\n const {\r\n listboxValue,\r\n focusValue,\r\n listboxId,\r\n onListboxValueChange,\r\n } = React.useContext(ListboxContext);\r\n\r\n const hasFocus = focusValue === value;\r\n\r\n const classes = React.useMemo(() => classnames(\"core-listbox-item\", hasFocus && \"focused\", className), [className, hasFocus]);\r\n const itemRef = React.useRef<HTMLLIElement>(null);\r\n const isSelected = listboxValue === value;\r\n\r\n const handleClick = React.useCallback((event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\r\n event.preventDefault();\r\n // istanbul ignore next\r\n const selectedValue = event.currentTarget?.dataset?.value;\r\n // istanbul ignore else\r\n if (undefined !== selectedValue) {\r\n onListboxValueChange(selectedValue, event.ctrlKey);\r\n }\r\n }, [onListboxValueChange]);\r\n\r\n const getItemId = React.useCallback(() => {\r\n return makeId(value, listboxId);\r\n }, [listboxId, value]);\r\n\r\n return (\r\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n <li\r\n // In a single-select listbox, the selected option has `aria-selected`\r\n // set to `true`.\r\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n aria-selected={isSelected}\r\n // Applicable to all host language elements regardless of whether a\r\n // `role` is applied.\r\n // https://www.w3.org/WAI/PF/aria/states_and_properties#global_states_header\r\n aria-disabled={disabled \|\| undefined}\r\n // Each option in the listbox has role `option` and is a DOM descendant\r\n // of the element with role `listbox`.\r\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\r\n role=\"option\"\r\n className={classes}\r\n {...otherProps}\r\n ref={itemRef}\r\n id={getItemId()}\r\n // used for css styling\r\n data-value={value}\r\n onClick={handleClick}\r\n >\r\n {children}\r\n </li>\r\n );\r\n}\r\n"]}
1	+ {"version":3,"file":"Listbox.js","sourceRoot":"","sources":["../../../../src/core-react/listbox/Listbox.tsx"],"names":[],"mappings":"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","sourcesContent":["/---------------------------------------------------------------------------------------------\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n--------------------------------------------------------------------------------------------/\nimport * as React from \"react\";\nimport classnames from \"classnames\";\n\nimport \"./Listbox.scss\";\nimport { Guid } from \"@itwin/core-bentley\";\nimport { SpecialKey } from \"@itwin/appui-abstract\";\n\n/** Ideas borrowed from https://reacttraining.com/reach-ui/listbox /\n\n/\n `Listbox` value.\n * @alpha\n /\nexport type ListboxValue = string;\n\n/\n `Listbox` Props.\n * @alpha\n /\nexport interface ListboxProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement> {\n id?: string;\n selectedValue?: ListboxValue;\n ariaLabel?: any;\n ariaLabelledBy?: any;\n onListboxValueChange?: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\n}\n\n/\n `ListboxItem` Props.\n * @alpha\n /\nexport interface ListboxItemProps extends React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement> {\n /* The unique item's value. /\n value: ListboxValue;\n /* set if item is disabled. /\n disabled?: boolean;\n}\n\n/\n `Listbox` Context.\n * @alpha\n /\nexport interface ListboxContextProps {\n listboxId?: string;\n listboxValue?: ListboxValue;\n focusValue?: ListboxValue;\n onListboxValueChange: ((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => void);\n listboxRef?: React.RefObject<HTMLUListElement>;\n}\n\n/\n Context set up by listbox for use by `ListboxItems` .\n * @alpha\n /\n// istanbul ignore next\nexport const ListboxContext = React.createContext<ListboxContextProps>({ onListboxValueChange: (_newValue: ListboxValue \| undefined) => { } }); // eslint-disable-line @typescript-eslint/naming-convention\n\nfunction makeId(...args: Array<string \| number \| null \| undefined>) {\n return args.filter((val) => val != null).join(\"--\");\n}\n\nfunction getOptionValueArray(childNodes: React.ReactNode): ListboxItemProps[] {\n return React.Children.toArray(childNodes).filter((node) => React.isValidElement(node) && node.props.value).map((optionNode) => ((optionNode as React.ReactElement).props as ListboxItemProps));\n}\n\nfunction processKeyboardNavigation(optionValues: ListboxItemProps[], itemIndex: number, key: string): [number, boolean] {\n let keyProcessed = false;\n let newIndex = itemIndex >= 0 ? itemIndex : 0;\n\n // Note: In aria example Page Up/Down just moves up or down by one item. See https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js\n if (key === SpecialKey.ArrowDown \|\| key === SpecialKey.PageDown) {\n for (let i = itemIndex + 1; i < optionValues.length; i++) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === SpecialKey.ArrowUp \|\| key === SpecialKey.PageUp) {\n for (let i = itemIndex - 1; i >= 0; i--) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === SpecialKey.Home) {\n for (let i = 0; i < optionValues.length; i++) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n } else if (key === SpecialKey.End) {\n for (let i = optionValues.length - 1; i >= 0; i--) {\n if (!optionValues[i].disabled) {\n newIndex = i;\n break;\n }\n }\n keyProcessed = true;\n }\n return [newIndex, keyProcessed];\n}\n\n/\n Single select `Listbox` component\n * @alpha\n /\nexport function Listbox(props: ListboxProps) {\n const { ariaLabel, ariaLabelledBy, id, children, selectedValue, className, onListboxValueChange, onKeyDown, ...otherProps } = props;\n const listRef = React.useRef<HTMLUListElement>(null);\n const [listId] = React.useState(() => { return id ?? Guid.createValue(); });\n const optionValues = React.useMemo(() => getOptionValueArray(children), [children]);\n const classes = React.useMemo(() => classnames(\"core-listbox\", className), [className]);\n const [currentValue, setCurrentValue] = React.useState<ListboxValue \| undefined>(selectedValue);\n const [focusValue, setFocusValue] = React.useState<ListboxValue \| undefined>(currentValue);\n\n React.useEffect(() => {\n setCurrentValue(selectedValue);\n setFocusValue(selectedValue);\n }, [selectedValue]);\n\n const scrollTopRef = React.useRef(0);\n const handleValueChange = React.useCallback((newValue: ListboxValue, isControlOrCommandPressed?: boolean) => {\n // istanbul ignore else\n if (newValue !== currentValue) {\n setCurrentValue(newValue);\n setFocusValue(newValue);\n if (onListboxValueChange)\n onListboxValueChange(newValue, isControlOrCommandPressed);\n }\n }, [setCurrentValue, currentValue, onListboxValueChange]);\n\n const focusOption = React.useCallback((itemIndex: number) => {\n // istanbul ignore else\n if (itemIndex >= 0 && itemIndex < optionValues.length) {\n const newSelection = optionValues[itemIndex];\n const listElement = listRef.current as HTMLUListElement;\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n const optionToFocus = listElement.querySelector(`li[data-value=\"${newSelection.value}\"]`) as HTMLLIElement \| null;\n // istanbul ignore else\n if (optionToFocus && listElement) {\n let newScrollTop = listElement.scrollTop;\n\n // istanbul ignore next\n if (listElement.scrollHeight > listElement.clientHeight) {\n const scrollBottom = listElement.clientHeight + listElement.scrollTop;\n const elementBottom = optionToFocus.offsetTop + optionToFocus.offsetHeight;\n if (elementBottom > scrollBottom) {\n newScrollTop = elementBottom - listElement.clientHeight;\n } else if (optionToFocus.offsetTop < listElement.scrollTop) {\n newScrollTop = optionToFocus.offsetTop;\n }\n scrollTopRef.current = newScrollTop;\n }\n setFocusValue(newSelection.value);\n }\n }\n }, [optionValues]);\n\n const handleKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLUListElement>) => {\n if (optionValues.length < 1)\n return;\n\n const itemIndex = (undefined === focusValue) ? -1 : optionValues.findIndex((optionValue) => ((optionValue.value === focusValue)));\n\n if (event.key === SpecialKey.Space) {\n event.preventDefault();\n // istanbul ignore else\n if (focusValue)\n handleValueChange(focusValue, event.getModifierState(\"Control\") \|\| event.getModifierState(\"Meta\")); // Control or Command\n return;\n } else {\n const [newItemIndex, keyProcessed] = processKeyboardNavigation(optionValues, itemIndex, event.key);\n // istanbul ignore else\n if (keyProcessed) {\n event.preventDefault();\n focusOption(newItemIndex);\n return;\n }\n }\n\n // istanbul ignore else\n if (onKeyDown)\n onKeyDown(event);\n }, [focusValue, optionValues, focusOption, onKeyDown, handleValueChange]);\n\n const isInitialMount = React.useRef(true);\n\n React.useEffect(() => {\n const list = listRef.current as HTMLUListElement;\n\n if (isInitialMount.current) {\n isInitialMount.current = false;\n\n if (undefined !== focusValue) {\n const itemIndex = optionValues.findIndex((optionValue) => (optionValue.value === focusValue));\n focusOption(itemIndex);\n }\n } else {\n list.scrollTop = scrollTopRef.current;\n }\n }, [focusValue, focusOption, optionValues]);\n\n // istanbul ignore next\n const handleOnScroll = React.useCallback((_event: React.UIEvent<HTMLUListElement, UIEvent>) => {\n if (listRef.current)\n scrollTopRef.current = listRef.current.scrollTop;\n }, []);\n\n // istanbul ignore next\n const handleOnFocus = React.useCallback((_event: React.FocusEvent<HTMLUListElement>) => {\n if (!focusValue \|\| 0 === focusValue.length) {\n if (currentValue) {\n setFocusValue(currentValue);\n } else {\n if (optionValues.length > 0)\n setFocusValue(optionValues[0].value);\n }\n }\n }, [currentValue, focusValue, optionValues]);\n\n return <ul\n className={classes}\n // If the listbox is not part of another widget, then it has a visible\n // label referenced by `aria-labelledby` on the element with role\n // `listbox`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n // If an `aria-label` is passed, we should skip `aria-labelledby` to\n // avoid confusion.\n aria-labelledby={ariaLabel ? undefined : ariaLabelledBy}\n aria-label={ariaLabel}\n // An element that contains or owns all the listbox options has role\n // listbox.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n role=\"listbox\"\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-collapsible.html\n tabIndex={0}\n // https://www.w3.org/TR/wai-aria-practices-1.2/examples/listbox/listbox-scrollable.html\n aria-activedescendant={makeId(currentValue, listId)}\n {...otherProps}\n ref={listRef}\n id={listId}\n onKeyDown={handleKeyDown}\n onScroll={handleOnScroll}\n data-value={currentValue}\n data-focusvalue={focusValue}\n onFocus={handleOnFocus}\n >\n <ListboxContext.Provider\n value={{\n listboxValue: currentValue,\n focusValue,\n listboxId: listId,\n onListboxValueChange: handleValueChange,\n listboxRef: listRef,\n }}\n >\n {children}\n </ListboxContext.Provider>\n </ul>;\n}\n\n/\n `ListboxItem` component.\n * @alpha\n */\nexport function ListboxItem(props: ListboxItemProps) {\n const {\n children,\n value,\n className,\n disabled,\n ...otherProps\n } = props;\n\n const {\n listboxValue,\n focusValue,\n listboxId,\n onListboxValueChange,\n } = React.useContext(ListboxContext);\n\n const hasFocus = focusValue === value;\n\n const classes = React.useMemo(() => classnames(\"core-listbox-item\", hasFocus && \"focused\", className), [className, hasFocus]);\n const itemRef = React.useRef<HTMLLIElement>(null);\n const isSelected = listboxValue === value;\n\n const handleClick = React.useCallback((event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\n event.preventDefault();\n // istanbul ignore next\n const selectedValue = event.currentTarget?.dataset?.value;\n // istanbul ignore else\n if (undefined !== selectedValue) {\n onListboxValueChange(selectedValue, event.ctrlKey);\n }\n }, [onListboxValueChange]);\n\n const getItemId = React.useCallback(() => {\n return makeId(value, listboxId);\n }, [listboxId, value]);\n\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n <li\n // In a single-select listbox, the selected option has `aria-selected`\n // set to `true`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n aria-selected={isSelected}\n // Applicable to all host language elements regardless of whether a\n // `role` is applied.\n // https://www.w3.org/WAI/PF/aria/states_and_properties#global_states_header\n aria-disabled={disabled \|\| undefined}\n // Each option in the listbox has role `option` and is a DOM descendant\n // of the element with role `listbox`.\n // https://www.w3.org/TR/wai-aria-practices-1.2/#Listbox\n role=\"option\"\n className={classes}\n {...otherProps}\n ref={itemRef}\n id={getItemId()}\n // used for css styling\n data-value={value}\n onClick={handleClick}\n >\n {children}\n </li>\n );\n}\n"]}

package/lib/esm/core-react/listbox/Listbox.scss CHANGED Viewed

@@ -1,54 +1,54 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "../index";
-$uicore-list-item-height: calc(var(--iui-size-s) * 2);
-ul.core-listbox {
-  list-style: none;
-  outline: none;
-  padding: 0;
-  margin: 0;
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  overflow: auto;
-  color: var(--iui-color-text);
-  border: 1px solid var(--iui-color-border);
-  position: relative; // required to properly set scrollTop position
-  @include uicore-touch-scrolling;
-  @include uicore-scrollbar();
-  &:focus {
-    border-color: var(--iui-color-border-accent);
-    li.core-listbox-item.focused {
-      background-color: var(--iui-color-background-accent-muted);
-      border: 1px solid var(--iui-color-border-accent);
-    }
-  }
-  li.core-listbox-item {
-    display: inline-flex;
-    line-height: $uicore-list-item-height;
-    padding-left: 4px;
-    &[aria-selected="true"] {
-      background-color: var(--iui-color-background-accent-muted);
-    }
-    &[aria-disabled="true"] {
-      pointer-events: none;
-      color: var(--iui-color-text-disabled);
-    }
-    &:hover {
-      background-color: var(--iui-color-background-hover);
-    }
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../index";
+$uicore-list-item-height: calc(var(--iui-size-s) * 2);
+ul.core-listbox {
+  list-style: none;
+  outline: none;
+  padding: 0;
+  margin: 0;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: auto;
+  color: var(--iui-color-text);
+  border: 1px solid var(--iui-color-border);
+  position: relative; // required to properly set scrollTop position
+  @include uicore-touch-scrolling;
+  @include uicore-scrollbar();
+  &:focus {
+    border-color: var(--iui-color-border-accent);
+    li.core-listbox-item.focused {
+      background-color: var(--iui-color-background-accent-muted);
+      border: 1px solid var(--iui-color-border-accent);
+    }
+  }
+  li.core-listbox-item {
+    display: inline-flex;
+    line-height: $uicore-list-item-height;
+    padding-left: 4px;
+    &[aria-selected="true"] {
+      background-color: var(--iui-color-background-accent-muted);
+    }
+    &[aria-disabled="true"] {
+      pointer-events: none;
+      color: var(--iui-color-text-disabled);
+    }
+    &:hover {
+      background-color: var(--iui-color-background-hover);
+    }
+  }
+}

package/lib/esm/core-react/loading/LoadingBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoadingBar.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingBar.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAC3B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B;;;GAGG;AACH,MAAa,UAAW,SAAQ,KAAK,CAAC,aAA8B;IAKlD,MAAM;QACpB,MAAM,OAAO,GAAG,GAAG,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;QACzD,MAAM,cAAc,GAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QACnE,OAAO,CACL,6BAAK,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACrD,6BAAK,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;gBACnE,6BAAK,SAAS,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,GAAI,CAC/C;YACL,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,8BAAM,SAAS,EAAC,SAAS,IAAE,OAAO,CAAQ,CACpE,CACP,CAAC;IACJ,CAAC;;AAfa,uBAAY,GAA6B;IACrD,SAAS,EAAE,CAAC;CACb,CAAC;SAHS,UAAU;AAmBvB;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,OAAe;IAC5C,IAAI,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IACnC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAC3B,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["/---------------------------------------------------------------------------------------------\r\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n--------------------------------------------------------------------------------------------/\r\n/** @packageDocumentation\r\n * @module Loading\r\n /\r\n\r\nimport \"./LoadingBar.scss\";\r\nimport classnames from \"classnames\";\r\nimport as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for [[LoadingBar]] component\r\n * @public\r\n /\r\nexport interface LoadingBarProps extends CommonProps {\r\n /* Percent /\r\n percent: number;\r\n /* Show percentage (optional) /\r\n showPercentage?: boolean;\r\n /* Height (in pixels) of the loading bar /\r\n barHeight: number;\r\n}\r\n\r\n/\r\n A loading bar with optional percentage text.\r\n * @public\r\n /\r\nexport class LoadingBar extends React.PureComponent<LoadingBarProps> {\r\n public static defaultProps: Partial<LoadingBarProps> = {\r\n barHeight: 4,\r\n };\r\n\r\n public override render() {\r\n const percent = `${percentInRange(this.props.percent)}%`;\r\n const containerClass = classnames(this.props.className, \"core-lb\");\r\n return (\r\n <div className={containerClass} style={this.props.style}>\r\n <div className=\"lb-container\" style={{ height: this.props.barHeight }}>\r\n <div className=\"fill\" style={{ width: percent }} />\r\n </div>\r\n {this.props.showPercentage && <span className=\"percent\">{percent}</span>}\r\n </div>\r\n );\r\n }\r\n}\r\n\r\n/* Sanity check to keep percentage between 0 & 100\r\n * @internal\r\n */\r\nexport function percentInRange(percent: number): number {\r\n let value = Math.min(percent, 100);\r\n value = Math.max(value, 0);\r\n return value;\r\n}\r\n"]}
1	+ {"version":3,"file":"LoadingBar.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingBar.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAC3B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B;;;GAGG;AACH,MAAa,UAAW,SAAQ,KAAK,CAAC,aAA8B;IAKlD,MAAM;QACpB,MAAM,OAAO,GAAG,GAAG,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;QACzD,MAAM,cAAc,GAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QACnE,OAAO,CACL,6BAAK,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACrD,6BAAK,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;gBACnE,6BAAK,SAAS,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,GAAI,CAC/C;YACL,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,8BAAM,SAAS,EAAC,SAAS,IAAE,OAAO,CAAQ,CACpE,CACP,CAAC;IACJ,CAAC;;AAfa,uBAAY,GAA6B;IACrD,SAAS,EAAE,CAAC;CACb,CAAC;SAHS,UAAU;AAmBvB;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,OAAe;IAC5C,IAAI,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IACnC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAC3B,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["/---------------------------------------------------------------------------------------------\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n--------------------------------------------------------------------------------------------/\n/** @packageDocumentation\n * @module Loading\n /\n\nimport \"./LoadingBar.scss\";\nimport classnames from \"classnames\";\nimport as React from \"react\";\nimport { CommonProps } from \"../utils/Props\";\n\n/** Properties for [[LoadingBar]] component\n * @public\n /\nexport interface LoadingBarProps extends CommonProps {\n /* Percent /\n percent: number;\n /* Show percentage (optional) /\n showPercentage?: boolean;\n /* Height (in pixels) of the loading bar /\n barHeight: number;\n}\n\n/\n A loading bar with optional percentage text.\n * @public\n /\nexport class LoadingBar extends React.PureComponent<LoadingBarProps> {\n public static defaultProps: Partial<LoadingBarProps> = {\n barHeight: 4,\n };\n\n public override render() {\n const percent = `${percentInRange(this.props.percent)}%`;\n const containerClass = classnames(this.props.className, \"core-lb\");\n return (\n <div className={containerClass} style={this.props.style}>\n <div className=\"lb-container\" style={{ height: this.props.barHeight }}>\n <div className=\"fill\" style={{ width: percent }} />\n </div>\n {this.props.showPercentage && <span className=\"percent\">{percent}</span>}\n </div>\n );\n }\n}\n\n/* Sanity check to keep percentage between 0 & 100\n * @internal\n */\nexport function percentInRange(percent: number): number {\n let value = Math.min(percent, 100);\n value = Math.max(value, 0);\n return value;\n}\n"]}

package/lib/esm/core-react/loading/LoadingBar.scss CHANGED Viewed

@@ -1,29 +1,29 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "../style/themecolors";
-.core-lb {
-  display: flex;
-  align-items: center;
-  > .lb-container {
-    background-color: $buic-background-5;
-    flex: 1;
-    > .fill {
-      height: 100%;
-      background-color: $buic-foreground-primary;
-      transition: width .3s linear;
-    }
-  }
-  > .percent {
-    flex: initial;
-    opacity: 0.85;
-    width: 3em;
-    font-size: .9em;
-    margin-left: .3em;
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/themecolors";
+.core-lb {
+  display: flex;
+  align-items: center;
+  > .lb-container {
+    background-color: $buic-background-5;
+    flex: 1;
+    > .fill {
+      height: 100%;
+      background-color: $buic-foreground-primary;
+      transition: width .3s linear;
+    }
+  }
+  > .percent {
+    flex: initial;
+    opacity: 0.85;
+    width: 3em;
+    font-size: .9em;
+    margin-left: .3em;
+  }
+}

package/lib/esm/core-react/loading/LoadingPrompt.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoadingPrompt.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingPrompt.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AA+BhD;;;GAGG;AACH,MAAa,aAAc,SAAQ,KAAK,CAAC,aAAiC;IAWxD,MAAM;QACpB,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC;QAE/C,OAAO,CACL,6BAAK,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YAC7F,8BAAM,SAAS,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAQ;YAChD,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,8BAAM,SAAS,EAAC,SAAS,IAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAQ;YAC3E,aAAa,IAAI,oBAAC,UAAU,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,GAAI;YACjI,CAAC,aAAa,IAAI,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;gBACvC,oBAAC,aAAa,IAAC,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAI;YAC3I,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,oBAAC,cAAc,IAAC,aAAa,SAAG,CAAC,CAAC,CAAC,oBAAC,cAAc,OAAG,CAAC;YAC3G,IAAI,CAAC,KAAK,CAAC,UAAU,IAAI,oBAAC,MAAM,IAAC,SAAS,EAAC,uBAAuB,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,aAAiB,CAC7G,CACP,CAAC;IACJ,CAAC;;AAxBa,0BAAY,GAAgC;IACxD,cAAc,EAAE,KAAK;IACrB,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,KAAK;IACjB,aAAa,EAAE,KAAK;IACpB,oBAAoB,EAAE,KAAK;IAC3B,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,EAAE;CACX,CAAC;SATS,aAAa","sourcesContent":["/---------------------------------------------------------------------------------------------\r\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n--------------------------------------------------------------------------------------------/\r\n/** @packageDocumentation\r\n * @module Loading\r\n /\r\n\r\nimport \"./LoadingPrompt.scss\";\r\nimport classnames from \"classnames\";\r\nimport as React from \"react\";\r\nimport { Button, ProgressLinear } from \"@itwin/itwinui-react\";\r\nimport { LoadingBar } from \"./LoadingBar\";\r\nimport { LoadingSpinner } from \"./LoadingSpinner\";\r\nimport { LoadingStatus } from \"./LoadingStatus\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n// cspell:ignore loadingprompt\r\n\r\n/** Properties for [[LoadingPrompt]] component\r\n * @public\r\n /\r\nexport interface LoadingPromptProps extends CommonProps {\r\n /* Title /\r\n title: string;\r\n /* Message displayed below the title (optional) /\r\n message?: string;\r\n /* Determine if a percentage bar is displayed (isDeterminate=true), otherwise a loading spinner or indeterminate progress bar is shown. /\r\n isDeterminate: boolean;\r\n /* Show current status and percentage. Default is false (not shown) /\r\n showStatus: boolean;\r\n /* Show cancel button. Default is false (not shown) /\r\n showCancel: boolean;\r\n /* Current loading status text (optional). Only shown if showStatus=true and isDeterminate=true /\r\n status: string;\r\n /* Current percentage. Only used if isDeterminate=true /\r\n percent: number;\r\n /* Show percentage at the end of the loading bar (optional). Only shown if isDeterminate=true and showStatus=false /\r\n showPercentage: boolean;\r\n /* Show indeterminate progress bar instead of loading spinner /\r\n showIndeterminateBar: boolean;\r\n /* Function called when Cancel button is clicked. /\r\n onCancel?: () => void;\r\n}\r\n\r\n/\r\n A component to display during loading that optionally shows percentage, status text and a cancel button.\r\n * @public\r\n */\r\nexport class LoadingPrompt extends React.PureComponent<LoadingPromptProps> {\r\n public static defaultProps: Partial<LoadingPromptProps> = {\r\n showPercentage: false,\r\n showStatus: false,\r\n showCancel: false,\r\n isDeterminate: false,\r\n showIndeterminateBar: false,\r\n percent: 0,\r\n status: \"\",\r\n };\r\n\r\n public override render() {\r\n const isDeterminate = this.props.isDeterminate;\r\n\r\n return (\r\n <div className={classnames(\"core-loadingprompt\", this.props.className)} style={this.props.style}>\r\n <span className=\"title\">{this.props.title}</span>\r\n {this.props.message && <span className=\"message\">{this.props.message}</span>}\r\n {isDeterminate && <LoadingBar style={{ width: \"100%\" }} percent={this.props.percent} showPercentage={this.props.showPercentage} />}\r\n {(isDeterminate && this.props.showStatus) &&\r\n <LoadingStatus style={{ marginTop: \".5em\", width: \"100%\", fontSize: \".75em\" }} percent={this.props.percent} message={this.props.status} />}\r\n {!isDeterminate && (this.props.showIndeterminateBar ? <ProgressLinear indeterminate /> : <LoadingSpinner />)}\r\n {this.props.showCancel && <Button className=\"loading-prompt-cancel\" onClick={this.props.onCancel}>Cancel</Button>}\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"LoadingPrompt.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingPrompt.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AA+BhD;;;GAGG;AACH,MAAa,aAAc,SAAQ,KAAK,CAAC,aAAiC;IAWxD,MAAM;QACpB,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC;QAE/C,OAAO,CACL,6BAAK,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YAC7F,8BAAM,SAAS,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAQ;YAChD,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,8BAAM,SAAS,EAAC,SAAS,IAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAQ;YAC3E,aAAa,IAAI,oBAAC,UAAU,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,GAAI;YACjI,CAAC,aAAa,IAAI,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;gBACvC,oBAAC,aAAa,IAAC,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAI;YAC3I,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,oBAAC,cAAc,IAAC,aAAa,SAAG,CAAC,CAAC,CAAC,oBAAC,cAAc,OAAG,CAAC;YAC3G,IAAI,CAAC,KAAK,CAAC,UAAU,IAAI,oBAAC,MAAM,IAAC,SAAS,EAAC,uBAAuB,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,aAAiB,CAC7G,CACP,CAAC;IACJ,CAAC;;AAxBa,0BAAY,GAAgC;IACxD,cAAc,EAAE,KAAK;IACrB,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,KAAK;IACjB,aAAa,EAAE,KAAK;IACpB,oBAAoB,EAAE,KAAK;IAC3B,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,EAAE;CACX,CAAC;SATS,aAAa","sourcesContent":["/---------------------------------------------------------------------------------------------\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n--------------------------------------------------------------------------------------------/\n/** @packageDocumentation\n * @module Loading\n /\n\nimport \"./LoadingPrompt.scss\";\nimport classnames from \"classnames\";\nimport as React from \"react\";\nimport { Button, ProgressLinear } from \"@itwin/itwinui-react\";\nimport { LoadingBar } from \"./LoadingBar\";\nimport { LoadingSpinner } from \"./LoadingSpinner\";\nimport { LoadingStatus } from \"./LoadingStatus\";\nimport { CommonProps } from \"../utils/Props\";\n\n// cspell:ignore loadingprompt\n\n/** Properties for [[LoadingPrompt]] component\n * @public\n /\nexport interface LoadingPromptProps extends CommonProps {\n /* Title /\n title: string;\n /* Message displayed below the title (optional) /\n message?: string;\n /* Determine if a percentage bar is displayed (isDeterminate=true), otherwise a loading spinner or indeterminate progress bar is shown. /\n isDeterminate: boolean;\n /* Show current status and percentage. Default is false (not shown) /\n showStatus: boolean;\n /* Show cancel button. Default is false (not shown) /\n showCancel: boolean;\n /* Current loading status text (optional). Only shown if showStatus=true and isDeterminate=true /\n status: string;\n /* Current percentage. Only used if isDeterminate=true /\n percent: number;\n /* Show percentage at the end of the loading bar (optional). Only shown if isDeterminate=true and showStatus=false /\n showPercentage: boolean;\n /* Show indeterminate progress bar instead of loading spinner /\n showIndeterminateBar: boolean;\n /* Function called when Cancel button is clicked. /\n onCancel?: () => void;\n}\n\n/\n A component to display during loading that optionally shows percentage, status text and a cancel button.\n * @public\n */\nexport class LoadingPrompt extends React.PureComponent<LoadingPromptProps> {\n public static defaultProps: Partial<LoadingPromptProps> = {\n showPercentage: false,\n showStatus: false,\n showCancel: false,\n isDeterminate: false,\n showIndeterminateBar: false,\n percent: 0,\n status: \"\",\n };\n\n public override render() {\n const isDeterminate = this.props.isDeterminate;\n\n return (\n <div className={classnames(\"core-loadingprompt\", this.props.className)} style={this.props.style}>\n <span className=\"title\">{this.props.title}</span>\n {this.props.message && <span className=\"message\">{this.props.message}</span>}\n {isDeterminate && <LoadingBar style={{ width: \"100%\" }} percent={this.props.percent} showPercentage={this.props.showPercentage} />}\n {(isDeterminate && this.props.showStatus) &&\n <LoadingStatus style={{ marginTop: \".5em\", width: \"100%\", fontSize: \".75em\" }} percent={this.props.percent} message={this.props.status} />}\n {!isDeterminate && (this.props.showIndeterminateBar ? <ProgressLinear indeterminate /> : <LoadingSpinner />)}\n {this.props.showCancel && <Button className=\"loading-prompt-cancel\" onClick={this.props.onCancel}>Cancel</Button>}\n </div>\n );\n }\n}\n"]}

package/lib/esm/core-react/loading/LoadingPrompt.scss CHANGED Viewed

@@ -1,33 +1,33 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "../style/themecolors";
-// cspell:ignore loadingprompt
-.core-loadingprompt {
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  .title {
-    font-size: 32px;
-    font-weight: 600;
-    margin-bottom: 10px;
-    color: var(--iui-color-text);
-  }
-  .message {
-    font-size: 14px;
-    margin-bottom: 1.75em;
-    color: var(--iui-color-text);
-  }
-}
-/* cancel button */
-.loading-prompt-cancel {
-  margin-top: 2em;
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/themecolors";
+// cspell:ignore loadingprompt
+.core-loadingprompt {
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  .title {
+    font-size: 32px;
+    font-weight: 600;
+    margin-bottom: 10px;
+    color: var(--iui-color-text);
+  }
+  .message {
+    font-size: 14px;
+    margin-bottom: 1.75em;
+    color: var(--iui-color-text);
+  }
+}
+/* cancel button */
+.loading-prompt-cancel {
+  margin-top: 2em;
+}

package/lib/esm/core-react/loading/LoadingSpinner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAuB,MAAM,sBAAsB,CAAC;AAsB3E;;;GAGG;AACH,MAAa,cAAe,SAAQ,KAAK,CAAC,aAAkC;IAK1D,MAAM;QACpB,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5D,OAAO,CACL,6BAAK,SAAS,EAAC,SAAS;YACrB,CAAC,OAAO,IAAI,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,gBAAgB,IAAE,OAAO,CAAQ;YAC/E,oBAAC,cAAc,IAAC,IAAI,EAAE,IAAI,KAAM,IAAI,EAAE,aAAa,SAAG;YACrD,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,mBAAmB,IAAE,OAAO,CAAQ,CAC/E,CACP,CAAC;IACJ,CAAC;;AAba,2BAAY,GAAiC;IACzD,YAAY,EAAE,KAAK;CACpB,CAAC;SAHS,cAAc","sourcesContent":["/---------------------------------------------------------------------------------------------\r\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n--------------------------------------------------------------------------------------------/\r\n/** @packageDocumentation\r\n * @module Loading\r\n /\r\n\r\nimport \"./LoadingSpinner.scss\";\r\nimport as React from \"react\";\r\nimport { ProgressRadial, ProgressRadialProps } from \"@itwin/itwinui-react\";\r\n\r\n/** Type for ProgressRadialProps.size\r\n * @public\r\n /\r\nexport type RadialSizeType = ProgressRadialProps[\"size\"];\r\n\r\n/* Properties for [[LoadingSpinner]] component\r\n * @public\r\n /\r\nexport interface LoadingSpinnerProps extends Omit<ProgressRadialProps, \"size\"> {\r\n /* Message (text) displayed /\r\n message?: string;\r\n /* Position the message above or below the spinner (defaults to bottom) /\r\n messageOnTop?: boolean;\r\n /\r\n Size of the progress indicator. Defaults to medium size.\r\n * @default ''\r\n /\r\n size?: RadialSizeType;\r\n}\r\n\r\n/\r\n A loading spinner component that optionally shows a text message.\r\n * @public\r\n */\r\nexport class LoadingSpinner extends React.PureComponent<LoadingSpinnerProps> {\r\n public static defaultProps: Partial<LoadingSpinnerProps> = {\r\n messageOnTop: false,\r\n };\r\n\r\n public override render() {\r\n const { message, messageOnTop, size, ...rest } = this.props;\r\n return (\r\n <div className=\"core-ls\">\r\n {(message && messageOnTop) && <span className=\"ls-message-top\">{message}</span>}\r\n <ProgressRadial size={size} {...rest} indeterminate />\r\n {(message && !messageOnTop) && <span className=\"ls-message-bottom\">{message}</span>}\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,uBAAuB,CAAC;AAC/B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAuB,MAAM,sBAAsB,CAAC;AAsB3E;;;GAGG;AACH,MAAa,cAAe,SAAQ,KAAK,CAAC,aAAkC;IAK1D,MAAM;QACpB,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC5D,OAAO,CACL,6BAAK,SAAS,EAAC,SAAS;YACrB,CAAC,OAAO,IAAI,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,gBAAgB,IAAE,OAAO,CAAQ;YAC/E,oBAAC,cAAc,IAAC,IAAI,EAAE,IAAI,KAAM,IAAI,EAAE,aAAa,SAAG;YACrD,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,8BAAM,SAAS,EAAC,mBAAmB,IAAE,OAAO,CAAQ,CAC/E,CACP,CAAC;IACJ,CAAC;;AAba,2BAAY,GAAiC;IACzD,YAAY,EAAE,KAAK;CACpB,CAAC;SAHS,cAAc","sourcesContent":["/---------------------------------------------------------------------------------------------\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n--------------------------------------------------------------------------------------------/\n/** @packageDocumentation\n * @module Loading\n /\n\nimport \"./LoadingSpinner.scss\";\nimport as React from \"react\";\nimport { ProgressRadial, ProgressRadialProps } from \"@itwin/itwinui-react\";\n\n/** Type for ProgressRadialProps.size\n * @public\n /\nexport type RadialSizeType = ProgressRadialProps[\"size\"];\n\n/* Properties for [[LoadingSpinner]] component\n * @public\n /\nexport interface LoadingSpinnerProps extends Omit<ProgressRadialProps, \"size\"> {\n /* Message (text) displayed /\n message?: string;\n /* Position the message above or below the spinner (defaults to bottom) /\n messageOnTop?: boolean;\n /\n Size of the progress indicator. Defaults to medium size.\n * @default ''\n /\n size?: RadialSizeType;\n}\n\n/\n A loading spinner component that optionally shows a text message.\n * @public\n */\nexport class LoadingSpinner extends React.PureComponent<LoadingSpinnerProps> {\n public static defaultProps: Partial<LoadingSpinnerProps> = {\n messageOnTop: false,\n };\n\n public override render() {\n const { message, messageOnTop, size, ...rest } = this.props;\n return (\n <div className=\"core-ls\">\n {(message && messageOnTop) && <span className=\"ls-message-top\">{message}</span>}\n <ProgressRadial size={size} {...rest} indeterminate />\n {(message && !messageOnTop) && <span className=\"ls-message-bottom\">{message}</span>}\n </div>\n );\n }\n}\n"]}

package/lib/esm/core-react/loading/LoadingSpinner.scss CHANGED Viewed

@@ -1,26 +1,26 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "../style/themecolors";
-.core-ls {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  .ls-message {
-    color: var(--iui-color-text);
-  }
-  .ls-message-top {
-    @extend .ls-message;
-    margin-bottom: var(--iui-size-s);
-  }
-  .ls-message-bottom {
-    @extend .ls-message;
-    margin-top: var(--iui-size-s);
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "../style/themecolors";
+.core-ls {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  .ls-message {
+    color: var(--iui-color-text);
+  }
+  .ls-message-top {
+    @extend .ls-message;
+    margin-bottom: var(--iui-size-s);
+  }
+  .ls-message-bottom {
+    @extend .ls-message;
+    margin-top: var(--iui-size-s);
+  }
+}

package/lib/esm/core-react/loading/LoadingStatus.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoadingStatus.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingStatus.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B;;;GAGG;AACH,MAAa,aAAc,SAAQ,KAAK,CAAC,aAAiC;IAMxE,kDAAkD;IAC1C,OAAO,CAAC,OAAe;QAC7B,IAAI,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QACnC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC3B,OAAO,KAAK,CAAC;IACf,CAAC;IAEe,MAAM;QACpB,MAAM,OAAO,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;QACvD,MAAM,cAAc,GAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,0BAA0B,CAAC,CAAC;QACpF,OAAO,CACL,6BAAK,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACrD,8BAAM,SAAS,EAAC,wBAAwB,IAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAQ;YACpE,8BAAM,SAAS,EAAC,wBAAwB,IAAE,OAAO,CAAQ,CACrD,CACP,CAAC;IACJ,CAAC;;AArBa,0BAAY,GAAgC;IACxD,OAAO,EAAE,EAAE;IACX,OAAO,EAAE,CAAC;CACX,CAAC;SAJS,aAAa","sourcesContent":["/---------------------------------------------------------------------------------------------\r\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n--------------------------------------------------------------------------------------------/\r\n/** @packageDocumentation\r\n * @module Loading\r\n /\r\n\r\nimport \"./LoadingStatus.scss\";\r\nimport classnames from \"classnames\";\r\nimport as React from \"react\";\r\nimport { CommonProps } from \"../utils/Props\";\r\n\r\n/** Properties for [[LoadingStatus]] component\r\n * @public\r\n /\r\nexport interface LoadingStatusProps extends CommonProps {\r\n /* Message (text) displayed /\r\n message: string;\r\n /* Percent displayed (as text) /\r\n percent: number;\r\n}\r\n\r\n/\r\n A loading indicator that shows status text along with the percentage.\r\n * @public\r\n */\r\nexport class LoadingStatus extends React.PureComponent<LoadingStatusProps> {\r\n public static defaultProps: Partial<LoadingStatusProps> = {\r\n message: \"\",\r\n percent: 0,\r\n };\r\n\r\n // sanity check to keep percentage between 0 & 100\r\n private inRange(percent: number): number {\r\n let value = Math.min(percent, 100);\r\n value = Math.max(value, 0);\r\n return value;\r\n }\r\n\r\n public override render() {\r\n const percent = `${this.inRange(this.props.percent)}%`;\r\n const containerClass = classnames(this.props.className, \"loading-status-container\");\r\n return (\r\n <div className={containerClass} style={this.props.style}>\r\n <span className=\"loading-status-message\">{this.props.message}</span>\r\n <span className=\"loading-status-percent\">{percent}</span>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"LoadingStatus.js","sourceRoot":"","sources":["../../../../src/core-react/loading/LoadingStatus.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAC9B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B;;;GAGG;AACH,MAAa,aAAc,SAAQ,KAAK,CAAC,aAAiC;IAMxE,kDAAkD;IAC1C,OAAO,CAAC,OAAe;QAC7B,IAAI,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;QACnC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC3B,OAAO,KAAK,CAAC;IACf,CAAC;IAEe,MAAM;QACpB,MAAM,OAAO,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;QACvD,MAAM,cAAc,GAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,0BAA0B,CAAC,CAAC;QACpF,OAAO,CACL,6BAAK,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACrD,8BAAM,SAAS,EAAC,wBAAwB,IAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAQ;YACpE,8BAAM,SAAS,EAAC,wBAAwB,IAAE,OAAO,CAAQ,CACrD,CACP,CAAC;IACJ,CAAC;;AArBa,0BAAY,GAAgC;IACxD,OAAO,EAAE,EAAE;IACX,OAAO,EAAE,CAAC;CACX,CAAC;SAJS,aAAa","sourcesContent":["/---------------------------------------------------------------------------------------------\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n--------------------------------------------------------------------------------------------/\n/** @packageDocumentation\n * @module Loading\n /\n\nimport \"./LoadingStatus.scss\";\nimport classnames from \"classnames\";\nimport as React from \"react\";\nimport { CommonProps } from \"../utils/Props\";\n\n/** Properties for [[LoadingStatus]] component\n * @public\n /\nexport interface LoadingStatusProps extends CommonProps {\n /* Message (text) displayed /\n message: string;\n /* Percent displayed (as text) /\n percent: number;\n}\n\n/\n A loading indicator that shows status text along with the percentage.\n * @public\n */\nexport class LoadingStatus extends React.PureComponent<LoadingStatusProps> {\n public static defaultProps: Partial<LoadingStatusProps> = {\n message: \"\",\n percent: 0,\n };\n\n // sanity check to keep percentage between 0 & 100\n private inRange(percent: number): number {\n let value = Math.min(percent, 100);\n value = Math.max(value, 0);\n return value;\n }\n\n public override render() {\n const percent = `${this.inRange(this.props.percent)}%`;\n const containerClass = classnames(this.props.className, \"loading-status-container\");\n return (\n <div className={containerClass} style={this.props.style}>\n <span className=\"loading-status-message\">{this.props.message}</span>\n <span className=\"loading-status-percent\">{percent}</span>\n </div>\n );\n }\n}\n"]}

package/lib/esm/core-react/loading/LoadingStatus.scss CHANGED Viewed

@@ -1,20 +1,20 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-.loading-status-container {
-  display: flex;
-  align-items: center;
-  opacity: 0.90;
-  font-size: 12px;
-}
-.loading-status-message {
-  flex: 1;
-}
-.loading-status-percent {
-  flex: initial;
-  margin-right: auto;
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+.loading-status-container {
+  display: flex;
+  align-items: center;
+  opacity: 0.90;
+  font-size: 12px;
+}
+.loading-status-message {
+  flex: 1;
+}
+.loading-status-percent {
+  flex: initial;
+  margin-right: auto;
+}