@swan-io/lake 4.1.1 → 4.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/lake",
-  "version": "4.1.1",
+  "version": "4.1.2",
   "engines": {
     "node": ">=18.0.0",
     "yarn": "^1.22.0"

package/src/components/Icon.d.ts

@@ -150,6 +150,7 @@ declare const paths: {
     "mail-filled": string;
     "mail-regular": string;
     "money-regular": string;
+    "money-filled": string;
     "more-horizontal-filled": string;
     "more-vertical-filled": string;
     "open-filled": string;

package/src/components/LakeCombobox.js

@@ -151,7 +151,7 @@ const LakeComboboxWithRef = ({ inputRef, value, items, itemHeight = DEFAULT_ELEM
             setState("dismissed");
         }, 100);
     }, []);
-    return (_jsxs(View, { children: [_jsx(LakeTextInput, { containerRef: inputTextRef, style: styles.input, ariaExpanded: state === "opened", ariaControls: state === "opened" ? suggestionsId : "", enterKeyHint: "search", icon: icon, role: "combobox", placeholder: placeholder, value: value, disabled: disabled, error: error, hideErrors: hideErrors, onChangeText: handleChangeText, onChange: onChange, onFocus: handleFocus, onBlur: handleBlur, onKeyPress: handleKeyPress, id: id, readOnly: readOnly }), _jsx(Popover, { id: suggestionsId, role: "listbox", matchReferenceWidth: true, onEscapeKey: dismiss, referenceRef: ref, autoFocus: false, returnFocus: true, visible: state === "opened" && !items.isNotAsked(), underlay: false, forcedMode: "Dropdown", children: _jsx(View, { style: [styles.list, { maxHeight: itemHeight * nbItemsDisplayed }], children: items.match({
+    return (_jsxs(View, { children: [_jsx(LakeTextInput, { containerRef: inputTextRef, style: styles.input, ariaExpanded: state === "opened", ariaControls: state === "opened" ? suggestionsId : "", enterKeyHint: "search", icon: icon, role: "combobox", placeholder: placeholder, value: value, disabled: disabled, error: error, hideErrors: hideErrors, onChangeText: handleChangeText, onChange: onChange, onFocus: handleFocus, onBlur: handleBlur, onKeyPress: handleKeyPress, id: id, readOnly: readOnly }), _jsx(Popover, { id: suggestionsId, role: "listbox", matchReferenceWidth: true, onEscapeKey: dismiss, referenceRef: ref, autoFocus: false, returnFocus: true, visible: state === "opened" && !items.isNotAsked(), underlay: false, forcedMode: "Dropdown", field: true, children: _jsx(View, { style: [styles.list, { maxHeight: itemHeight * nbItemsDisplayed }], children: items.match({
                         NotAsked: () => null,
                         Loading: () => _jsx(LoadingView, { style: styles.loader }),
                         Done: items => items.match({

package/src/components/LakeScrollView.js

@@ -7,7 +7,6 @@ const styles = StyleSheet.create({
     root: {
         height: 1,
         flexGrow: 1,
-        overflow: "hidden",
     },
     container: {
         height: 1,

package/src/components/LakeSelect.js

@@ -168,7 +168,7 @@ const LakeSelectWithRef = ({ title, items, valueStyle, size, color = "current",
                                                 styles.itemText,
                                                 styles.selectPlaceholder,
                                                 isSmall && styles.selectSmallPlaceholder,
-                                            ], children: placeholder ?? " " }))] }), _jsx(Fill, { minWidth: 8 }), !disabled && (_jsx(Icon, { color: colors.gray[900], name: visible ? "chevron-up-filled" : "chevron-down-filled", size: 16 }))] })] })) }), !hideErrors && (_jsx(LakeText, { variant: "smallRegular", color: colors.negative[500], style: styles.errorText, children: error ?? " " })), _jsxs(Popover, { role: "listbox", matchReferenceMinWidth: matchReferenceWidth, onDismiss: close, referenceRef: inputRef, returnFocus: true, visible: visible, children: [isNotNullish(title) && (_jsxs(_Fragment, { children: [_jsx(LakeText, { variant: "semibold", color: colors.gray[900], style: styles.selectListTitle, children: title }), _jsx(Separator, {})] })), _jsx(FlatList, { role: "list", data: items, ref: listRef, contentContainerStyle: styles.listContent, onKeyDown: (event) => {
+                                            ], children: placeholder ?? " " }))] }), _jsx(Fill, { minWidth: 8 }), !disabled && (_jsx(Icon, { color: colors.gray[900], name: visible ? "chevron-up-filled" : "chevron-down-filled", size: 16 }))] })] })) }), !hideErrors && (_jsx(LakeText, { variant: "smallRegular", color: colors.negative[500], style: styles.errorText, children: error ?? " " })), _jsxs(Popover, { role: "listbox", matchReferenceMinWidth: matchReferenceWidth, onDismiss: close, referenceRef: inputRef, returnFocus: true, visible: visible, field: true, children: [isNotNullish(title) && (_jsxs(_Fragment, { children: [_jsx(LakeText, { variant: "semibold", color: colors.gray[900], style: styles.selectListTitle, children: title }), _jsx(Separator, {})] })), _jsx(FlatList, { role: "list", data: items, ref: listRef, contentContainerStyle: styles.listContent, onKeyDown: (event) => {
                             const { key } = event.nativeEvent;
                             if (key === "ArrowDown" || key === "ArrowUp") {
                                 event.preventDefault();

package/src/components/LakeTextInput.d.ts

@@ -229,7 +229,7 @@ export declare const LakeTextInput: import("react").ForwardRefExoticComponent<{
     disabled?: boolean | undefined;
     color?: "gray" | "live" | "sandbox" | "positive" | "warning" | "negative" | "current" | "partner" | "swan" | "shakespear" | "darkPink" | "sunglow" | "mediumSladeBlue" | undefined;
     multiline?: boolean | undefined;
-    icon?: "lake-building-bank" | "lake-calendar-arrow-swap" | "lake-call" | "lake-card" | "lake-card-add" | "lake-card-filled" | "lake-card-one-off" | "lake-card-physical" | "lake-card-recurring" | "lake-card-single-use" | "lake-card-virtual" | "lake-check" | "lake-chevron-double" | "lake-clipboard-bullet" | "lake-clock" | "lake-clock-arrow-swap" | "lake-close" | "lake-compass" | "lake-currencies" | "lake-delivery-grouped" | "lake-delivery-individual" | "lake-denied" | "lake-document-csv" | "lake-document-jpg" | "lake-document-pdf" | "lake-document-png" | "lake-document-xls" | "lake-email" | "lake-eraser" | "lake-error" | "lake-face-id" | "lake-fingerprint" | "lake-id-card" | "lake-inbox-empty" | "lake-key" | "lake-lock-closed" | "lake-menu" | "lake-people" | "lake-person-arrow-swap" | "lake-person-support" | "lake-phone" | "lake-receipt" | "lake-settings" | "lake-shield" | "lake-signature" | "lake-transfer" | "lake-warning" | "lake-world-map" | "add-circle-filled" | "add-circle-regular" | "add-filled" | "approvals-app-filled" | "apps-list-filled" | "apps-list-regular" | "arrow-counterclockwise-filled" | "arrow-clockwise-filled" | "arrow-down-filled" | "arrow-down-regular" | "arrow-download-filled" | "arrow-left-filled" | "arrow-left-regular" | "arrow-right-filled" | "arrow-right-regular" | "arrow-swap-filled" | "arrow-swap-regular" | "arrow-up-filled" | "arrow-up-regular" | "arrow-upload-filled" | "arrow-upload-regular" | "beaker-filled" | "beaker-regular" | "board-filled" | "board-regular" | "box-regular" | "building-bank-filled" | "building-bank-regular" | "building-filled" | "building-multiple-regular" | "building-regular" | "building-shop-regular" | "calendar-ltr-regular" | "cart-regular" | "chat-help-filled" | "chat-help-regular" | "check-filled" | "check-regular" | "checkmark-circle-regular" | "checkmark-filled" | "chevron-down-filled" | "chevron-left-filled" | "chevron-right-filled" | "chevron-up-down-regular" | "chevron-up-filled" | "clipboard-search-regular" | "clock-filled" | "clock-regular" | "cloud-sync-filled" | "cloud-sync-regular" | "code-filled" | "code-regular" | "color-regular" | "comment-note-regular" | "copy-filled" | "copy-regular" | "cursor-click-regular" | "database-filled" | "database-regular" | "delete-filled" | "delete-regular" | "desktop-regular" | "device-meeting-room-regular" | "dismiss-circle-regular" | "dismiss-filled" | "dismiss-regular" | "document-regular" | "earth-regular" | "edit-filled" | "edit-regular" | "error-circle-filled" | "error-circle-regular" | "eye-filled" | "eye-off-filled" | "eye-regular" | "eye-off-regular" | "filter-filled" | "flag-filled" | "flag-regular" | "flash-filled" | "flash-regular" | "form-new-filled" | "form-new-regular" | "hand-right-regular" | "image-add-filled" | "image-add-regular" | "image-filled" | "image-regular" | "info-filled" | "info-regular" | "key-regular" | "link-filled" | "live-filled" | "live-regular" | "lock-closed-filled" | "lock-closed-regular" | "lock-open-filled" | "lock-open-regular" | "mail-filled" | "mail-regular" | "money-regular" | "more-horizontal-filled" | "more-vertical-filled" | "open-filled" | "open-regular" | "options-regular" | "paint-brush-filled" | "paint-brush-regular" | "pause-regular" | "payment-filled" | "payment-regular" | "people-add-regular" | "people-community-filled" | "people-community-regular" | "people-filled" | "people-regular" | "people-team-regular" | "person-accounts-filled" | "person-accounts-regular" | "person-add-regular" | "person-call-filled" | "person-call-regular" | "person-filled" | "person-lock-regular" | "person-regular" | "phone-filled" | "phone-regular" | "pin-regular" | "play-filled" | "play-regular" | "preview-link-filled" | "qr-code-regular" | "question-circle-regular" | "receipt-money-filled" | "receipt-money-regular" | "rocket-regular" | "search-filled" | "send-filled" | "send-regular" | "settings-filled" | "settings-regular" | "shield-checkmark-filled" | "shield-checkmark-regular" | "shield-error-regular" | "shield-regular" | "sign-out-regular" | "signature-filled" | "signature-regular" | "subtract-circle-filled" | "subtract-circle-regular" | "target-arrow-regular" | "task-list-square-ltr-filled" | "task-list-square-ltr-regular" | "warning-filled" | "warning-regular" | "window-dev-tools-filled" | "window-dev-tools-regular" | undefined;
+    icon?: "lake-building-bank" | "lake-calendar-arrow-swap" | "lake-call" | "lake-card" | "lake-card-add" | "lake-card-filled" | "lake-card-one-off" | "lake-card-physical" | "lake-card-recurring" | "lake-card-single-use" | "lake-card-virtual" | "lake-check" | "lake-chevron-double" | "lake-clipboard-bullet" | "lake-clock" | "lake-clock-arrow-swap" | "lake-close" | "lake-compass" | "lake-currencies" | "lake-delivery-grouped" | "lake-delivery-individual" | "lake-denied" | "lake-document-csv" | "lake-document-jpg" | "lake-document-pdf" | "lake-document-png" | "lake-document-xls" | "lake-email" | "lake-eraser" | "lake-error" | "lake-face-id" | "lake-fingerprint" | "lake-id-card" | "lake-inbox-empty" | "lake-key" | "lake-lock-closed" | "lake-menu" | "lake-people" | "lake-person-arrow-swap" | "lake-person-support" | "lake-phone" | "lake-receipt" | "lake-settings" | "lake-shield" | "lake-signature" | "lake-transfer" | "lake-warning" | "lake-world-map" | "add-circle-filled" | "add-circle-regular" | "add-filled" | "approvals-app-filled" | "apps-list-filled" | "apps-list-regular" | "arrow-counterclockwise-filled" | "arrow-clockwise-filled" | "arrow-down-filled" | "arrow-down-regular" | "arrow-download-filled" | "arrow-left-filled" | "arrow-left-regular" | "arrow-right-filled" | "arrow-right-regular" | "arrow-swap-filled" | "arrow-swap-regular" | "arrow-up-filled" | "arrow-up-regular" | "arrow-upload-filled" | "arrow-upload-regular" | "beaker-filled" | "beaker-regular" | "board-filled" | "board-regular" | "box-regular" | "building-bank-filled" | "building-bank-regular" | "building-filled" | "building-multiple-regular" | "building-regular" | "building-shop-regular" | "calendar-ltr-regular" | "cart-regular" | "chat-help-filled" | "chat-help-regular" | "check-filled" | "check-regular" | "checkmark-circle-regular" | "checkmark-filled" | "chevron-down-filled" | "chevron-left-filled" | "chevron-right-filled" | "chevron-up-down-regular" | "chevron-up-filled" | "clipboard-search-regular" | "clock-filled" | "clock-regular" | "cloud-sync-filled" | "cloud-sync-regular" | "code-filled" | "code-regular" | "color-regular" | "comment-note-regular" | "copy-filled" | "copy-regular" | "cursor-click-regular" | "database-filled" | "database-regular" | "delete-filled" | "delete-regular" | "desktop-regular" | "device-meeting-room-regular" | "dismiss-circle-regular" | "dismiss-filled" | "dismiss-regular" | "document-regular" | "earth-regular" | "edit-filled" | "edit-regular" | "error-circle-filled" | "error-circle-regular" | "eye-filled" | "eye-off-filled" | "eye-regular" | "eye-off-regular" | "filter-filled" | "flag-filled" | "flag-regular" | "flash-filled" | "flash-regular" | "form-new-filled" | "form-new-regular" | "hand-right-regular" | "image-add-filled" | "image-add-regular" | "image-filled" | "image-regular" | "info-filled" | "info-regular" | "key-regular" | "link-filled" | "live-filled" | "live-regular" | "lock-closed-filled" | "lock-closed-regular" | "lock-open-filled" | "lock-open-regular" | "mail-filled" | "mail-regular" | "money-regular" | "money-filled" | "more-horizontal-filled" | "more-vertical-filled" | "open-filled" | "open-regular" | "options-regular" | "paint-brush-filled" | "paint-brush-regular" | "pause-regular" | "payment-filled" | "payment-regular" | "people-add-regular" | "people-community-filled" | "people-community-regular" | "people-filled" | "people-regular" | "people-team-regular" | "person-accounts-filled" | "person-accounts-regular" | "person-add-regular" | "person-call-filled" | "person-call-regular" | "person-filled" | "person-lock-regular" | "person-regular" | "phone-filled" | "phone-regular" | "pin-regular" | "play-filled" | "play-regular" | "preview-link-filled" | "qr-code-regular" | "question-circle-regular" | "receipt-money-filled" | "receipt-money-regular" | "rocket-regular" | "search-filled" | "send-filled" | "send-regular" | "settings-filled" | "settings-regular" | "shield-checkmark-filled" | "shield-checkmark-regular" | "shield-error-regular" | "shield-regular" | "sign-out-regular" | "signature-filled" | "signature-regular" | "subtract-circle-filled" | "subtract-circle-regular" | "target-arrow-regular" | "task-list-square-ltr-filled" | "task-list-square-ltr-regular" | "warning-filled" | "warning-regular" | "window-dev-tools-filled" | "window-dev-tools-regular" | undefined;
     unit?: string | undefined;
     units?: string[] | undefined;
     inputMode?: TextInputProps["inputMode"];

package/src/components/MultiSelect.js

@@ -195,7 +195,7 @@ export const MultiSelect = memo(({ color = "gray", disabled = false, emptyResult
                     (focused || visible) && styles.focused,
                     disabled && styles.disabled,
                     isNotNullish(error) && styles.errored,
-                ], children: [_jsx(Box, { ref: selectedTagListRef, alignItems: "center", direction: "row", style: styles.tagsList, children: selectedTags.length > 0 ? (selectedTags.map(item => (_jsx(Tag, { color: color, onPressRemove: disabled ? undefined : () => handleRemoveItem(item), style: styles.tag, children: item.label }, item.value)))) : placeholder !== "" ? (_jsx(Text, { role: "label", numberOfLines: 1, style: styles.placeholder, children: placeholder })) : null }), _jsxs(Box, { direction: "row", alignItems: "center", style: styles.actions, children: [selectedTags.length >= 1 && !disabled && (_jsxs(_Fragment, { children: [_jsx(Pressable, { role: "button", onPress: handleClearAll, children: _jsx(Icon, { name: "dismiss-filled", color: colors.gray.primary, size: 15 }) }), _jsx(Space, { width: 8 })] })), _jsx(Icon, { color: colors.gray.primary, name: visible ? "chevron-up-filled" : "chevron-down-filled", size: 20 })] })] }), _jsx(Popover, { role: "listbox", matchReferenceWidth: true, onDismiss: close, referenceRef: inputRef, returnFocus: true, visible: visible, children: _jsx(View, { style: styles.list, children: enableGroups ? (_jsx(SectionList, { role: "listbox", "aria-multiselectable": true, keyExtractor: (item, index) => `group-field-${item.value}-${index}`, extraData: filter, ListHeaderComponent: ListHeaderComponent, ListEmptyComponent: ListEmptyComponent, ListFooterComponent: _jsx(Space, { height: 16 }), sections: sections, renderSectionHeader: ({ section: { title, data }, }) => (_jsxs(Pressable, { role: "listitem", onPress: () => handleSelectGroup(data), style: ({ hovered, pressed, focused }) => [
+                ], children: [_jsx(Box, { ref: selectedTagListRef, alignItems: "center", direction: "row", style: styles.tagsList, children: selectedTags.length > 0 ? (selectedTags.map(item => (_jsx(Tag, { color: color, onPressRemove: disabled ? undefined : () => handleRemoveItem(item), style: styles.tag, children: item.label }, item.value)))) : placeholder !== "" ? (_jsx(Text, { role: "label", numberOfLines: 1, style: styles.placeholder, children: placeholder })) : null }), _jsxs(Box, { direction: "row", alignItems: "center", style: styles.actions, children: [selectedTags.length >= 1 && !disabled && (_jsxs(_Fragment, { children: [_jsx(Pressable, { role: "button", onPress: handleClearAll, children: _jsx(Icon, { name: "dismiss-filled", color: colors.gray.primary, size: 15 }) }), _jsx(Space, { width: 8 })] })), _jsx(Icon, { color: colors.gray.primary, name: visible ? "chevron-up-filled" : "chevron-down-filled", size: 20 })] })] }), _jsx(Popover, { role: "listbox", matchReferenceWidth: true, onDismiss: close, referenceRef: inputRef, returnFocus: true, visible: visible, field: true, children: _jsx(View, { style: styles.list, children: enableGroups ? (_jsx(SectionList, { role: "listbox", "aria-multiselectable": true, keyExtractor: (item, index) => `group-field-${item.value}-${index}`, extraData: filter, ListHeaderComponent: ListHeaderComponent, ListEmptyComponent: ListEmptyComponent, ListFooterComponent: _jsx(Space, { height: 16 }), sections: sections, renderSectionHeader: ({ section: { title, data }, }) => (_jsxs(Pressable, { role: "listitem", onPress: () => handleSelectGroup(data), style: ({ hovered, pressed, focused }) => [
                                 styles.groupTitleBase,
                                 (hovered || focused) && { backgroundColor: tint50 },
                                 pressed && { backgroundColor: tint100 },

package/src/components/Popover.d.ts

@@ -18,6 +18,7 @@ type Props = {
     underlay?: boolean;
     safetyMargin?: number;
     forcedMode?: "Dropdown" | "BottomPanel";
+    field?: boolean;
 };
 export declare const VIEWPORT_WIDTH_THRESHOLD = 600;
 export declare const Popover: import("react").NamedExoticComponent<Props>;

package/src/components/Popover.js

@@ -66,7 +66,7 @@ const animation = {
     ],
 };
 export const VIEWPORT_WIDTH_THRESHOLD = 600;
-export const Popover = memo(({ children, id, label, role = "dialog", describedBy, matchReferenceWidth = false, matchReferenceMinWidth = false, onDismiss = noop, onEscapeKey = onDismiss, referenceRef, returnFocus = true, autoFocus = true, visible, underlay = true, safetyMargin = 8, forcedMode, }) => {
+export const Popover = memo(({ children, id, label, role = "dialog", describedBy, matchReferenceWidth = false, matchReferenceMinWidth = false, onDismiss = noop, onEscapeKey = onDismiss, referenceRef, returnFocus = true, autoFocus = true, visible, underlay = true, safetyMargin = 8, forcedMode, field = false, }) => {
     const [rootElement, setRootElement] = useState(null);
     const underlayRef = useRef(null);
     const { desktop } = useResponsive(VIEWPORT_WIDTH_THRESHOLD);
@@ -77,22 +77,23 @@ export const Popover = memo(({ children, id, label, role = "dialog", describedBy
             const rect = element.getBoundingClientRect();
             const availableSpaceAbove = rect.top;
             const availableSpaceBelow = window.innerHeight - rect.bottom;
+            const visualViewportOffsetTop = window.visualViewport?.offsetTop ?? 0;
             setViewportInformation({
                 availableSpaceAbove,
                 availableSpaceBelow,
                 availableSpaceBefore: rect.left,
                 availableSpaceAfter: window.innerWidth - rect.right,
-                top: Math.max(rect.bottom, safetyMargin),
+                top: visualViewportOffsetTop + Math.max(rect.bottom, safetyMargin),
                 bottom: Math.max(window.innerHeight - rect.top, safetyMargin),
                 left: Math.max(rect.left, safetyMargin),
                 right: Math.max(window.innerWidth - rect.right, safetyMargin),
-                availableHeight: availableSpaceAbove <= availableSpaceBelow
+                availableHeight: field || availableSpaceAbove <= availableSpaceBelow
                     ? window.innerHeight - rect.top - (rect.bottom - rect.top) - 20
                     : availableSpaceAbove - 20,
                 width: rect.right - rect.left,
             });
         }
-    }, [safetyMargin, referenceRef, visible]);
+    }, [safetyMargin, referenceRef, visible, field]);
     useEffect(() => {
         const element = underlayRef.current;
         if (!visible && element != null) {
@@ -136,17 +137,17 @@ export const Popover = memo(({ children, id, label, role = "dialog", describedBy
     }
     return (_jsx(Portal, { container: rootElement, children: _jsx(TransitionView, { style: styles.container, ...animation, children: visible ? (_jsxs(View, { style: styles.contents, children: [underlay ? (_jsx(Pressable, { ref: underlayRef, style: styles.underlay, onPress: onPressUnderlay, "aria-label": "Close" })) : null, availableHeight > 0 ? (_jsx(ScrollView, { style: [
                             styles.popover,
-                            availableSpaceAbove <= availableSpaceBelow && { top },
-                            availableSpaceAbove > availableSpaceBelow && { bottom },
+                            (field || availableSpaceAbove <= availableSpaceBelow) && { top },
+                            !field && availableSpaceAbove > availableSpaceBelow && { bottom },
                             availableSpaceBefore <= availableSpaceAfter && { left },
                             availableSpaceBefore > availableSpaceAfter && { right },
                             matchReferenceMinWidth && { minWidth: width },
                             matchReferenceWidth && { width },
-                            { maxHeight: availableHeight },
+                            { maxHeight: field ? undefined : availableHeight },
                         ], contentContainerStyle: [
                             styles.popoverContents,
                             {
-                                justifyContent: availableSpaceAbove > availableSpaceBelow ? FLEX_END : FLEX_START,
+                                justifyContent: !field && availableSpaceAbove > availableSpaceBelow ? FLEX_END : FLEX_START,
                             },
                         ], id: id, role: role, "aria-describedby": describedBy, "aria-label": label, children: _jsx(FocusTrap, { focusLock: true, returnFocus: returnFocus, autoFocus: autoFocus, onEscapeKey: onEscapeKey, onClickOutside: underlay ? undefined : onClickOutside, children: _jsx(Pressable, { tabIndex: -1, onPress: onPress, style: styles.defaultCursor, children: typeof children == "function" ? children({ mode: "dropdown" }) : children }) }) })) : null] })) : null }) }));
 });

package/src/icons/fluent-icons.json

@@ -100,6 +100,7 @@
   "mail-filled": "M22 8.6v8.15a3.25 3.25 0 0 1-3.07 3.24l-.18.01H5.25a3.25 3.25 0 0 1-3.24-3.07L2 16.75V8.61l9.65 5.05c.22.12.48.12.7 0L22 8.61ZM5.25 4h13.5a3.25 3.25 0 0 1 3.23 2.92L12 12.15 2.02 6.92a3.25 3.25 0 0 1 3.04-2.91L5.25 4h13.5-13.5Z",
   "mail-regular": "M5.25 4h13.5a3.25 3.25 0 0 1 3.24 3.07l.01.18v9.5a3.25 3.25 0 0 1-3.07 3.24l-.18.01H5.25a3.25 3.25 0 0 1-3.24-3.07L2 16.75v-9.5a3.25 3.25 0 0 1 3.07-3.24L5.25 4h13.5-13.5ZM20.5 9.37l-8.15 4.3c-.19.1-.4.1-.6.04l-.1-.05L3.5 9.37v7.38c0 .92.7 1.67 1.6 1.74l.15.01h13.5c.92 0 1.67-.7 1.74-1.6l.01-.15V9.37ZM18.75 5.5H5.25c-.92 0-1.67.7-1.74 1.6l-.01.15v.43l8.5 4.47 8.5-4.47v-.43c0-.92-.7-1.67-1.6-1.74l-.15-.01Z",
   "money-regular": "M10.5 8a3 3 0 1 0 0 6 3 3 0 0 0 0-6ZM9 11a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0ZM2 7.25C2 6.01 3 5 4.25 5h12.5C17.99 5 19 6 19 7.25v7.5c0 1.24-1 2.25-2.25 2.25H4.25C3.01 17 2 16 2 14.75v-7.5Zm2.25-.75a.75.75 0 0 0-.75.75V8h.75c.41 0 .75-.34.75-.75V6.5h-.75Zm-.75 6h.75c1.24 0 2.25 1 2.25 2.25v.75h8v-.75c0-1.24 1-2.25 2.25-2.25h.75v-3h-.75c-1.24 0-2.25-1-2.25-2.25V6.5h-8v.75c0 1.24-1 2.25-2.25 2.25H3.5v3Zm14-4.5v-.75a.75.75 0 0 0-.75-.75H16v.75c0 .41.34.75.75.75h.75Zm0 6h-.75a.75.75 0 0 0-.75.75v.75h.75c.41 0 .75-.34.75-.75V14Zm-14 .75c0 .41.34.75.75.75H5v-.75a.75.75 0 0 0-.75-.75H3.5v.75Zm.9 3.75A3 3 0 0 0 7 20h10.25A4.75 4.75 0 0 0 22 15.25V10a3 3 0 0 0-1.5-2.6v7.85c0 1.8-1.46 3.25-3.25 3.25H4.4Z",
+  "money-filled": "M2 6.75C2 5.78 2.78 5 3.75 5h13.5c.97 0 1.75.78 1.75 1.75v8.5c0 .97-.78 1.75-1.75 1.75H3.75C2.78 17 2 16.22 2 15.25v-8.5Zm3-.5v1c0 .41-.34.75-.75.75h-1v1.5h1c1.24 0 2.25-1 2.25-2.25v-1H5Zm5.5 7.25a2.25 2.25 0 1 0 0-4.5 2.25 2.25 0 0 0 0 4.5Zm-7.25.5h1c.41 0 .75.34.75.75v1h1.5v-1c0-1.24-1-2.25-2.25-2.25h-1V14Zm12.75.75c0-.41.34-.75.75-.75h1v-1.5h-1c-1.24 0-2.25 1-2.25 2.25v1H16v-1Zm0-7.5v-1h-1.5v1c0 1.24 1 2.25 2.25 2.25h1V8h-1a.75.75 0 0 1-.75-.75ZM4.4 18.5A3 3 0 0 0 7 20h10.25A4.75 4.75 0 0 0 22 15.25V10a3 3 0 0 0-1.5-2.6v7.85c0 1.8-1.46 3.25-3.25 3.25H4.4Z",
   "more-horizontal-filled": "M8 12a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm6 0a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 2a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z",
   "more-vertical-filled": "M12 8a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0 6a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm-2 4a2 2 0 1 0 4 0 2 2 0 0 0-4 0Z",
   "open-filled": "M6.25 5C5.56 5 5 5.56 5 6.25v11.5c0 .69.56 1.25 1.25 1.25h11.5c.69 0 1.25-.56 1.25-1.25V14a1 1 0 1 1 2 0v3.75c0 1.8-1.46 3.25-3.25 3.25H6.25A3.25 3.25 0 0 1 3 17.75V6.25C3 4.45 4.46 3 6.25 3H10a1 1 0 1 1 0 2H6.25ZM14 5a1 1 0 1 1 0-2h6a1 1 0 0 1 1 1v6a1 1 0 1 1-2 0V6.41l-4.3 4.3a1 1 0 0 1-1.4-1.42L17.58 5H14Z",