feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/NavDrawerHeader.js

@@ -0,0 +1,15 @@
+'use client';
+import * as React from 'react';
+import { renderDrawerHeader_unstable } from '@fluentui/react-drawer';
+import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import { useNavDrawerHeaderStyles_unstable } from './useNavDrawerHeaderStyles.styles';
+import { useNavDrawerHeader_unstable } from './useNavDrawerHeader';
+/**
+ * NavDrawerHeader component
+ */ export const NavDrawerHeader = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useNavDrawerHeader_unstable(props, ref);
+    useNavDrawerHeaderStyles_unstable(state);
+    useCustomStyleHook_unstable('useNavDrawerHeaderStyles_unstable')(state);
+    return renderDrawerHeader_unstable(state);
+});
+NavDrawerHeader.displayName = 'NavDrawerHeader';

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/NavDrawerHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavDrawerHeader/NavDrawerHeader.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { renderDrawerHeader_unstable } from '@fluentui/react-drawer';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nimport { useNavDrawerHeaderStyles_unstable } from './useNavDrawerHeaderStyles.styles';\nimport { useNavDrawerHeader_unstable } from './useNavDrawerHeader';\nimport type { NavDrawerHeaderProps } from './NavDrawerHeader.types';\n\n/**\n * NavDrawerHeader component\n */\nexport const NavDrawerHeader: ForwardRefComponent<NavDrawerHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useNavDrawerHeader_unstable(props, ref);\n\n  useNavDrawerHeaderStyles_unstable(state);\n  useCustomStyleHook_unstable('useNavDrawerHeaderStyles_unstable')(state);\n\n  return renderDrawerHeader_unstable(state);\n});\n\nNavDrawerHeader.displayName = 'NavDrawerHeader';\n"],"names":["React","renderDrawerHeader_unstable","useCustomStyleHook_unstable","useNavDrawerHeaderStyles_unstable","useNavDrawerHeader_unstable","NavDrawerHeader","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,2BAA2B,QAAQ,yBAAyB;AACrE,SAASC,2BAA2B,QAAQ,kCAAkC;AAG9E,SAASC,iCAAiC,QAAQ,oCAAoC;AACtF,SAASC,2BAA2B,QAAQ,uBAAuB;AAGnE;;CAEC,GACD,OAAO,MAAMC,gCAA6DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQL,4BAA4BG,OAAOC;IAEjDL,kCAAkCM;IAClCP,4BAA4B,qCAAqCO;IAEjE,OAAOR,4BAA4BQ;AACrC,GAAG;AAEHJ,gBAAgBK,WAAW,GAAG"}

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/NavDrawerHeader.types.js

@@ -0,0 +1,3 @@
+/**
+ * State used in rendering NavDrawerHeader
+ */ export { };

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/NavDrawerHeader.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavDrawerHeader/NavDrawerHeader.types.ts"],"sourcesContent":["import type { DrawerHeaderProps, DrawerHeaderSlots, DrawerHeaderState } from '@fluentui/react-drawer';\n\nexport type NavDrawerHeaderSlots = DrawerHeaderSlots;\n\n/**\n * NavDrawerHeader Props\n */\nexport type NavDrawerHeaderProps = DrawerHeaderProps;\n\n/**\n * State used in rendering NavDrawerHeader\n */\nexport type NavDrawerHeaderState = DrawerHeaderState;\n"],"names":[],"mappings":"AASA;;CAEC,GACD,WAAqD"}

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/index.js

@@ -0,0 +1,3 @@
+export { NavDrawerHeader } from './NavDrawerHeader';
+export { useNavDrawerHeader_unstable } from './useNavDrawerHeader';
+export { navDrawerHeaderClassNames, useNavDrawerHeaderStyles_unstable } from './useNavDrawerHeaderStyles.styles';

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavDrawerHeader/index.ts"],"sourcesContent":["export { NavDrawerHeader } from './NavDrawerHeader';\nexport type { NavDrawerHeaderProps, NavDrawerHeaderSlots, NavDrawerHeaderState } from './NavDrawerHeader.types';\nexport { useNavDrawerHeader_unstable } from './useNavDrawerHeader';\nexport { navDrawerHeaderClassNames, useNavDrawerHeaderStyles_unstable } from './useNavDrawerHeaderStyles.styles';\n"],"names":["NavDrawerHeader","useNavDrawerHeader_unstable","navDrawerHeaderClassNames","useNavDrawerHeaderStyles_unstable"],"mappings":"AAAA,SAASA,eAAe,QAAQ,oBAAoB;AAEpD,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,yBAAyB,EAAEC,iCAAiC,QAAQ,oCAAoC"}

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/useNavDrawerHeader.js

@@ -0,0 +1,14 @@
+'use client';
+import * as React from 'react';
+import { useDrawerHeader_unstable } from '@fluentui/react-drawer';
+/**
+ * Create the state required to render NavDrawerHeader.
+ *
+ * The returned state can be modified with hooks such as useNavDrawerHeaderStyles_unstable,
+ * before being passed to renderNavDrawerHeader_unstable.
+ *
+ * @param props - props from this instance of NavDrawerHeader
+ * @param ref - reference to root HTMLDivElement of NavDrawerHeader
+ */ export const useNavDrawerHeader_unstable = (props, ref)=>{
+    return useDrawerHeader_unstable(props, ref);
+};

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/useNavDrawerHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavDrawerHeader/useNavDrawerHeader.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDrawerHeader_unstable } from '@fluentui/react-drawer';\n\nimport type { NavDrawerHeaderProps, NavDrawerHeaderState } from './NavDrawerHeader.types';\n\n/**\n * Create the state required to render NavDrawerHeader.\n *\n * The returned state can be modified with hooks such as useNavDrawerHeaderStyles_unstable,\n * before being passed to renderNavDrawerHeader_unstable.\n *\n * @param props - props from this instance of NavDrawerHeader\n * @param ref - reference to root HTMLDivElement of NavDrawerHeader\n */\nexport const useNavDrawerHeader_unstable = (\n  props: NavDrawerHeaderProps,\n  ref: React.Ref<HTMLElement>,\n): NavDrawerHeaderState => {\n  return useDrawerHeader_unstable(props, ref);\n};\n"],"names":["React","useDrawerHeader_unstable","useNavDrawerHeader_unstable","props","ref"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,yBAAyB;AAIlE;;;;;;;;CAQC,GACD,OAAO,MAAMC,8BAA8B,CACzCC,OACAC;IAEA,OAAOH,yBAAyBE,OAAOC;AACzC,EAAE"}

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.js

@@ -0,0 +1,40 @@
+'use client';
+
+import { __styles, mergeClasses } from '@griffel/react';
+import { useDrawerHeaderStyles_unstable } from '@fluentui/react-drawer';
+export const navDrawerHeaderClassNames = {
+  root: 'fui-NavDrawerHeader'
+};
+/**
+ * Styles for the root slot
+ */
+const useStyles = /*#__PURE__*/__styles({
+  root: {
+    jrapky: 0,
+    Frg6f3: 0,
+    t21cq0: 0,
+    B6of3ja: 0,
+    B74szlk: "f1r2n0t9",
+    B1hrpyx: "f80d8h0",
+    Dbcxam: 0,
+    rjzwhg: 0,
+    Bblux5w: "fesrmp8"
+  }
+}, {
+  d: [[".f1r2n0t9{margin:unset;}", {
+    p: -1
+  }], ".f80d8h0{-webkit-padding-start:14px;padding-inline-start:14px;}", [".fesrmp8{padding-block:5px;}", {
+    p: -1
+  }]]
+});
+/**
+ * Apply styling to the NavDrawerHeader slots based on the state
+ */
+export const useNavDrawerHeaderStyles_unstable = state => {
+  'use no memo';
+
+  useDrawerHeaderStyles_unstable(state);
+  const styles = useStyles();
+  state.root.className = mergeClasses(navDrawerHeaderClassNames.root, styles.root, state.root.className);
+  return state;
+};

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","useDrawerHeaderStyles_unstable","navDrawerHeaderClassNames","root","useStyles","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","B1hrpyx","Dbcxam","rjzwhg","Bblux5w","d","p","useNavDrawerHeaderStyles_unstable","state","styles","className"],"sources":["useNavDrawerHeaderStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useDrawerHeaderStyles_unstable } from '@fluentui/react-drawer';\nexport const navDrawerHeaderClassNames = {\n    root: 'fui-NavDrawerHeader'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        margin: 'unset',\n        paddingInlineStart: '14px',\n        paddingBlock: '5px'\n    }\n});\n/**\n * Apply styling to the NavDrawerHeader slots based on the state\n */ export const useNavDrawerHeaderStyles_unstable = (state)=>{\n    'use no memo';\n    useDrawerHeaderStyles_unstable(state);\n    const styles = useStyles();\n    state.root.className = mergeClasses(navDrawerHeaderClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,8BAA8B,QAAQ,wBAAwB;AACvE,OAAO,MAAMC,yBAAyB,GAAG;EACrCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGL,QAAA;EAAAI,IAAA;IAAAE,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAMrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,iCAAiC,GAAIC,KAAK,IAAG;EAC1D,aAAa;;EACbhB,8BAA8B,CAACgB,KAAK,CAAC;EACrC,MAAMC,MAAM,GAAGd,SAAS,CAAC,CAAC;EAC1Ba,KAAK,CAACd,IAAI,CAACgB,SAAS,GAAGnB,YAAY,CAACE,yBAAyB,CAACC,IAAI,EAAEe,MAAM,CAACf,IAAI,EAAEc,KAAK,CAACd,IAAI,CAACgB,SAAS,CAAC;EACtG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.raw.js

@@ -0,0 +1,24 @@
+'use client';
+import { makeStyles, mergeClasses } from '@griffel/react';
+import { useDrawerHeaderStyles_unstable } from '@fluentui/react-drawer';
+export const navDrawerHeaderClassNames = {
+    root: 'fui-NavDrawerHeader'
+};
+/**
+ * Styles for the root slot
+ */ const useStyles = makeStyles({
+    root: {
+        margin: 'unset',
+        paddingInlineStart: '14px',
+        paddingBlock: '5px'
+    }
+});
+/**
+ * Apply styling to the NavDrawerHeader slots based on the state
+ */ export const useNavDrawerHeaderStyles_unstable = (state)=>{
+    'use no memo';
+    useDrawerHeaderStyles_unstable(state);
+    const styles = useStyles();
+    state.root.className = mergeClasses(navDrawerHeaderClassNames.root, styles.root, state.root.className);
+    return state;
+};

node_modules/@fluentui/react-nav/lib/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/NavDrawerHeader/useNavDrawerHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useDrawerHeaderStyles_unstable } from '@fluentui/react-drawer';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { NavDrawerHeaderSlots, NavDrawerHeaderState } from './NavDrawerHeader.types';\n\nexport const navDrawerHeaderClassNames: SlotClassNames<NavDrawerHeaderSlots> = {\n  root: 'fui-NavDrawerHeader',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    margin: 'unset',\n    paddingInlineStart: '14px',\n    paddingBlock: '5px',\n  },\n});\n\n/**\n * Apply styling to the NavDrawerHeader slots based on the state\n */\nexport const useNavDrawerHeaderStyles_unstable = (state: NavDrawerHeaderState): NavDrawerHeaderState => {\n  'use no memo';\n\n  useDrawerHeaderStyles_unstable(state);\n  const styles = useStyles();\n  state.root.className = mergeClasses(navDrawerHeaderClassNames.root, styles.root, state.root.className);\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","useDrawerHeaderStyles_unstable","navDrawerHeaderClassNames","root","useStyles","margin","paddingInlineStart","paddingBlock","useNavDrawerHeaderStyles_unstable","state","styles","className"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,8BAA8B,QAAQ,yBAAyB;AAKxE,OAAO,MAAMC,4BAAkE;IAC7EC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYL,WAAW;IAC3BI,MAAM;QACJE,QAAQ;QACRC,oBAAoB;QACpBC,cAAc;IAChB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,oCAAoC,CAACC;IAChD;IAEAR,+BAA+BQ;IAC/B,MAAMC,SAASN;IACfK,MAAMN,IAAI,CAACQ,SAAS,GAAGX,aAAaE,0BAA0BC,IAAI,EAAEO,OAAOP,IAAI,EAAEM,MAAMN,IAAI,CAACQ,SAAS;IAErG,OAAOF;AACT,EAAE"}