@fluentui/react-infobutton 9.0.0-beta.4 → 9.0.0-beta.41

package/lib/InfoIcon.js

@@ -0,0 +1 @@
+export * from './components/InfoIcon/index';

package/lib/InfoIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["InfoIcon.ts"],"sourcesContent":["export * from './components/InfoIcon/index';\n"],"names":[],"mappings":"AAAA,cAAc,8BAA8B"}

package/lib/InfoIconLabel.js

@@ -0,0 +1 @@
+export * from './components/InfoIconLabel/index';

package/lib/InfoIconLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["InfoIconLabel.ts"],"sourcesContent":["export * from './components/InfoIconLabel/index';\n"],"names":[],"mappings":"AAAA,cAAc,mCAAmC"}

package/lib/InfoLabel.js

@@ -0,0 +1 @@
+export * from './components/InfoLabel/index';

package/lib/InfoLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["InfoLabel.ts"],"sourcesContent":["export * from './components/InfoLabel/index';\n"],"names":[],"mappings":"AAAA,cAAc,+BAA+B"}

package/lib/components/InfoButton/DefaultInfoButtonIcons.js

@@ -1,5 +1,4 @@
 import { Info12Regular, Info12Filled, Info16Regular, Info16Filled, Info20Regular, Info20Filled, bundleIcon } from '@fluentui/react-icons';
-export const DefaultInfoButtonIcon12 = /*#__PURE__*/bundleIcon(Info12Filled, Info12Regular);
-export const DefaultInfoButtonIcon16 = /*#__PURE__*/bundleIcon(Info16Filled, Info16Regular);
-export const DefaultInfoButtonIcon20 = /*#__PURE__*/bundleIcon(Info20Filled, Info20Regular);
-//# sourceMappingURL=DefaultInfoButtonIcons.js.map
+export const DefaultInfoButtonIcon12 = bundleIcon(Info12Filled, Info12Regular);
+export const DefaultInfoButtonIcon16 = bundleIcon(Info16Filled, Info16Regular);
+export const DefaultInfoButtonIcon20 = bundleIcon(Info20Filled, Info20Regular);

package/lib/components/InfoButton/DefaultInfoButtonIcons.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-infobutton/src/components/InfoButton/DefaultInfoButtonIcons.tsx"],"names":[],"mappings":"AAAA,SACE,aADF,EAEE,YAFF,EAGE,aAHF,EAIE,YAJF,EAKE,aALF,EAME,YANF,EAOE,UAPF,QAQO,uBARP;AAUA,OAAO,MAAM,uBAAuB,gBAAG,UAAU,CAAC,YAAD,EAAe,aAAf,CAA1C;AACP,OAAO,MAAM,uBAAuB,gBAAG,UAAU,CAAC,YAAD,EAAe,aAAf,CAA1C;AACP,OAAO,MAAM,uBAAuB,gBAAG,UAAU,CAAC,YAAD,EAAe,aAAf,CAA1C","sourcesContent":["import {\n  Info12Regular,\n  Info12Filled,\n  Info16Regular,\n  Info16Filled,\n  Info20Regular,\n  Info20Filled,\n  bundleIcon,\n} from '@fluentui/react-icons';\n\nexport const DefaultInfoButtonIcon12 = bundleIcon(Info12Filled, Info12Regular);\nexport const DefaultInfoButtonIcon16 = bundleIcon(Info16Filled, Info16Regular);\nexport const DefaultInfoButtonIcon20 = bundleIcon(Info20Filled, Info20Regular);\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["DefaultInfoButtonIcons.tsx"],"sourcesContent":["import {\n  Info12Regular,\n  Info12Filled,\n  Info16Regular,\n  Info16Filled,\n  Info20Regular,\n  Info20Filled,\n  bundleIcon,\n} from '@fluentui/react-icons';\n\nexport const DefaultInfoButtonIcon12 = bundleIcon(Info12Filled, Info12Regular);\nexport const DefaultInfoButtonIcon16 = bundleIcon(Info16Filled, Info16Regular);\nexport const DefaultInfoButtonIcon20 = bundleIcon(Info20Filled, Info20Regular);\n"],"names":["Info12Regular","Info12Filled","Info16Regular","Info16Filled","Info20Regular","Info20Filled","bundleIcon","DefaultInfoButtonIcon12","DefaultInfoButtonIcon16","DefaultInfoButtonIcon20"],"mappings":"AAAA,SACEA,aAAa,EACbC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,UAAU,QACL,wBAAwB;AAE/B,OAAO,MAAMC,0BAA0BD,WAAWL,cAAcD,eAAe;AAC/E,OAAO,MAAMQ,0BAA0BF,WAAWH,cAAcD,eAAe;AAC/E,OAAO,MAAMO,0BAA0BH,WAAWD,cAAcD,eAAe"}

package/lib/components/InfoButton/InfoButton.js

@@ -1,15 +1,12 @@
 import * as React from 'react';
 import { renderInfoButton_unstable } from './renderInfoButton';
 import { useInfoButton_unstable } from './useInfoButton';
-import { useInfoButtonStyles_unstable } from './useInfoButtonStyles';
+import { useInfoButtonStyles_unstable } from './useInfoButtonStyles.styles';
 /**
  * InfoButtons provide a way to display additional information about a form field or an area in the UI.
- */
-
-export const InfoButton = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useInfoButton_unstable(props, ref);
-  useInfoButtonStyles_unstable(state);
-  return renderInfoButton_unstable(state);
+ */ export const InfoButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useInfoButton_unstable(props, ref);
+    useInfoButtonStyles_unstable(state);
+    return renderInfoButton_unstable(state);
 });
 InfoButton.displayName = 'InfoButton';
-//# sourceMappingURL=InfoButton.js.map

package/lib/components/InfoButton/InfoButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-infobutton/src/components/InfoButton/InfoButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AAGA;;AAEG;;AACH,OAAO,MAAM,UAAU,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAC9F,MAAM,KAAK,GAAG,sBAAsB,CAAC,KAAD,EAAQ,GAAR,CAApC;EAEA,4BAA4B,CAAC,KAAD,CAA5B;EACA,OAAO,yBAAyB,CAAC,KAAD,CAAhC;AACD,CAL+D,CAAzD;AAOP,UAAU,CAAC,WAAX,GAAyB,YAAzB","sourcesContent":["import * as React from 'react';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderInfoButton_unstable } from './renderInfoButton';\nimport { useInfoButton_unstable } from './useInfoButton';\nimport { useInfoButtonStyles_unstable } from './useInfoButtonStyles';\nimport type { InfoButtonProps } from './InfoButton.types';\n\n/**\n * InfoButtons provide a way to display additional information about a form field or an area in the UI.\n */\nexport const InfoButton: ForwardRefComponent<InfoButtonProps> = React.forwardRef((props, ref) => {\n  const state = useInfoButton_unstable(props, ref);\n\n  useInfoButtonStyles_unstable(state);\n  return renderInfoButton_unstable(state);\n});\n\nInfoButton.displayName = 'InfoButton';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["InfoButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderInfoButton_unstable } from './renderInfoButton';\nimport { useInfoButton_unstable } from './useInfoButton';\nimport { useInfoButtonStyles_unstable } from './useInfoButtonStyles.styles';\nimport type { InfoButtonProps } from './InfoButton.types';\n\n/**\n * InfoButtons provide a way to display additional information about a form field or an area in the UI.\n */\nexport const InfoButton: ForwardRefComponent<InfoButtonProps> = React.forwardRef((props, ref) => {\n  const state = useInfoButton_unstable(props, ref);\n\n  useInfoButtonStyles_unstable(state);\n  return renderInfoButton_unstable(state);\n});\n\nInfoButton.displayName = 'InfoButton';\n"],"names":["React","renderInfoButton_unstable","useInfoButton_unstable","useInfoButtonStyles_unstable","InfoButton","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E;;CAEC,GACD,OAAO,MAAMC,2BAAmDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC/F,MAAMC,QAAQN,uBAAuBI,OAAOC;IAE5CJ,6BAA6BK;IAC7B,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}

package/lib/components/InfoButton/InfoButton.types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=InfoButton.types.js.map
+export { };

package/lib/components/InfoButton/InfoButton.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"InfoButton.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-infobutton/src/components/InfoButton/InfoButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PopoverProps, PopoverSurface } from '@fluentui/react-popover';\n\nexport type InfoButtonSlots = {\n  root: NonNullable<Slot<'button'>>;\n\n  /**\n   * The Popover element that wraps the content and root. Use this slot to pass props to the Popover.\n   */\n  popover: NonNullable<Slot<PopoverProps>>;\n\n  /**\n   * The content to be displayed in the PopoverSurface when the button is pressed.\n   */\n  content: NonNullable<Slot<typeof PopoverSurface>>;\n};\n\n/**\n * InfoButton Props\n */\nexport type InfoButtonProps = Omit<ComponentProps<Partial<InfoButtonSlots>>, 'disabled'> & {\n  /**\n   * Size of the InfoButton.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering InfoButton\n */\nexport type InfoButtonState = ComponentState<InfoButtonSlots> & Required<Pick<InfoButtonProps, 'size'>>;\n"]}
+{"version":3,"sources":["InfoButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PopoverProps, PopoverSurface } from '@fluentui/react-popover';\n\nexport type InfoButtonSlots = {\n  root: NonNullable<Slot<'button'>>;\n\n  /**\n   * The Popover element that wraps the info and root slots. Use this slot to pass props to the Popover.\n   */\n  popover: NonNullable<Slot<Partial<PopoverProps>>>;\n\n  /**\n   * The information to be displayed in the PopoverSurface when the button is pressed.\n   */\n  info: NonNullable<Slot<typeof PopoverSurface>>;\n};\n\n/**\n * InfoButton Props\n */\nexport type InfoButtonProps = Omit<ComponentProps<Partial<InfoButtonSlots>>, 'disabled'> & {\n  /**\n   * Size of the InfoButton.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering InfoButton\n */\nexport type InfoButtonState = ComponentState<InfoButtonSlots> & Required<Pick<InfoButtonProps, 'size'>>;\n"],"names":[],"mappings":"AAAA,WAgCwG"}

package/lib/components/InfoButton/index.js

@@ -2,5 +2,4 @@ export * from './InfoButton';
 export * from './InfoButton.types';
 export * from './renderInfoButton';
 export * from './useInfoButton';
-export * from './useInfoButtonStyles';
-//# sourceMappingURL=index.js.map
+export * from './useInfoButtonStyles.styles';

package/lib/components/InfoButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-infobutton/src/components/InfoButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC","sourcesContent":["export * from './InfoButton';\nexport * from './InfoButton.types';\nexport * from './renderInfoButton';\nexport * from './useInfoButton';\nexport * from './useInfoButtonStyles';\n"]}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InfoButton';\nexport * from './InfoButton.types';\nexport * from './renderInfoButton';\nexport * from './useInfoButton';\nexport * from './useInfoButtonStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,qBAAqB;AACnC,cAAc,kBAAkB;AAChC,cAAc,+BAA+B"}

package/lib/components/InfoButton/renderInfoButton.js

@@ -1,18 +1,9 @@
-import * as React from 'react';
-import { getSlots } from '@fluentui/react-utilities';
+/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+import { getSlotsNext } from '@fluentui/react-utilities';
 import { PopoverTrigger } from '@fluentui/react-popover';
 /**
  * Render the final JSX of InfoButton
- */
-
-export const renderInfoButton_unstable = state => {
-  const {
-    slots,
-    slotProps
-  } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.popover, { ...slotProps.popover
-  }, /*#__PURE__*/React.createElement(PopoverTrigger, null, /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
-  })), /*#__PURE__*/React.createElement(slots.content, { ...slotProps.content
-  }));
+ */ export const renderInfoButton_unstable = (state)=>{
+    const { slots , slotProps  } = getSlotsNext(state);
+    return /*#__PURE__*/ createElement(slots.popover, slotProps.popover, /*#__PURE__*/ createElement(PopoverTrigger, null, /*#__PURE__*/ createElement(slots.root, slotProps.root)), /*#__PURE__*/ createElement(slots.info, slotProps.info));
 };
-//# sourceMappingURL=renderInfoButton.js.map

package/lib/components/InfoButton/renderInfoButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-infobutton/src/components/InfoButton/renderInfoButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AACA,SAAS,cAAT,QAA+B,yBAA/B;AAIA;;AAEG;;AACH,OAAO,MAAM,yBAAyB,GAAI,KAAD,IAA2B;EAClE,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAkB,KAAlB,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAM,SAAS,CAAC;EAAhB,CAAd,eACE,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CADF,CADF,eAIE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;EAAf,CAAd,CAJF,CADF;AAQD,CAXM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { PopoverTrigger } from '@fluentui/react-popover';\nimport type { PopoverProps } from '@fluentui/react-popover';\nimport type { InfoButtonState, InfoButtonSlots } from './InfoButton.types';\n\n/**\n * Render the final JSX of InfoButton\n */\nexport const renderInfoButton_unstable = (state: InfoButtonState) => {\n  const { slots, slotProps } = getSlots<InfoButtonSlots>(state);\n\n  return (\n    <slots.popover {...(slotProps.popover as PopoverProps)}>\n      <PopoverTrigger>\n        <slots.root {...slotProps.root} />\n      </PopoverTrigger>\n      <slots.content {...slotProps.content} />\n    </slots.popover>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["renderInfoButton.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { PopoverTrigger } from '@fluentui/react-popover';\nimport type { PopoverProps } from '@fluentui/react-popover';\nimport type { InfoButtonState, InfoButtonSlots } from './InfoButton.types';\n\n/**\n * Render the final JSX of InfoButton\n */\nexport const renderInfoButton_unstable = (state: InfoButtonState) => {\n  const { slots, slotProps } = getSlotsNext<InfoButtonSlots>(state);\n\n  return (\n    <slots.popover {...(slotProps.popover as PopoverProps)}>\n      <PopoverTrigger>\n        <slots.root {...slotProps.root} />\n      </PopoverTrigger>\n      <slots.info {...slotProps.info} />\n    </slots.popover>\n  );\n};\n"],"names":["createElement","getSlotsNext","PopoverTrigger","renderInfoButton_unstable","state","slots","slotProps","popover","root","info"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,cAAc,QAAQ,0BAA0B;AAIzD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC,QAA2B;IACnE,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGL,aAA8BG;IAE3D,qBACE,AAhBJ,cAgBKC,MAAME,OAAO,EAAMD,UAAUC,OAAO,gBACnC,AAjBN,cAiBOL,oCACC,AAlBR,cAkBSG,MAAMG,IAAI,EAAKF,UAAUE,IAAI,kBAEhC,AApBN,cAoBOH,MAAMI,IAAI,EAAKH,UAAUG,IAAI;AAGpC,EAAE"}

package/lib/components/InfoButton/useInfoButton.js

@@ -4,14 +4,14 @@ import { getNativeElementProps, mergeCallbacks, resolveShorthand } from '@fluent
 import { Popover, PopoverSurface } from '@fluentui/react-popover';
 import { useControllableState } from '@fluentui/react-utilities';
 const infoButtonIconMap = {
-  small: /*#__PURE__*/React.createElement(DefaultInfoButtonIcon12, null),
-  medium: /*#__PURE__*/React.createElement(DefaultInfoButtonIcon16, null),
-  large: /*#__PURE__*/React.createElement(DefaultInfoButtonIcon20, null)
+    small: /*#__PURE__*/ React.createElement(DefaultInfoButtonIcon12, null),
+    medium: /*#__PURE__*/ React.createElement(DefaultInfoButtonIcon16, null),
+    large: /*#__PURE__*/ React.createElement(DefaultInfoButtonIcon20, null)
 };
 const popoverSizeMap = {
-  small: 'small',
-  medium: 'small',
-  large: 'medium'
+    small: 'small',
+    medium: 'small',
+    large: 'medium'
 };
 /**
  * Create the state required to render InfoButton.
@@ -21,48 +21,44 @@ const popoverSizeMap = {
  *
  * @param props - props from this instance of InfoButton
  * @param ref - reference to root HTMLElement of InfoButton
- */
-
-export const useInfoButton_unstable = (props, ref) => {
-  const {
-    size = 'medium'
-  } = props;
-  const state = {
-    size,
-    components: {
-      root: 'button',
-      popover: Popover,
-      content: PopoverSurface
-    },
-    root: getNativeElementProps('button', {
-      children: infoButtonIconMap[size],
-      type: 'button',
-      ...props,
-      ref
-    }),
-    popover: resolveShorthand(props.popover, {
-      required: true,
-      defaultProps: {
-        children: /*#__PURE__*/React.createElement(React.Fragment, null),
-        positioning: 'above-start',
-        size: popoverSizeMap[size],
-        withArrow: true
-      }
-    }),
-    content: resolveShorthand(props.content, {
-      required: true,
-      defaultProps: {
-        role: 'dialog'
-      }
-    })
-  };
-  const [popoverOpen, setPopoverOpen] = useControllableState({
-    state: state.popover.open,
-    defaultState: state.popover.defaultOpen,
-    initialState: false
-  });
-  state.popover.open = popoverOpen;
-  state.popover.onOpenChange = mergeCallbacks(state.popover.onOpenChange, (e, data) => setPopoverOpen(data.open));
-  return state;
+ */ export const useInfoButton_unstable = (props, ref)=>{
+    const { size ='medium'  } = props;
+    const state = {
+        size,
+        components: {
+            root: 'button',
+            popover: Popover,
+            info: PopoverSurface
+        },
+        root: getNativeElementProps('button', {
+            children: infoButtonIconMap[size],
+            type: 'button',
+            'aria-label': 'information',
+            ...props,
+            ref
+        }),
+        popover: resolveShorthand(props.popover, {
+            required: true,
+            defaultProps: {
+                positioning: 'above-start',
+                size: popoverSizeMap[size],
+                withArrow: true
+            }
+        }),
+        info: resolveShorthand(props.info, {
+            required: true,
+            defaultProps: {
+                role: 'note',
+                tabIndex: -1
+            }
+        })
+    };
+    const [popoverOpen, setPopoverOpen] = useControllableState({
+        state: state.popover.open,
+        defaultState: state.popover.defaultOpen,
+        initialState: false
+    });
+    state.popover.open = popoverOpen;
+    state.popover.onOpenChange = mergeCallbacks(state.popover.onOpenChange, (e, data)=>setPopoverOpen(data.open));
+    return state;
 };
-//# sourceMappingURL=useInfoButton.js.map

package/lib/components/InfoButton/useInfoButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-infobutton/src/components/InfoButton/useInfoButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,uBAAT,EAAkC,uBAAlC,EAA2D,uBAA3D,QAA0F,0BAA1F;AACA,SAAS,qBAAT,EAAgC,cAAhC,EAAgD,gBAAhD,QAAwE,2BAAxE;AACA,SAAS,OAAT,EAAkB,cAAlB,QAAwC,yBAAxC;AACA,SAAS,oBAAT,QAAqC,2BAArC;AAGA,MAAM,iBAAiB,GAAG;EACxB,KAAK,eAAE,KAAA,CAAA,aAAA,CAAC,uBAAD,EAAwB,IAAxB,CADiB;EAExB,MAAM,eAAE,KAAA,CAAA,aAAA,CAAC,uBAAD,EAAwB,IAAxB,CAFgB;EAGxB,KAAK,eAAE,KAAA,CAAA,aAAA,CAAC,uBAAD,EAAwB,IAAxB;AAHiB,CAA1B;AAMA,MAAM,cAAc,GAAG;EACrB,KAAK,EAAE,OADc;EAErB,MAAM,EAAE,OAFa;EAGrB,KAAK,EAAE;AAHc,CAAvB;AAMA;;;;;;;;AAQG;;AACH,OAAO,MAAM,sBAAsB,GAAG,CAAC,KAAD,EAAyB,GAAzB,KAAyE;EAC7G,MAAM;IAAE,IAAI,GAAG;EAAT,IAAsB,KAA5B;EAEA,MAAM,KAAK,GAAoB;IAC7B,IAD6B;IAG7B,UAAU,EAAE;MACV,IAAI,EAAE,QADI;MAEV,OAAO,EAAE,OAFC;MAGV,OAAO,EAAE;IAHC,CAHiB;IAS7B,IAAI,EAAE,qBAAqB,CAAC,QAAD,EAAW;MACpC,QAAQ,EAAE,iBAAiB,CAAC,IAAD,CADS;MAEpC,IAAI,EAAE,QAF8B;MAGpC,GAAG,KAHiC;MAIpC;IAJoC,CAAX,CATE;IAe7B,OAAO,EAAE,gBAAgB,CAAC,KAAK,CAAC,OAAP,EAAgB;MACvC,QAAQ,EAAE,IAD6B;MAEvC,YAAY,EAAE;QACZ,QAAQ,eAAE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,CADE;QAEZ,WAAW,EAAE,aAFD;QAGZ,IAAI,EAAE,cAAc,CAAC,IAAD,CAHR;QAIZ,SAAS,EAAE;MAJC;IAFyB,CAAhB,CAfI;IAwB7B,OAAO,EAAE,gBAAgB,CAAC,KAAK,CAAC,OAAP,EAAgB;MACvC,QAAQ,EAAE,IAD6B;MAEvC,YAAY,EAAE;QACZ,IAAI,EAAE;MADM;IAFyB,CAAhB;EAxBI,CAA/B;EAgCA,MAAM,CAAC,WAAD,EAAc,cAAd,IAAgC,oBAAoB,CAAC;IACzD,KAAK,EAAE,KAAK,CAAC,OAAN,CAAc,IADoC;IAEzD,YAAY,EAAE,KAAK,CAAC,OAAN,CAAc,WAF6B;IAGzD,YAAY,EAAE;EAH2C,CAAD,CAA1D;EAMA,KAAK,CAAC,OAAN,CAAc,IAAd,GAAqB,WAArB;EACA,KAAK,CAAC,OAAN,CAAc,YAAd,GAA6B,cAAc,CAAC,KAAK,CAAC,OAAN,CAAc,YAAf,EAA6B,CAAC,CAAD,EAAI,IAAJ,KAAa,cAAc,CAAC,IAAI,CAAC,IAAN,CAAxD,CAA3C;EAEA,OAAO,KAAP;AACD,CA7CM","sourcesContent":["import * as React from 'react';\nimport { DefaultInfoButtonIcon12, DefaultInfoButtonIcon16, DefaultInfoButtonIcon20 } from './DefaultInfoButtonIcons';\nimport { getNativeElementProps, mergeCallbacks, resolveShorthand } from '@fluentui/react-utilities';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { useControllableState } from '@fluentui/react-utilities';\nimport type { InfoButtonProps, InfoButtonState } from './InfoButton.types';\n\nconst infoButtonIconMap = {\n  small: <DefaultInfoButtonIcon12 />,\n  medium: <DefaultInfoButtonIcon16 />,\n  large: <DefaultInfoButtonIcon20 />,\n} as const;\n\nconst popoverSizeMap = {\n  small: 'small',\n  medium: 'small',\n  large: 'medium',\n} as const;\n\n/**\n * Create the state required to render InfoButton.\n *\n * The returned state can be modified with hooks such as useInfoButtonStyles_unstable,\n * before being passed to renderInfoButton_unstable.\n *\n * @param props - props from this instance of InfoButton\n * @param ref - reference to root HTMLElement of InfoButton\n */\nexport const useInfoButton_unstable = (props: InfoButtonProps, ref: React.Ref<HTMLElement>): InfoButtonState => {\n  const { size = 'medium' } = props;\n\n  const state: InfoButtonState = {\n    size,\n\n    components: {\n      root: 'button',\n      popover: Popover,\n      content: PopoverSurface,\n    },\n\n    root: getNativeElementProps('button', {\n      children: infoButtonIconMap[size],\n      type: 'button',\n      ...props,\n      ref,\n    }),\n    popover: resolveShorthand(props.popover, {\n      required: true,\n      defaultProps: {\n        children: <></>,\n        positioning: 'above-start',\n        size: popoverSizeMap[size],\n        withArrow: true,\n      },\n    }),\n    content: resolveShorthand(props.content, {\n      required: true,\n      defaultProps: {\n        role: 'dialog',\n      },\n    }),\n  };\n\n  const [popoverOpen, setPopoverOpen] = useControllableState({\n    state: state.popover.open,\n    defaultState: state.popover.defaultOpen,\n    initialState: false,\n  });\n\n  state.popover.open = popoverOpen;\n  state.popover.onOpenChange = mergeCallbacks(state.popover.onOpenChange, (e, data) => setPopoverOpen(data.open));\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["useInfoButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { DefaultInfoButtonIcon12, DefaultInfoButtonIcon16, DefaultInfoButtonIcon20 } from './DefaultInfoButtonIcons';\nimport { getNativeElementProps, mergeCallbacks, resolveShorthand } from '@fluentui/react-utilities';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { useControllableState } from '@fluentui/react-utilities';\nimport type { InfoButtonProps, InfoButtonState } from './InfoButton.types';\nimport type { PopoverProps } from '@fluentui/react-popover';\n\nconst infoButtonIconMap = {\n  small: <DefaultInfoButtonIcon12 />,\n  medium: <DefaultInfoButtonIcon16 />,\n  large: <DefaultInfoButtonIcon20 />,\n} as const;\n\nconst popoverSizeMap = {\n  small: 'small',\n  medium: 'small',\n  large: 'medium',\n} as const;\n\n/**\n * Create the state required to render InfoButton.\n *\n * The returned state can be modified with hooks such as useInfoButtonStyles_unstable,\n * before being passed to renderInfoButton_unstable.\n *\n * @param props - props from this instance of InfoButton\n * @param ref - reference to root HTMLElement of InfoButton\n */\nexport const useInfoButton_unstable = (props: InfoButtonProps, ref: React.Ref<HTMLElement>): InfoButtonState => {\n  const { size = 'medium' } = props;\n\n  const state: InfoButtonState = {\n    size,\n\n    components: {\n      root: 'button',\n      popover: Popover as React.FC<Partial<PopoverProps>>,\n      info: PopoverSurface,\n    },\n\n    root: getNativeElementProps('button', {\n      children: infoButtonIconMap[size],\n      type: 'button',\n      'aria-label': 'information',\n      ...props,\n      ref,\n    }),\n    popover: resolveShorthand(props.popover, {\n      required: true,\n      defaultProps: {\n        positioning: 'above-start',\n        size: popoverSizeMap[size],\n        withArrow: true,\n      },\n    }),\n    info: resolveShorthand(props.info, {\n      required: true,\n      defaultProps: {\n        role: 'note',\n        tabIndex: -1,\n      },\n    }),\n  };\n\n  const [popoverOpen, setPopoverOpen] = useControllableState({\n    state: state.popover.open,\n    defaultState: state.popover.defaultOpen,\n    initialState: false,\n  });\n\n  state.popover.open = popoverOpen;\n  state.popover.onOpenChange = mergeCallbacks(state.popover.onOpenChange, (e, data) => setPopoverOpen(data.open));\n\n  return state;\n};\n"],"names":["React","DefaultInfoButtonIcon12","DefaultInfoButtonIcon16","DefaultInfoButtonIcon20","getNativeElementProps","mergeCallbacks","resolveShorthand","Popover","PopoverSurface","useControllableState","infoButtonIconMap","small","medium","large","popoverSizeMap","useInfoButton_unstable","props","ref","size","state","components","root","popover","info","children","type","required","defaultProps","positioning","withArrow","role","tabIndex","popoverOpen","setPopoverOpen","open","defaultState","defaultOpen","initialState","onOpenChange","e","data"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,EAAEC,uBAAuB,EAAEC,uBAAuB,QAAQ,2BAA2B;AACrH,SAASC,qBAAqB,EAAEC,cAAc,EAAEC,gBAAgB,QAAQ,4BAA4B;AACpG,SAASC,OAAO,EAAEC,cAAc,QAAQ,0BAA0B;AAClE,SAASC,oBAAoB,QAAQ,4BAA4B;AAIjE,MAAMC,oBAAoB;IACxBC,qBAAO,oBAACV;IACRW,sBAAQ,oBAACV;IACTW,qBAAO,oBAACV;AACV;AAEA,MAAMW,iBAAiB;IACrBH,OAAO;IACPC,QAAQ;IACRC,OAAO;AACT;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAME,yBAAyB,CAACC,OAAwBC,MAAiD;IAC9G,MAAM,EAAEC,MAAO,SAAQ,EAAE,GAAGF;IAE5B,MAAMG,QAAyB;QAC7BD;QAEAE,YAAY;YACVC,MAAM;YACNC,SAASf;YACTgB,MAAMf;QACR;QAEAa,MAAMjB,sBAAsB,UAAU;YACpCoB,UAAUd,iBAAiB,CAACQ,KAAK;YACjCO,MAAM;YACN,cAAc;YACd,GAAGT,KAAK;YACRC;QACF;QACAK,SAAShB,iBAAiBU,MAAMM,OAAO,EAAE;YACvCI,UAAU,IAAI;YACdC,cAAc;gBACZC,aAAa;gBACbV,MAAMJ,cAAc,CAACI,KAAK;gBAC1BW,WAAW,IAAI;YACjB;QACF;QACAN,MAAMjB,iBAAiBU,MAAMO,IAAI,EAAE;YACjCG,UAAU,IAAI;YACdC,cAAc;gBACZG,MAAM;gBACNC,UAAU,CAAC;YACb;QACF;IACF;IAEA,MAAM,CAACC,aAAaC,eAAe,GAAGxB,qBAAqB;QACzDU,OAAOA,MAAMG,OAAO,CAACY,IAAI;QACzBC,cAAchB,MAAMG,OAAO,CAACc,WAAW;QACvCC,cAAc,KAAK;IACrB;IAEAlB,MAAMG,OAAO,CAACY,IAAI,GAAGF;IACrBb,MAAMG,OAAO,CAACgB,YAAY,GAAGjC,eAAec,MAAMG,OAAO,CAACgB,YAAY,EAAE,CAACC,GAAGC,OAASP,eAAeO,KAAKN,IAAI;IAE7G,OAAOf;AACT,EAAE"}

package/lib/components/InfoButton/useInfoButtonStyles.styles.js

@@ -0,0 +1,153 @@
+import { createFocusOutlineStyle } from '@fluentui/react-tabster';
+import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';
+import { __styles, mergeClasses, shorthands } from '@griffel/react';
+import { tokens, typographyStyles } from '@fluentui/react-theme';
+export const infoButtonClassNames = {
+  root: 'fui-InfoButton',
+  // this className won't be used, but it's needed to satisfy the type checker
+  popover: 'fui-InfoButton__popover',
+  info: 'fui-InfoButton__info'
+};
+/**
+ * Styles for the root slot
+ */
+const useButtonStyles = /*#__PURE__*/__styles({
+  base: {
+    Bt984gj: "f122n59",
+    B7ck84d: "f1ewtqcl",
+    mc9l5x: "ftuwxu6",
+    Brf1p80: "f4d9j23",
+    w71qe1: "f1iuv45f",
+    ha4doy: "fmrv4ls",
+    qhf8xq: "f10pi13n",
+    De3pzq: "f1c21dwh",
+    sj55zd: "fkfq4zb",
+    icvyot: "f1ern45e",
+    vrafjx: ["f1n71otn", "f1deefiw"],
+    oivjwe: "f1h8hb77",
+    wvpqe5: ["f1deefiw", "f1n71otn"],
+    Bbmb7ep: ["f1aa9q02", "f16jpd5f"],
+    Beyfa6y: ["f16jpd5f", "f1aa9q02"],
+    B7oj6ja: ["f1jar5jt", "fyu767a"],
+    Btl43ni: ["fyu767a", "f1jar5jt"],
+    B6of3ja: "f1hu3pq6",
+    t21cq0: ["f11qmguv", "f1tyq0we"],
+    jrapky: "f19f4twv",
+    Frg6f3: ["f1tyq0we", "f11qmguv"],
+    z8tnut: "f1ywm7hm",
+    z189sj: ["f7x41pl", "fruq291"],
+    Byoj8tv: "f14wxoun",
+    uwmqm3: ["fruq291", "f7x41pl"],
+    D0sxk3: "f16u1re",
+    t6yez3: "f1rw4040",
+    Jwef8y: "fjxutwb",
+    Bi91k9c: "f139oj5f",
+    Bk3fhr4: "f1jpd6y0",
+    Bmfj8id: "fuxngvv",
+    iro3zm: "fwiml72",
+    B2d53fq: "f1fg1p5m"
+  },
+  selected: {
+    De3pzq: "f1q9pm1r",
+    sj55zd: "f1qj7y59",
+    D0sxk3: "fgzdkf0",
+    t6yez3: "f15q0o9g",
+    Bsw6fvg: "f1rirnrt",
+    Bbusuzp: "f1cg6951"
+  },
+  highContrast: {
+    Bbusuzp: "fn0tkbb",
+    Bs6v0vm: "f1rp3av6",
+    B46dtvo: "f1u7gwqv",
+    gh1jta: "fl6kagl"
+  },
+  focusIndicator: {
+    Brovlpu: "ftqa4ok",
+    B486eqv: "f2hkw1w",
+    B8q5s1w: "f8hki3x",
+    Bci5o5g: ["f1d2448m", "ffh67wi"],
+    n8qw10: "f1bjia2o",
+    Bdrgwmp: ["ffh67wi", "f1d2448m"],
+    Bm4h7ae: "f15bsgw9",
+    B7ys5i9: "f14e48fq",
+    Busjfv9: "f18yb2kv",
+    Bhk32uz: "fd6o370",
+    Bf4ptjt: "fh1cnn4",
+    kclons: ["fy7oxxb", "f184ne2d"],
+    Bhdgwq3: "fpukqih",
+    Blkhhs4: ["f184ne2d", "fy7oxxb"],
+    Bqtpl0w: "frrh606",
+    clg4pj: ["f1v5zibi", "fo2hd23"],
+    hgwjuy: "ful5kiu",
+    Bonggc9: ["fo2hd23", "f1v5zibi"],
+    B1tsrr9: ["f1jqcqds", "ftffrms"],
+    Dah5zi: ["ftffrms", "f1jqcqds"],
+    Bkh64rk: ["f2e7qr6", "fsr1zz6"],
+    qqdqy8: ["fsr1zz6", "f2e7qr6"],
+    B6dhp37: "f1dvezut",
+    i03rao: ["fd0oaoj", "f1cwg4i8"],
+    Boxcth7: "fjvm52t",
+    Bsom6fd: ["f1cwg4i8", "fd0oaoj"],
+    J0r882: "f57olzd",
+    Bule8hv: ["f4stah7", "fs1por5"],
+    Bjwuhne: "f480a47",
+    Ghsupd: ["fs1por5", "f4stah7"]
+  },
+  large: {
+    z8tnut: "fclwglc",
+    z189sj: ["f1w3695s", "f1b0r8ql"],
+    Byoj8tv: "fywfov9",
+    uwmqm3: ["f1b0r8ql", "f1w3695s"]
+  }
+}, {
+  d: [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f1iuv45f{text-decoration-line:none;}", ".fmrv4ls{vertical-align:middle;}", ".f10pi13n{position:relative;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f1ywm7hm{padding-top:var(--spacingVerticalXS);}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f14wxoun{padding-bottom:var(--spacingVerticalXS);}", ".f16u1re .fui-Icon-filled{display:none;}", ".f1rw4040 .fui-Icon-regular{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f1q9pm1r{background-color:var(--colorTransparentBackgroundSelected);}", ".f1qj7y59{color:var(--colorNeutralForeground2BrandSelected);}", ".fgzdkf0 .fui-Icon-filled{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f15q0o9g .fui-Icon-regular{display:none;}", ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".f57olzd[data-fui-focus-visible]::after{top:calc(2px * -1);}", ".f4stah7[data-fui-focus-visible]::after{right:calc(2px * -1);}", ".fs1por5[data-fui-focus-visible]::after{left:calc(2px * -1);}", ".f480a47[data-fui-focus-visible]::after{bottom:calc(2px * -1);}", ".fclwglc{padding-top:var(--spacingVerticalXXS);}", ".f1w3695s{padding-right:var(--spacingVerticalXXS);}", ".f1b0r8ql{padding-left:var(--spacingVerticalXXS);}", ".fywfov9{padding-bottom:var(--spacingVerticalXXS);}"],
+  h: [".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}", ".f139oj5f:hover{color:var(--colorNeutralForeground2BrandHover);}", ".f1jpd6y0:hover .fui-Icon-filled{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".fuxngvv:hover .fui-Icon-regular{display:none;}", ".fwiml72:hover:active{background-color:var(--colorTransparentBackgroundPressed);}", ".f1fg1p5m:hover:active{color:var(--colorNeutralForeground2BrandPressed);}"],
+  m: [["@media (forced-colors: active){.f1rirnrt{background-color:Highlight;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.f1cg6951{color:Canvas;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.fn0tkbb{color:CanvasText;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.f1rp3av6:hover,.f1rp3av6:hover:active{forced-color-adjust:none;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.f1u7gwqv:hover,.f1u7gwqv:hover:active{background-color:Highlight;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.fl6kagl:hover,.fl6kagl:hover:active{color:Canvas;}}", {
+    m: "(forced-colors: active)"
+  }]],
+  f: [".ftqa4ok:focus{outline-style:none;}"],
+  i: [".f2hkw1w:focus-visible{outline-style:none;}"]
+});
+const usePopoverSurfaceStyles = /*#__PURE__*/__styles({
+  smallMedium: {
+    Bahqtrf: "fk6fouc",
+    Be2twd7: "fy9rknc",
+    Bhrd7zp: "figsok6",
+    Bg96gwp: "fwrc4pm"
+  },
+  large: {
+    Bahqtrf: "fk6fouc",
+    Be2twd7: "fkhj508",
+    Bhrd7zp: "figsok6",
+    Bg96gwp: "f1i3iumi"
+  }
+}, {
+  d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}"]
+});
+/**
+ * Apply styling to the InfoButton slots based on the state
+ */
+export const useInfoButtonStyles_unstable = state => {
+  const {
+    size
+  } = state;
+  const {
+    open
+  } = state.popover;
+  const buttonStyles = useButtonStyles();
+  const popoverSurfaceStyles = usePopoverSurfaceStyles();
+  state.info.className = mergeClasses(infoButtonClassNames.info, size === 'large' && popoverSurfaceStyles.large, state.info.className);
+  state.root.className = mergeClasses(infoButtonClassNames.root, buttonStyles.base, buttonStyles.highContrast, buttonStyles.focusIndicator, open && buttonStyles.selected, size === 'large' && buttonStyles.large, state.root.className);
+  return state;
+};
+//# sourceMappingURL=useInfoButtonStyles.styles.js.map

package/lib/components/InfoButton/useInfoButtonStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createFocusOutlineStyle","iconFilledClassName","iconRegularClassName","__styles","mergeClasses","shorthands","tokens","typographyStyles","infoButtonClassNames","root","popover","info","useButtonStyles","base","Bt984gj","B7ck84d","mc9l5x","Brf1p80","w71qe1","ha4doy","qhf8xq","De3pzq","sj55zd","icvyot","vrafjx","oivjwe","wvpqe5","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","B6of3ja","t21cq0","jrapky","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","D0sxk3","t6yez3","Jwef8y","Bi91k9c","Bk3fhr4","Bmfj8id","iro3zm","B2d53fq","selected","Bsw6fvg","Bbusuzp","highContrast","Bs6v0vm","B46dtvo","gh1jta","focusIndicator","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bule8hv","Bjwuhne","Ghsupd","large","d","h","m","f","i","usePopoverSurfaceStyles","smallMedium","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","useInfoButtonStyles_unstable","state","size","open","buttonStyles","popoverSurfaceStyles","className"],"sources":["useInfoButtonStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const infoButtonClassNames = {\n    root: 'fui-InfoButton',\n    // this className won't be used, but it's needed to satisfy the type checker\n    popover: 'fui-InfoButton__popover',\n    info: 'fui-InfoButton__info'\n};\n/**\n * Styles for the root slot\n */ const useButtonStyles = makeStyles({\n    base: {\n        alignItems: 'center',\n        boxSizing: 'border-box',\n        display: 'inline-flex',\n        justifyContent: 'center',\n        textDecorationLine: 'none',\n        verticalAlign: 'middle',\n        position: 'relative',\n        backgroundColor: tokens.colorTransparentBackground,\n        color: tokens.colorNeutralForeground2,\n        ...shorthands.borderStyle('none'),\n        ...shorthands.borderRadius(tokens.borderRadiusMedium),\n        ...shorthands.margin(0),\n        ...shorthands.padding(tokens.spacingVerticalXS, tokens.spacingHorizontalXS),\n        [`& .${iconFilledClassName}`]: {\n            display: 'none'\n        },\n        [`& .${iconRegularClassName}`]: {\n            display: 'inline-flex'\n        },\n        ':hover': {\n            backgroundColor: tokens.colorTransparentBackgroundHover,\n            color: tokens.colorNeutralForeground2BrandHover,\n            [`& .${iconFilledClassName}`]: {\n                display: 'inline-flex'\n            },\n            [`& .${iconRegularClassName}`]: {\n                display: 'none'\n            }\n        },\n        ':hover:active': {\n            backgroundColor: tokens.colorTransparentBackgroundPressed,\n            color: tokens.colorNeutralForeground2BrandPressed\n        }\n    },\n    selected: {\n        backgroundColor: tokens.colorTransparentBackgroundSelected,\n        color: tokens.colorNeutralForeground2BrandSelected,\n        [`& .${iconFilledClassName}`]: {\n            display: 'inline-flex'\n        },\n        [`& .${iconRegularClassName}`]: {\n            display: 'none'\n        },\n        '@media (forced-colors: active)': {\n            backgroundColor: 'Highlight',\n            color: 'Canvas'\n        }\n    },\n    highContrast: {\n        '@media (forced-colors: active)': {\n            color: 'CanvasText',\n            ':hover,:hover:active': {\n                forcedColorAdjust: 'none',\n                backgroundColor: 'Highlight',\n                color: 'Canvas'\n            }\n        }\n    },\n    focusIndicator: createFocusOutlineStyle(),\n    large: {\n        ...shorthands.padding(tokens.spacingVerticalXXS, tokens.spacingVerticalXXS)\n    }\n});\nconst usePopoverSurfaceStyles = makeStyles({\n    smallMedium: typographyStyles.caption1,\n    large: typographyStyles.body1\n});\n/**\n * Apply styling to the InfoButton slots based on the state\n */ export const useInfoButtonStyles_unstable = (state)=>{\n    const { size  } = state;\n    const { open  } = state.popover;\n    const buttonStyles = useButtonStyles();\n    const popoverSurfaceStyles = usePopoverSurfaceStyles();\n    state.info.className = mergeClasses(infoButtonClassNames.info, size === 'large' && popoverSurfaceStyles.large, state.info.className);\n    state.root.className = mergeClasses(infoButtonClassNames.root, buttonStyles.base, buttonStyles.highContrast, buttonStyles.focusIndicator, open && buttonStyles.selected, size === 'large' && buttonStyles.large, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,yBAAyB;AACjE,SAASC,mBAAmB,EAAEC,oBAAoB,QAAQ,uBAAuB;AACjF,SAAAC,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,oBAAoB,GAAG;EAChCC,IAAI,EAAE,gBAAgB;EACtB;EACAC,OAAO,EAAE,yBAAyB;EAClCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,eAAe,gBAAGT,QAAA;EAAAU,IAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAA1B,MAAA;IAAAC,MAAA;IAAAiB,MAAA;IAAAC,MAAA;IAAAQ,OAAA;IAAAC,OAAA;EAAA;EAAAC,YAAA;IAAAD,OAAA;IAAAE,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAlD,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAgD,CAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;EAAAC,CAAA;AAAA,CAgE3B,CAAC;AACF,MAAMC,uBAAuB,gBAAGxF,QAAA;EAAAyF,WAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAX,KAAA;IAAAQ,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAV,CAAA;AAAA,CAG/B,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMW,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAM;IAAEC;EAAM,CAAC,GAAGD,KAAK;EACvB,MAAM;IAAEE;EAAM,CAAC,GAAGF,KAAK,CAACxF,OAAO;EAC/B,MAAM2F,YAAY,GAAGzF,eAAe,CAAC,CAAC;EACtC,MAAM0F,oBAAoB,GAAGX,uBAAuB,CAAC,CAAC;EACtDO,KAAK,CAACvF,IAAI,CAAC4F,SAAS,GAAGnG,YAAY,CAACI,oBAAoB,CAACG,IAAI,EAAEwF,IAAI,KAAK,OAAO,IAAIG,oBAAoB,CAACjB,KAAK,EAAEa,KAAK,CAACvF,IAAI,CAAC4F,SAAS,CAAC;EACpIL,KAAK,CAACzF,IAAI,CAAC8F,SAAS,GAAGnG,YAAY,CAACI,oBAAoB,CAACC,IAAI,EAAE4F,YAAY,CAACxF,IAAI,EAAEwF,YAAY,CAACnD,YAAY,EAAEmD,YAAY,CAAC/C,cAAc,EAAE8C,IAAI,IAAIC,YAAY,CAACtD,QAAQ,EAAEoD,IAAI,KAAK,OAAO,IAAIE,YAAY,CAAChB,KAAK,EAAEa,KAAK,CAACzF,IAAI,CAAC8F,SAAS,CAAC;EACtO,OAAOL,KAAK;AAChB,CAAC"}

package/lib/components/InfoIcon/InfoIcon.js

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { useInfoIcon_unstable } from './useInfoIcon';
+import { renderInfoIcon_unstable } from './renderInfoIcon';
+import { useInfoIconStyles_unstable } from './useInfoIconStyles.styles';
+/**
+ * InfoIcon component - TODO: add more docs
+ */ export const InfoIcon = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useInfoIcon_unstable(props, ref);
+    useInfoIconStyles_unstable(state);
+    return renderInfoIcon_unstable(state);
+});
+InfoIcon.displayName = 'InfoIcon';

package/lib/components/InfoIcon/InfoIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["InfoIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useInfoIcon_unstable } from './useInfoIcon';\nimport { renderInfoIcon_unstable } from './renderInfoIcon';\nimport { useInfoIconStyles_unstable } from './useInfoIconStyles.styles';\nimport type { InfoIconProps } from './InfoIcon.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * InfoIcon component - TODO: add more docs\n */\nexport const InfoIcon: ForwardRefComponent<InfoIconProps> = React.forwardRef((props, ref) => {\n  const state = useInfoIcon_unstable(props, ref);\n\n  useInfoIconStyles_unstable(state);\n  return renderInfoIcon_unstable(state);\n});\n\nInfoIcon.displayName = 'InfoIcon';\n"],"names":["React","useInfoIcon_unstable","renderInfoIcon_unstable","useInfoIconStyles_unstable","InfoIcon","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AAIxE;;CAEC,GACD,OAAO,MAAMC,yBAA+CJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC3F,MAAMC,QAAQP,qBAAqBK,OAAOC;IAE1CJ,2BAA2BK;IAC3B,OAAON,wBAAwBM;AACjC,GAAG;AAEHJ,SAASK,WAAW,GAAG"}

package/lib/components/InfoIcon/InfoIcon.types.js

@@ -0,0 +1,2 @@
+export { }; // TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from InfoIconProps.
+ // & Required<Pick<InfoIconProps, 'propName'>>

package/lib/components/InfoIcon/InfoIcon.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["InfoIcon.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type InfoIconSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * InfoIcon Props\n */\nexport type InfoIconProps = ComponentProps<InfoIconSlots> & {};\n\n/**\n * State used in rendering InfoIcon\n */\nexport type InfoIconState = ComponentState<InfoIconSlots>;\n// TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from InfoIconProps.\n// & Required<Pick<InfoIconProps, 'propName'>>\n"],"names":[],"mappings":"AAAA,WAc0D,CAC1D,yHAAyH;CACzH,8CAA8C"}

package/lib/components/InfoIcon/index.js

@@ -0,0 +1,5 @@
+export * from './InfoIcon';
+export * from './InfoIcon.types';
+export * from './renderInfoIcon';
+export * from './useInfoIcon';
+export * from './useInfoIconStyles.styles';

package/lib/components/InfoIcon/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InfoIcon';\nexport * from './InfoIcon.types';\nexport * from './renderInfoIcon';\nexport * from './useInfoIcon';\nexport * from './useInfoIconStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,aAAa;AAC3B,cAAc,mBAAmB;AACjC,cAAc,mBAAmB;AACjC,cAAc,gBAAgB;AAC9B,cAAc,6BAA6B"}

package/lib/components/InfoIcon/renderInfoIcon.js

@@ -0,0 +1,9 @@
+/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+import { getSlotsNext } from '@fluentui/react-utilities';
+/**
+ * Render the final JSX of InfoIcon
+ */ export const renderInfoIcon_unstable = (state)=>{
+    const { slots , slotProps  } = getSlotsNext(state);
+    // TODO Add additional slots in the appropriate place
+    return /*#__PURE__*/ createElement(slots.root, slotProps.root);
+};

package/lib/components/InfoIcon/renderInfoIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderInfoIcon.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { InfoIconState, InfoIconSlots } from './InfoIcon.types';\n\n/**\n * Render the final JSX of InfoIcon\n */\nexport const renderInfoIcon_unstable = (state: InfoIconState) => {\n  const { slots, slotProps } = getSlotsNext<InfoIconSlots>(state);\n\n  // TODO Add additional slots in the appropriate place\n  return <slots.root {...slotProps.root} />;\n};\n"],"names":["createElement","getSlotsNext","renderInfoIcon_unstable","state","slots","slotProps","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,QAAyB;IAC/D,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGJ,aAA4BE;IAEzD,qDAAqD;IACrD,qBAAO,AAbT,cAaUC,MAAME,IAAI,EAAKD,UAAUC,IAAI;AACvC,EAAE"}

package/lib/components/InfoIcon/useInfoIcon.js

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { getNativeElementProps } from '@fluentui/react-utilities';
+/**
+ * Create the state required to render InfoIcon.
+ *
+ * The returned state can be modified with hooks such as useInfoIconStyles_unstable,
+ * before being passed to renderInfoIcon_unstable.
+ *
+ * @param props - props from this instance of InfoIcon
+ * @param ref - reference to root HTMLElement of InfoIcon
+ */ export const useInfoIcon_unstable = (props, ref)=>{
+    return {
+        // TODO add appropriate props/defaults
+        components: {
+            // TODO add each slot's element type or component
+            root: 'div'
+        },
+        // TODO add appropriate slots, for example:
+        // mySlot: resolveShorthand(props.mySlot),
+        root: getNativeElementProps('div', {
+            ref,
+            ...props
+        })
+    };
+};

package/lib/components/InfoIcon/useInfoIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useInfoIcon.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { InfoIconProps, InfoIconState } from './InfoIcon.types';\n\n/**\n * Create the state required to render InfoIcon.\n *\n * The returned state can be modified with hooks such as useInfoIconStyles_unstable,\n * before being passed to renderInfoIcon_unstable.\n *\n * @param props - props from this instance of InfoIcon\n * @param ref - reference to root HTMLElement of InfoIcon\n */\nexport const useInfoIcon_unstable = (props: InfoIconProps, ref: React.Ref<HTMLElement>): InfoIconState => {\n  return {\n    // TODO add appropriate props/defaults\n    components: {\n      // TODO add each slot's element type or component\n      root: 'div',\n    },\n    // TODO add appropriate slots, for example:\n    // mySlot: resolveShorthand(props.mySlot),\n    root: getNativeElementProps('div', {\n      ref,\n      ...props,\n    }),\n  };\n};\n"],"names":["React","getNativeElementProps","useInfoIcon_unstable","props","ref","components","root"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,4BAA4B;AAGlE;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC,MAA+C;IACxG,OAAO;QACL,sCAAsC;QACtCC,YAAY;YACV,iDAAiD;YACjDC,MAAM;QACR;QACA,2CAA2C;QAC3C,0CAA0C;QAC1CA,MAAML,sBAAsB,OAAO;YACjCG;YACA,GAAGD,KAAK;QACV;IACF;AACF,EAAE"}

package/lib/components/InfoIcon/useInfoIconStyles.styles.js

@@ -0,0 +1,21 @@
+import { __styles, mergeClasses } from '@griffel/react';
+export const infoIconClassNames = {
+  root: 'fui-InfoIcon'
+};
+/**
+ * Styles for the root slot
+ */
+const useStyles = /*#__PURE__*/__styles({
+  root: {}
+}, {});
+/**
+ * Apply styling to the InfoIcon slots based on the state
+ */
+export const useInfoIconStyles_unstable = state => {
+  const styles = useStyles();
+  state.root.className = mergeClasses(infoIconClassNames.root, styles.root, state.root.className);
+  // TODO Add class names to slots, for example:
+  // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);
+  return state;
+};
+//# sourceMappingURL=useInfoIconStyles.styles.js.map

package/lib/components/InfoIcon/useInfoIconStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","infoIconClassNames","root","useStyles","useInfoIconStyles_unstable","state","styles","className"],"sources":["useInfoIconStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const infoIconClassNames = {\n    root: 'fui-InfoIcon'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n    }\n});\n/**\n * Apply styling to the InfoIcon slots based on the state\n */ export const useInfoIconStyles_unstable = (state)=>{\n    const styles = useStyles();\n    state.root.className = mergeClasses(infoIconClassNames.root, styles.root, state.root.className);\n    // TODO Add class names to slots, for example:\n    // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;AAAA,KAGrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAME,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGP,YAAY,CAACC,kBAAkB,CAACC,IAAI,EAAEI,MAAM,CAACJ,IAAI,EAAEG,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC/F;EACA;EACA,OAAOF,KAAK;AAChB,CAAC"}

package/lib/components/InfoIconLabel/InfoIconLabel.js

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { useInfoIconLabel_unstable } from './useInfoIconLabel';
+import { renderInfoIconLabel_unstable } from './renderInfoIconLabel';
+import { useInfoIconLabelStyles_unstable } from './useInfoIconLabelStyles.styles';
+/**
+ * InfoIconLabel component - TODO: add more docs
+ */ export const InfoIconLabel = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useInfoIconLabel_unstable(props, ref);
+    useInfoIconLabelStyles_unstable(state);
+    return renderInfoIconLabel_unstable(state);
+});
+InfoIconLabel.displayName = 'InfoIconLabel';

package/lib/components/InfoIconLabel/InfoIconLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["InfoIconLabel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useInfoIconLabel_unstable } from './useInfoIconLabel';\nimport { renderInfoIconLabel_unstable } from './renderInfoIconLabel';\nimport { useInfoIconLabelStyles_unstable } from './useInfoIconLabelStyles.styles';\nimport type { InfoIconLabelProps } from './InfoIconLabel.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * InfoIconLabel component - TODO: add more docs\n */\nexport const InfoIconLabel: ForwardRefComponent<InfoIconLabelProps> = React.forwardRef((props, ref) => {\n  const state = useInfoIconLabel_unstable(props, ref);\n\n  useInfoIconLabelStyles_unstable(state);\n  return renderInfoIconLabel_unstable(state);\n});\n\nInfoIconLabel.displayName = 'InfoIconLabel';\n"],"names":["React","useInfoIconLabel_unstable","renderInfoIconLabel_unstable","useInfoIconLabelStyles_unstable","InfoIconLabel","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAIlF;;CAEC,GACD,OAAO,MAAMC,8BAAyDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrG,MAAMC,QAAQP,0BAA0BK,OAAOC;IAE/CJ,gCAAgCK;IAChC,OAAON,6BAA6BM;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}

package/lib/components/InfoIconLabel/InfoIconLabel.types.js

@@ -0,0 +1,2 @@
+export { }; // TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from InfoIconLabelProps.
+ // & Required<Pick<InfoIconLabelProps, 'propName'>>

package/lib/components/InfoIconLabel/InfoIconLabel.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["InfoIconLabel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type InfoIconLabelSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * InfoIconLabel Props\n */\nexport type InfoIconLabelProps = ComponentProps<InfoIconLabelSlots> & {};\n\n/**\n * State used in rendering InfoIconLabel\n */\nexport type InfoIconLabelState = ComponentState<InfoIconLabelSlots>;\n// TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from InfoIconLabelProps.\n// & Required<Pick<InfoIconLabelProps, 'propName'>>\n"],"names":[],"mappings":"AAAA,WAcoE,CACpE,8HAA8H;CAC9H,mDAAmD"}

package/lib/components/InfoIconLabel/index.js

@@ -0,0 +1,5 @@
+export * from './InfoIconLabel';
+export * from './InfoIconLabel.types';
+export * from './renderInfoIconLabel';
+export * from './useInfoIconLabel';
+export * from './useInfoIconLabelStyles.styles';

package/lib/components/InfoIconLabel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InfoIconLabel';\nexport * from './InfoIconLabel.types';\nexport * from './renderInfoIconLabel';\nexport * from './useInfoIconLabel';\nexport * from './useInfoIconLabelStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,kCAAkC"}