feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-search/lib-commonjs/SearchBox.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SearchBox: function() {
+        return _index.SearchBox;
+    },
+    renderSearchBox_unstable: function() {
+        return _index.renderSearchBox_unstable;
+    },
+    searchBoxClassNames: function() {
+        return _index.searchBoxClassNames;
+    },
+    useSearchBoxBase_unstable: function() {
+        return _index.useSearchBoxBase_unstable;
+    },
+    useSearchBoxStyles_unstable: function() {
+        return _index.useSearchBoxStyles_unstable;
+    },
+    useSearchBox_unstable: function() {
+        return _index.useSearchBox_unstable;
+    }
+});
+const _index = require("./components/SearchBox/index");

node_modules/@fluentui/react-search/lib-commonjs/SearchBox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/SearchBox.ts"],"sourcesContent":["export type {\n  SearchBoxChangeEvent,\n  SearchBoxProps,\n  SearchBoxBaseProps,\n  SearchBoxSlots,\n  SearchBoxState,\n  SearchBoxBaseState,\n} from './components/SearchBox/index';\nexport {\n  SearchBox,\n  renderSearchBox_unstable,\n  searchBoxClassNames,\n  useSearchBoxStyles_unstable,\n  useSearchBox_unstable,\n  useSearchBoxBase_unstable,\n} from './components/SearchBox/index';\n"],"names":["SearchBox","renderSearchBox_unstable","searchBoxClassNames","useSearchBoxStyles_unstable","useSearchBox_unstable","useSearchBoxBase_unstable"],"mappings":";;;;;;;;;;;;eASEA,gBAAS;;;eACTC,+BAAwB;;;eACxBC,0BAAmB;;;eAGnBG,gCAAyB;;;eAFzBF,kCAA2B;;;eAC3BC,4BAAqB;;;uBAEhB,+BAA+B"}

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/SearchBox.js

@@ -0,0 +1,24 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "SearchBox", {
+    enumerable: true,
+    get: function() {
+        return SearchBox;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _useSearchBox = require("./useSearchBox");
+const _renderSearchBox = require("./renderSearchBox");
+const _useSearchBoxStylesstyles = require("./useSearchBoxStyles.styles");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const SearchBox = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useSearchBox.useSearchBox_unstable)(props, ref);
+    (0, _useSearchBoxStylesstyles.useSearchBoxStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useSearchBoxStyles_unstable')(state);
+    return (0, _renderSearchBox.renderSearchBox_unstable)(state);
+});
+SearchBox.displayName = 'SearchBox';

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/SearchBox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SearchBox/SearchBox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useSearchBox_unstable } from './useSearchBox';\nimport { renderSearchBox_unstable } from './renderSearchBox';\nimport { useSearchBoxStyles_unstable } from './useSearchBoxStyles.styles';\nimport type { SearchBoxProps } from './SearchBox.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * SearchBox component - TODO: add more docs\n */\nexport const SearchBox: ForwardRefComponent<SearchBoxProps> = React.forwardRef((props, ref) => {\n  const state = useSearchBox_unstable(props, ref);\n\n  useSearchBoxStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useSearchBoxStyles_unstable')(state);\n\n  return renderSearchBox_unstable(state);\n});\n\nSearchBox.displayName = 'SearchBox';\n"],"names":["React","useSearchBox_unstable","renderSearchBox_unstable","useSearchBoxStyles_unstable","useCustomStyleHook_unstable","SearchBox","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;8BACO,iBAAiB;iCACd,oBAAoB;0CACjB,8BAA8B;qCAG9B,kCAAkC;AAKvE,MAAMK,YAAAA,WAAAA,GAAiDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACrF,MAAMC,YAAQR,mCAAAA,EAAsBM,OAAOC;QAE3CL,qDAAAA,EAA4BM;QAE5BL,gDAAAA,EAA4B,+BAA+BK;IAE3D,WAAOP,yCAAAA,EAAyBO;AAClC,GAAG;AAEHJ,UAAUK,WAAW,GAAG"}

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/SearchBox.types.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/SearchBox.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SearchBox/SearchBox.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { InputOnChangeData, InputProps, InputSlots, InputState } from '@fluentui/react-input';\n\nexport type SearchBoxSlots = InputSlots & {\n  /** Last element in the input, within the input border */\n  dismiss?: Slot<'span'>;\n};\n\n/**\n * SearchBox Props\n */\nexport type SearchBoxProps = Omit<\n  ComponentProps<Partial<SearchBoxSlots>, 'input'>,\n  // `children` is unsupported. The rest of these native props have customized definitions.\n  'children' | 'defaultValue' | 'onChange' | 'size' | 'type' | 'value'\n> &\n  Omit<InputProps, 'onChange'> & {\n    /**\n     * Custom onChange callback.\n     * Will be traditionally supplied with a React.ChangeEvent<HTMLInputElement> for usual character entry.\n     * When the dismiss button is clicked, this will be called with an event of type React.MouseEvent<HTMLSpanElement>\n     * and an empty string as the `value` property of the data parameter\n     */\n    // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n    onChange?: (event: SearchBoxChangeEvent, data: InputOnChangeData) => void;\n  };\n\n/**\n * SearchBox base props — excludes design props (appearance, size).\n */\nexport type SearchBoxBaseProps = Omit<SearchBoxProps, 'appearance' | 'size'>;\n\n/**\n * State used in rendering SearchBox\n */\nexport type SearchBoxState = ComponentState<SearchBoxSlots> &\n  InputState &\n  Required<Pick<InputState, 'size'>> &\n  Required<Pick<SearchBoxProps, 'disabled'>> & {\n    focused: boolean;\n  };\n\n/**\n * SearchBox base state — excludes design props (appearance, size).\n */\nexport type SearchBoxBaseState = Omit<SearchBoxState, 'appearance' | 'size'>;\n\n/** Overloaded onChange event type, used to merge functionality of regular text entry and the dismiss button */\nexport type SearchBoxChangeEvent = React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLSpanElement>;\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/index.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SearchBox: function() {
+        return _SearchBox.SearchBox;
+    },
+    renderSearchBox_unstable: function() {
+        return _renderSearchBox.renderSearchBox_unstable;
+    },
+    searchBoxClassNames: function() {
+        return _useSearchBoxStylesstyles.searchBoxClassNames;
+    },
+    useSearchBoxBase_unstable: function() {
+        return _useSearchBox.useSearchBoxBase_unstable;
+    },
+    useSearchBoxStyles_unstable: function() {
+        return _useSearchBoxStylesstyles.useSearchBoxStyles_unstable;
+    },
+    useSearchBox_unstable: function() {
+        return _useSearchBox.useSearchBox_unstable;
+    }
+});
+const _SearchBox = require("./SearchBox");
+const _renderSearchBox = require("./renderSearchBox");
+const _useSearchBox = require("./useSearchBox");
+const _useSearchBoxStylesstyles = require("./useSearchBoxStyles.styles");

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SearchBox/index.ts"],"sourcesContent":["export { SearchBox } from './SearchBox';\nexport type {\n  SearchBoxChangeEvent,\n  SearchBoxProps,\n  SearchBoxBaseProps,\n  SearchBoxSlots,\n  SearchBoxState,\n  SearchBoxBaseState,\n} from './SearchBox.types';\nexport { renderSearchBox_unstable } from './renderSearchBox';\nexport { useSearchBox_unstable, useSearchBoxBase_unstable } from './useSearchBox';\nexport { searchBoxClassNames, useSearchBoxStyles_unstable } from './useSearchBoxStyles.styles';\n"],"names":["SearchBox","renderSearchBox_unstable","useSearchBox_unstable","useSearchBoxBase_unstable","searchBoxClassNames","useSearchBoxStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,oBAAS;;;eASTC,yCAAwB;;;eAExBG,6CAAmB;;;eADID,uCAAyB;;;eAC3BE,qDAA2B;;;eADhDH,mCAAqB;;;2BAVJ,cAAc;iCASC,oBAAoB;8BACI,iBAAiB;0CACjB,8BAA8B"}

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/renderSearchBox.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderSearchBox_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderSearchBox_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
+const renderSearchBox_unstable = (state)=>{
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
+        children: [
+            state.contentBefore && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.contentBefore, {}),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(state.input, {}),
+            state.contentAfter && /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.contentAfter, {
+                children: [
+                    state.contentAfter.children,
+                    state.dismiss && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.dismiss, {})
+                ]
+            })
+        ]
+    });
+};

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/renderSearchBox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SearchBox/renderSearchBox.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { SearchBoxBaseState, SearchBoxSlots } from './SearchBox.types';\n\n/**\n * Render the final JSX of SearchBox\n */\nexport const renderSearchBox_unstable = (state: SearchBoxBaseState): JSXElement => {\n  assertSlots<SearchBoxSlots>(state);\n\n  return (\n    <state.root>\n      {state.contentBefore && <state.contentBefore />}\n      <state.input />\n      {state.contentAfter && (\n        <state.contentAfter>\n          {state.contentAfter.children}\n          {state.dismiss && <state.dismiss />}\n        </state.contentAfter>\n      )}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderSearchBox_unstable","state","root","contentBefore","input","contentAfter","children","dismiss"],"mappings":";;;;+BAUaC;;;;;;4BATb,iCAAiD;gCAErB,4BAA4B;AAOjD,iCAAiC,CAACC;QACvCF,2BAAAA,EAA4BE;IAE5B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,aAAa,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,aAAa,EAAA,CAAA;8BAC5C,eAAA,EAACF,MAAMG,KAAK,EAAA,CAAA;YACXH,MAAMI,YAAY,IAAA,WAAA,OACjB,gBAAA,EAACJ,MAAMI,YAAY,EAAA;;oBAChBJ,MAAMI,YAAY,CAACC,QAAQ;oBAC3BL,MAAMM,OAAO,IAAA,WAAA,OAAI,eAAA,EAACN,MAAMM,OAAO,EAAA,CAAA;;;;;AAK1C,EAAE"}

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/useSearchBox.js

@@ -0,0 +1,133 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    useSearchBoxBase_unstable: function() {
+        return useSearchBoxBase_unstable;
+    },
+    useSearchBox_unstable: function() {
+        return useSearchBox_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactutilities = require("@fluentui/react-utilities");
+const _reactinput = require("@fluentui/react-input");
+const _reacticons = require("@fluentui/react-icons");
+const useSearchBox_unstable = (props, ref)=>{
+    const { size = 'medium', appearance = 'outline', ...baseProps } = props;
+    const state = useSearchBoxBase_unstable(baseProps, ref);
+    if (state.contentBefore) {
+        var _state_contentBefore;
+        var _children;
+        (_children = (_state_contentBefore = state.contentBefore).children) !== null && _children !== void 0 ? _children : _state_contentBefore.children = /*#__PURE__*/ _react.createElement(_reacticons.SearchRegular, null);
+    }
+    if (state.dismiss) {
+        var _state_dismiss;
+        var _children1;
+        (_children1 = (_state_dismiss = state.dismiss).children) !== null && _children1 !== void 0 ? _children1 : _state_dismiss.children = /*#__PURE__*/ _react.createElement(_reacticons.DismissRegular, null);
+    }
+    return {
+        ...state,
+        size,
+        appearance
+    };
+};
+const useSearchBoxBase_unstable = (props, ref)=>{
+    const { disabled = false, root, contentBefore, dismiss, contentAfter, value, defaultValue, ...inputProps } = props;
+    const searchBoxRootRef = _react.useRef(null);
+    const searchBoxRef = _react.useRef(null);
+    const [internalValue, setInternalValue] = (0, _reactutilities.useControllableState)({
+        state: value,
+        defaultState: defaultValue,
+        initialState: ''
+    });
+    // Tracks the focus of the component for the contentAfter and dismiss button
+    const [focused, setFocused] = _react.useState(false);
+    const onFocus = _react.useCallback(()=>{
+        setFocused(true);
+    }, [
+        setFocused
+    ]);
+    const onBlur = _react.useCallback((ev)=>{
+        var _searchBoxRootRef_current;
+        setFocused(!!((_searchBoxRootRef_current = searchBoxRootRef.current) === null || _searchBoxRootRef_current === void 0 ? void 0 : _searchBoxRootRef_current.contains(ev.relatedTarget)));
+    }, [
+        setFocused
+    ]);
+    const rootProps = _reactutilities.slot.resolveShorthand(root);
+    const handleDismissClick = (0, _reactutilities.useEventCallback)((event)=>{
+        var _props_onChange, _searchBoxRef_current;
+        if ((0, _reactutilities.isResolvedShorthand)(dismiss)) {
+            var _dismiss_onClick;
+            (_dismiss_onClick = dismiss.onClick) === null || _dismiss_onClick === void 0 ? void 0 : _dismiss_onClick.call(dismiss, event);
+        }
+        const newValue = '';
+        setInternalValue(newValue);
+        (_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, event, {
+            value: newValue
+        });
+        (_searchBoxRef_current = searchBoxRef.current) === null || _searchBoxRef_current === void 0 ? void 0 : _searchBoxRef_current.focus();
+    });
+    const inputState = (0, _reactinput.useInput_unstable)({
+        type: 'search',
+        disabled,
+        value: internalValue,
+        root: _reactutilities.slot.always({
+            ...rootProps,
+            ref: (0, _reactutilities.useMergedRefs)(rootProps === null || rootProps === void 0 ? void 0 : rootProps.ref, searchBoxRootRef),
+            onFocus: (0, _reactutilities.mergeCallbacks)(rootProps === null || rootProps === void 0 ? void 0 : rootProps.onFocus, onFocus),
+            onBlur: (0, _reactutilities.mergeCallbacks)(rootProps === null || rootProps === void 0 ? void 0 : rootProps.onBlur, onBlur)
+        }, {
+            elementType: 'span'
+        }),
+        contentBefore: _reactutilities.slot.optional(contentBefore, {
+            renderByDefault: true,
+            elementType: 'span'
+        }),
+        contentAfter: _reactutilities.slot.optional(contentAfter, {
+            renderByDefault: true,
+            elementType: 'span'
+        }),
+        ...inputProps,
+        onChange: (0, _reactutilities.useEventCallback)((ev)=>{
+            var _props_onChange;
+            const newValue = ev.target.value;
+            (_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, ev, {
+                value: newValue
+            });
+            setInternalValue(newValue);
+        })
+    }, (0, _reactutilities.useMergedRefs)(searchBoxRef, ref));
+    const state = {
+        ...inputState,
+        components: {
+            // eslint-disable-next-line @typescript-eslint/no-deprecated
+            ...inputState.components,
+            dismiss: 'span'
+        },
+        dismiss: _reactutilities.slot.optional(dismiss, {
+            defaultProps: {
+                role: 'button',
+                'aria-label': 'clear',
+                tabIndex: -1
+            },
+            renderByDefault: true,
+            elementType: 'span'
+        }),
+        disabled,
+        focused
+    };
+    if (state.dismiss) {
+        state.dismiss.onClick = handleDismissClick;
+    }
+    return state;
+};

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/useSearchBoxStyles.styles.js

@@ -0,0 +1,212 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    searchBoxClassNames: function() {
+        return searchBoxClassNames;
+    },
+    useSearchBoxStyles_unstable: function() {
+        return useSearchBoxStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reactinput = require("@fluentui/react-input");
+const searchBoxClassNames = {
+    root: 'fui-SearchBox',
+    dismiss: 'fui-SearchBox__dismiss',
+    contentAfter: 'fui-SearchBox__contentAfter',
+    contentBefore: 'fui-SearchBox__contentBefore',
+    input: 'fui-SearchBox__input'
+};
+/**
+ * Styles for the root slot
+ */ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
+    small: {
+        i8kkvl: "fjuset5",
+        B2u0y6b: "f1xzfw5u",
+        uwmqm3: [
+            "fk8j09s",
+            "fdw0yi8"
+        ],
+        z189sj: [
+            "fdw0yi8",
+            "fk8j09s"
+        ]
+    },
+    medium: {
+        i8kkvl: "fjuset5",
+        B2u0y6b: "f1xzfw5u",
+        uwmqm3: [
+            "f1f5gg8d",
+            "f1vdfbxk"
+        ],
+        z189sj: [
+            "f1vdfbxk",
+            "f1f5gg8d"
+        ]
+    },
+    large: {
+        i8kkvl: "fjuset5",
+        B2u0y6b: "f1xzfw5u",
+        uwmqm3: [
+            "f1ng84yb",
+            "f11gcy0p"
+        ],
+        z189sj: [
+            "f11gcy0p",
+            "f1ng84yb"
+        ]
+    },
+    input: {
+        uwmqm3: [
+            "fk8j09s",
+            "fdw0yi8"
+        ],
+        z189sj: [
+            "fhxju0i",
+            "f1cnd47f"
+        ],
+        Boqhc8c: "f18izjht",
+        B8uat0v: "fcoa6sg"
+    },
+    unfocusedNoContentAfter: {
+        z189sj: [
+            "fhxju0i",
+            "f1cnd47f"
+        ]
+    }
+}, {
+    d: [
+        ".fjuset5{column-gap:0;}",
+        ".f1xzfw5u{max-width:468px;}",
+        ".fk8j09s{padding-left:var(--spacingHorizontalSNudge);}",
+        ".fdw0yi8{padding-right:var(--spacingHorizontalSNudge);}",
+        ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
+        ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",
+        ".f1ng84yb{padding-left:var(--spacingHorizontalMNudge);}",
+        ".f11gcy0p{padding-right:var(--spacingHorizontalMNudge);}",
+        ".fhxju0i{padding-right:0;}",
+        ".f1cnd47f{padding-left:0;}",
+        ".f18izjht::-webkit-search-decoration{display:none;}",
+        ".fcoa6sg::-webkit-search-cancel-button{display:none;}"
+    ]
+});
+const useInputStyles = /*#__PURE__*/ (0, _react.__styles)({
+    small: {
+        z189sj: [
+            "fdw0yi8",
+            "fk8j09s"
+        ]
+    },
+    medium: {
+        z189sj: [
+            "f1vdfbxk",
+            "f1f5gg8d"
+        ]
+    },
+    large: {
+        z189sj: [
+            "f11gcy0p",
+            "f1ng84yb"
+        ]
+    }
+}, {
+    d: [
+        ".fdw0yi8{padding-right:var(--spacingHorizontalSNudge);}",
+        ".fk8j09s{padding-left:var(--spacingHorizontalSNudge);}",
+        ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",
+        ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
+        ".f11gcy0p{padding-right:var(--spacingHorizontalMNudge);}",
+        ".f1ng84yb{padding-left:var(--spacingHorizontalMNudge);}"
+    ]
+});
+const useContentAfterStyles = /*#__PURE__*/ (0, _react.__styles)({
+    contentAfter: {
+        uwmqm3: [
+            "f1uw59to",
+            "fw5db7e"
+        ],
+        i8kkvl: "f1ufnopg"
+    },
+    rest: {
+        Bqenvij: "fniina8",
+        a9b677: "f3tsq5r",
+        uwmqm3: [
+            "f1cnd47f",
+            "fhxju0i"
+        ],
+        B68tc82: 0,
+        Bmxbyg5: 0,
+        Bpg54ce: "f1a3p1vp"
+    }
+}, {
+    d: [
+        ".f1uw59to{padding-left:var(--spacingHorizontalM);}",
+        ".fw5db7e{padding-right:var(--spacingHorizontalM);}",
+        ".f1ufnopg{column-gap:var(--spacingHorizontalXS);}",
+        ".fniina8{height:0;}",
+        ".f3tsq5r{width:0;}",
+        ".f1cnd47f{padding-left:0;}",
+        ".fhxju0i{padding-right:0;}",
+        [
+            ".f1a3p1vp{overflow:hidden;}",
+            {
+                p: -1
+            }
+        ]
+    ]
+});
+const useDismissClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1pvzcuu", null, [
+    ".r1pvzcuu{box-sizing:border-box;color:var(--colorNeutralForeground3);display:flex;cursor:pointer;}",
+    ".r1pvzcuu>svg{font-size:20px;}"
+]);
+const useDismissStyles = /*#__PURE__*/ (0, _react.__styles)({
+    disabled: {
+        sj55zd: "f1s2aq7o"
+    },
+    small: {
+        Duoase: "f3qv9w"
+    },
+    medium: {},
+    large: {
+        Duoase: "f16u2scb"
+    }
+}, {
+    d: [
+        ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}",
+        ".f3qv9w>svg{font-size:16px;}",
+        ".f16u2scb>svg{font-size:24px;}"
+    ]
+});
+const useSearchBoxStyles_unstable = (state)=>{
+    'use no memo';
+    const { disabled, focused, size } = state;
+    const rootStyles = useRootStyles();
+    const inputStyles = useInputStyles();
+    const contentAfterStyles = useContentAfterStyles();
+    const dismissClassName = useDismissClassName();
+    const dismissStyles = useDismissStyles();
+    state.root.className = (0, _react.mergeClasses)(searchBoxClassNames.root, rootStyles[size], !focused && rootStyles.unfocusedNoContentAfter, state.root.className);
+    state.input.className = (0, _react.mergeClasses)(searchBoxClassNames.input, rootStyles.input, !focused && inputStyles[size], state.input.className);
+    if (state.dismiss) {
+        state.dismiss.className = (0, _react.mergeClasses)(searchBoxClassNames.dismiss, dismissClassName, disabled && dismissStyles.disabled, dismissStyles[size], state.dismiss.className);
+    }
+    if (state.contentBefore) {
+        state.contentBefore.className = (0, _react.mergeClasses)(searchBoxClassNames.contentBefore, state.contentBefore.className);
+    }
+    if (state.contentAfter) {
+        state.contentAfter.className = (0, _react.mergeClasses)(searchBoxClassNames.contentAfter, contentAfterStyles.contentAfter, !focused && contentAfterStyles.rest, state.contentAfter.className);
+    } else if (state.dismiss) {
+        state.dismiss.className = (0, _react.mergeClasses)(state.dismiss.className, contentAfterStyles.contentAfter);
+    }
+    (0, _reactinput.useInputStyles_unstable)(state);
+    return state;
+};

node_modules/@fluentui/react-search/lib-commonjs/components/SearchBox/useSearchBoxStyles.styles.raw.js

@@ -0,0 +1,140 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    searchBoxClassNames: function() {
+        return searchBoxClassNames;
+    },
+    useSearchBoxStyles_unstable: function() {
+        return useSearchBoxStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const _reactinput = require("@fluentui/react-input");
+const searchBoxClassNames = {
+    root: 'fui-SearchBox',
+    dismiss: 'fui-SearchBox__dismiss',
+    contentAfter: 'fui-SearchBox__contentAfter',
+    contentBefore: 'fui-SearchBox__contentBefore',
+    input: 'fui-SearchBox__input'
+};
+/**
+ * Styles for the root slot
+ */ const useRootStyles = (0, _react.makeStyles)({
+    small: {
+        columnGap: 0,
+        maxWidth: '468px',
+        paddingLeft: _reacttheme.tokens.spacingHorizontalSNudge,
+        paddingRight: _reacttheme.tokens.spacingHorizontalSNudge
+    },
+    medium: {
+        columnGap: 0,
+        maxWidth: '468px',
+        paddingLeft: _reacttheme.tokens.spacingHorizontalS,
+        paddingRight: _reacttheme.tokens.spacingHorizontalS
+    },
+    large: {
+        columnGap: 0,
+        maxWidth: '468px',
+        paddingLeft: _reacttheme.tokens.spacingHorizontalMNudge,
+        paddingRight: _reacttheme.tokens.spacingHorizontalMNudge
+    },
+    input: {
+        paddingLeft: _reacttheme.tokens.spacingHorizontalSNudge,
+        paddingRight: 0,
+        // removes the WebKit pseudoelement styling
+        '::-webkit-search-decoration': {
+            display: 'none'
+        },
+        '::-webkit-search-cancel-button': {
+            display: 'none'
+        }
+    },
+    unfocusedNoContentAfter: {
+        paddingRight: 0
+    }
+});
+const useInputStyles = (0, _react.makeStyles)({
+    small: {
+        paddingRight: _reacttheme.tokens.spacingHorizontalSNudge
+    },
+    medium: {
+        paddingRight: _reacttheme.tokens.spacingHorizontalS
+    },
+    large: {
+        paddingRight: _reacttheme.tokens.spacingHorizontalMNudge
+    }
+});
+const useContentAfterStyles = (0, _react.makeStyles)({
+    contentAfter: {
+        paddingLeft: _reacttheme.tokens.spacingHorizontalM,
+        columnGap: _reacttheme.tokens.spacingHorizontalXS
+    },
+    rest: {
+        height: 0,
+        width: 0,
+        paddingLeft: 0,
+        overflow: 'hidden'
+    }
+});
+const useDismissClassName = (0, _react.makeResetStyles)({
+    boxSizing: 'border-box',
+    color: _reacttheme.tokens.colorNeutralForeground3,
+    display: 'flex',
+    // special case styling for icons (most common case) to ensure they're centered vertically
+    // size: medium (default)
+    '> svg': {
+        fontSize: '20px'
+    },
+    cursor: 'pointer'
+});
+const useDismissStyles = (0, _react.makeStyles)({
+    disabled: {
+        color: _reacttheme.tokens.colorNeutralForegroundDisabled
+    },
+    // Ensure resizable icons show up with the proper font size
+    small: {
+        '> svg': {
+            fontSize: '16px'
+        }
+    },
+    medium: {},
+    large: {
+        '> svg': {
+            fontSize: '24px'
+        }
+    }
+});
+const useSearchBoxStyles_unstable = (state)=>{
+    'use no memo';
+    const { disabled, focused, size } = state;
+    const rootStyles = useRootStyles();
+    const inputStyles = useInputStyles();
+    const contentAfterStyles = useContentAfterStyles();
+    const dismissClassName = useDismissClassName();
+    const dismissStyles = useDismissStyles();
+    state.root.className = (0, _react.mergeClasses)(searchBoxClassNames.root, rootStyles[size], !focused && rootStyles.unfocusedNoContentAfter, state.root.className);
+    state.input.className = (0, _react.mergeClasses)(searchBoxClassNames.input, rootStyles.input, !focused && inputStyles[size], state.input.className);
+    if (state.dismiss) {
+        state.dismiss.className = (0, _react.mergeClasses)(searchBoxClassNames.dismiss, dismissClassName, disabled && dismissStyles.disabled, dismissStyles[size], state.dismiss.className);
+    }
+    if (state.contentBefore) {
+        state.contentBefore.className = (0, _react.mergeClasses)(searchBoxClassNames.contentBefore, state.contentBefore.className);
+    }
+    if (state.contentAfter) {
+        state.contentAfter.className = (0, _react.mergeClasses)(searchBoxClassNames.contentAfter, contentAfterStyles.contentAfter, !focused && contentAfterStyles.rest, state.contentAfter.className);
+    } else if (state.dismiss) {
+        state.dismiss.className = (0, _react.mergeClasses)(state.dismiss.className, contentAfterStyles.contentAfter);
+    }
+    (0, _reactinput.useInputStyles_unstable)(state);
+    return state;
+};

node_modules/@fluentui/react-search/lib-commonjs/index.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SearchBox: function() {
+        return _SearchBox.SearchBox;
+    },
+    renderSearchBox_unstable: function() {
+        return _SearchBox.renderSearchBox_unstable;
+    },
+    searchBoxClassNames: function() {
+        return _SearchBox.searchBoxClassNames;
+    },
+    useSearchBoxBase_unstable: function() {
+        return _SearchBox.useSearchBoxBase_unstable;
+    },
+    useSearchBoxStyles_unstable: function() {
+        return _SearchBox.useSearchBoxStyles_unstable;
+    },
+    useSearchBox_unstable: function() {
+        return _SearchBox.useSearchBox_unstable;
+    }
+});
+const _SearchBox = require("./SearchBox");

node_modules/@fluentui/react-search/lib-commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  SearchBox,\n  renderSearchBox_unstable,\n  searchBoxClassNames,\n  useSearchBoxStyles_unstable,\n  useSearchBox_unstable,\n  useSearchBoxBase_unstable,\n} from './SearchBox';\nexport type {\n  SearchBoxChangeEvent,\n  SearchBoxProps,\n  SearchBoxSlots,\n  SearchBoxState,\n  SearchBoxBaseProps,\n  SearchBoxBaseState,\n} from './SearchBox';\n"],"names":["SearchBox","renderSearchBox_unstable","searchBoxClassNames","useSearchBoxStyles_unstable","useSearchBox_unstable","useSearchBoxBase_unstable"],"mappings":";;;;;;;;;;;;eACEA,oBAAS;;;eACTC,mCAAwB;;;eACxBC,8BAAmB;;;eAGnBG,oCAAyB;;;eAFzBF,sCAA2B;;;eAC3BC,gCAAqB;;;2BAEhB,cAAc"}