@fluentui/react-teaching-popover 0.0.0-nightly-20240423-0406.1

package/lib/components/TeachingPopoverCarouselFooter/useTeachingPopoverCarouselFooterStyles.styles.js

@@ -0,0 +1,39 @@
+import { __styles, mergeClasses, shorthands } from '@griffel/react';
+export const teachingPopoverCarouselFooterClassNames = {
+  root: 'fui-TeachingPopoverCarouselFooter',
+  previous: 'fui-TeachingPopoverCarouselFooter__previous',
+  next: 'fui-TeachingPopoverCarouselFooter__next'
+};
+// Todo: Page change animation & styles
+const useStyles = /*#__PURE__*/__styles({
+  root: {
+    mc9l5x: "f22iagw",
+    Beiy3e4: "f1063pyq"
+  },
+  rootCentered: {
+    Brf1p80: "f1869bpl",
+    i8kkvl: "f4px1ci",
+    Belr9w4: "fn67r4l"
+  },
+  rootRightAligned: {
+    i8kkvl: "f4px1ci",
+    Belr9w4: "fn67r4l",
+    Bp34fd5: "f1y65ohq"
+  }
+}, {
+  d: [".f22iagw{display:flex;}", ".f1063pyq{flex-direction:row;}", ".f1869bpl{justify-content:space-between;}", ".f4px1ci{column-gap:8px;}", ".fn67r4l{row-gap:8px;}", ".f1y65ohq :first-child{-webkit-margin-end:auto;margin-inline-end:auto;}"]
+});
+/** Applies style classnames to slots */
+export const useTeachingPopoverCarouselFooterStyles_unstable = state => {
+  const styles = useStyles();
+  const {
+    layout
+  } = state;
+  state.root.className = mergeClasses(teachingPopoverCarouselFooterClassNames.root, styles.root, layout === 'centered' ? styles.rootCentered : styles.rootRightAligned, state.root.className);
+  if (state.previous) {
+    state.previous.className = mergeClasses(teachingPopoverCarouselFooterClassNames.previous, state.previous.className);
+  }
+  state.next.className = mergeClasses(teachingPopoverCarouselFooterClassNames.next, state.next.className);
+  return state;
+};
+//# sourceMappingURL=useTeachingPopoverCarouselFooterStyles.styles.js.map

package/lib/components/TeachingPopoverCarouselFooter/useTeachingPopoverCarouselFooterStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","shorthands","teachingPopoverCarouselFooterClassNames","root","previous","next","useStyles","mc9l5x","Beiy3e4","rootCentered","Brf1p80","i8kkvl","Belr9w4","rootRightAligned","Bp34fd5","d","useTeachingPopoverCarouselFooterStyles_unstable","state","styles","layout","className"],"sources":["useTeachingPopoverCarouselFooterStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nexport const teachingPopoverCarouselFooterClassNames = {\n    root: 'fui-TeachingPopoverCarouselFooter',\n    previous: 'fui-TeachingPopoverCarouselFooter__previous',\n    next: 'fui-TeachingPopoverCarouselFooter__next'\n};\n// Todo: Page change animation & styles\nconst useStyles = makeStyles({\n    root: {\n        display: 'flex',\n        flexDirection: 'row'\n    },\n    rootCentered: {\n        justifyContent: 'space-between',\n        ...shorthands.gap('8px')\n    },\n    rootRightAligned: {\n        ...shorthands.gap('8px'),\n        '& :first-child': {\n            marginInlineEnd: 'auto'\n        }\n    }\n});\n/** Applies style classnames to slots */ export const useTeachingPopoverCarouselFooterStyles_unstable = (state)=>{\n    const styles = useStyles();\n    const { layout } = state;\n    state.root.className = mergeClasses(teachingPopoverCarouselFooterClassNames.root, styles.root, layout === 'centered' ? styles.rootCentered : styles.rootRightAligned, state.root.className);\n    if (state.previous) {\n        state.previous.className = mergeClasses(teachingPopoverCarouselFooterClassNames.previous, state.previous.className);\n    }\n    state.next.className = mergeClasses(teachingPopoverCarouselFooterClassNames.next, state.next.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,OAAO,MAAMC,uCAAuC,GAAG;EACnDC,IAAI,EAAE,mCAAmC;EACzCC,QAAQ,EAAE,6CAA6C;EACvDC,IAAI,EAAE;AACV,CAAC;AACD;AACA,MAAMC,SAAS,gBAAGP,QAAA;EAAAI,IAAA;IAAAI,MAAA;IAAAC,OAAA;EAAA;EAAAC,YAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,gBAAA;IAAAF,MAAA;IAAAC,OAAA;IAAAE,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAejB,CAAC;AACF;AAAyC,OAAO,MAAMC,+CAA+C,GAAIC,KAAK,IAAG;EAC7G,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1B,MAAM;IAAEa;EAAO,CAAC,GAAGF,KAAK;EACxBA,KAAK,CAACd,IAAI,CAACiB,SAAS,GAAGpB,YAAY,CAACE,uCAAuC,CAACC,IAAI,EAAEe,MAAM,CAACf,IAAI,EAAEgB,MAAM,KAAK,UAAU,GAAGD,MAAM,CAACT,YAAY,GAAGS,MAAM,CAACL,gBAAgB,EAAEI,KAAK,CAACd,IAAI,CAACiB,SAAS,CAAC;EAC3L,IAAIH,KAAK,CAACb,QAAQ,EAAE;IAChBa,KAAK,CAACb,QAAQ,CAACgB,SAAS,GAAGpB,YAAY,CAACE,uCAAuC,CAACE,QAAQ,EAAEa,KAAK,CAACb,QAAQ,CAACgB,SAAS,CAAC;EACvH;EACAH,KAAK,CAACZ,IAAI,CAACe,SAAS,GAAGpB,YAAY,CAACE,uCAAuC,CAACG,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACe,SAAS,CAAC;EACvG,OAAOH,KAAK;AAChB,CAAC"}

package/lib/components/TeachingPopoverCarouselFooterButton/TeachingPopoverCarouselFooterButton.js

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { useTeachingPopoverCarouselFooterButton_unstable } from './useTeachingPopoverCarouselFooterButton';
+import { renderTeachingPopoverCarouselFooterButton_unstable } from './renderTeachingPopoverCarouselFooterButton';
+import { useTeachingPopoverCarouselFooterButtonStyles_unstable } from './useTeachingPopoverCarouselFooterButtonStyles.styles';
+/**
+ * TeachingPopoverCarouselFooterButton component
+ *
+ * TeachingPopoverCarouselFooterButton extends Button and injects additional styling and onClick functionality
+ * to match the context provided by TeachingPopover & TeachingPopoverCarousel
+ */ export const TeachingPopoverCarouselFooterButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTeachingPopoverCarouselFooterButton_unstable(props, ref);
+    useTeachingPopoverCarouselFooterButtonStyles_unstable(state);
+    return renderTeachingPopoverCarouselFooterButton_unstable(state);
+});
+TeachingPopoverCarouselFooterButton.displayName = 'TeachingPopoverCarouselFooterButton';

package/lib/components/TeachingPopoverCarouselFooterButton/TeachingPopoverCarouselFooterButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TeachingPopoverCarouselFooterButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTeachingPopoverCarouselFooterButton_unstable } from './useTeachingPopoverCarouselFooterButton';\nimport { renderTeachingPopoverCarouselFooterButton_unstable } from './renderTeachingPopoverCarouselFooterButton';\nimport { useTeachingPopoverCarouselFooterButtonStyles_unstable } from './useTeachingPopoverCarouselFooterButtonStyles.styles';\nimport type { TeachingPopoverCarouselFooterButtonProps } from './TeachingPopoverCarouselFooterButton.types';\n\n/**\n * TeachingPopoverCarouselFooterButton component\n *\n * TeachingPopoverCarouselFooterButton extends Button and injects additional styling and onClick functionality\n * to match the context provided by TeachingPopover & TeachingPopoverCarousel\n */\nexport const TeachingPopoverCarouselFooterButton: ForwardRefComponent<TeachingPopoverCarouselFooterButtonProps> =\n  React.forwardRef((props, ref) => {\n    const state = useTeachingPopoverCarouselFooterButton_unstable(props, ref);\n\n    useTeachingPopoverCarouselFooterButtonStyles_unstable(state);\n\n    return renderTeachingPopoverCarouselFooterButton_unstable(state);\n  });\n\nTeachingPopoverCarouselFooterButton.displayName = 'TeachingPopoverCarouselFooterButton';\n"],"names":["React","useTeachingPopoverCarouselFooterButton_unstable","renderTeachingPopoverCarouselFooterButton_unstable","useTeachingPopoverCarouselFooterButtonStyles_unstable","TeachingPopoverCarouselFooterButton","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,+CAA+C,QAAQ,2CAA2C;AAC3G,SAASC,kDAAkD,QAAQ,8CAA8C;AACjH,SAASC,qDAAqD,QAAQ,wDAAwD;AAG9H;;;;;CAKC,GACD,OAAO,MAAMC,oDACXJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACvB,MAAMC,QAAQP,gDAAgDK,OAAOC;IAErEJ,sDAAsDK;IAEtD,OAAON,mDAAmDM;AAC5D,GAAG;AAELJ,oCAAoCK,WAAW,GAAG"}

package/lib/components/TeachingPopoverCarouselFooterButton/TeachingPopoverCarouselFooterButton.types.js

@@ -0,0 +1 @@
+export { };

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

@@ -0,0 +1 @@
+{"version":3,"sources":["TeachingPopoverCarouselFooterButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { PopoverContextValue } from '@fluentui/react-popover';\nimport { ButtonProps, ButtonState } from '@fluentui/react-button';\nimport { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport { ReactNode } from 'react';\n\nexport type TeachingPopoverCarouselFooterButtonSlots = {\n  root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;\n};\n\n/**\n * TeachingPopoverCarouselFooterButton Props\n */\nexport type TeachingPopoverCarouselFooterButtonProps = ComponentProps<TeachingPopoverCarouselFooterButtonSlots> &\n  ButtonProps & {\n    /**\n     * Defines whether the button should be next or previous type - used for both styling and functionality.\n     */\n    navType: 'next' | 'prev';\n\n    /**\n     * The ReactNode provided to the button when it is on it's first (navType 'prev') or last (navType 'next') step\n     */\n    altText: ReactNode;\n  };\n\n/**\n * State used in rendering TeachingPopoverCarouselFooterButton\n */\nexport type TeachingPopoverCarouselFooterButtonState = ButtonState &\n  ComponentState<TeachingPopoverCarouselFooterButtonSlots> &\n  Pick<TeachingPopoverCarouselFooterButtonProps, 'navType' | 'altText'> & {\n    /* Rename popover appearance to prevent conflict with button appearance */\n    popoverAppearance: PopoverContextValue['appearance'];\n  };\n"],"names":[],"mappings":"AAAA,WAkCI"}

package/lib/components/TeachingPopoverCarouselFooterButton/index.js

@@ -0,0 +1,5 @@
+export * from './TeachingPopoverCarouselFooterButton';
+export * from './TeachingPopoverCarouselFooterButton.types';
+export * from './renderTeachingPopoverCarouselFooterButton';
+export * from './useTeachingPopoverCarouselFooterButton';
+export * from './useTeachingPopoverCarouselFooterButtonStyles.styles';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TeachingPopoverCarouselFooterButton';\nexport * from './TeachingPopoverCarouselFooterButton.types';\nexport * from './renderTeachingPopoverCarouselFooterButton';\nexport * from './useTeachingPopoverCarouselFooterButton';\nexport * from './useTeachingPopoverCarouselFooterButtonStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,wCAAwC;AACtD,cAAc,8CAA8C;AAC5D,cAAc,8CAA8C;AAC5D,cAAc,2CAA2C;AACzD,cAAc,wDAAwD"}

package/lib/components/TeachingPopoverCarouselFooterButton/renderTeachingPopoverCarouselFooterButton.js

@@ -0,0 +1,8 @@
+  import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-utilities';
+/**
+ * Render the final JSX of TeachingPopoverCarouselFooterButton
+ */ export const renderTeachingPopoverCarouselFooterButton_unstable = (state)=>{
+    assertSlots(state);
+    return /*#__PURE__*/ _jsx(state.root, {});
+};

package/lib/components/TeachingPopoverCarouselFooterButton/renderTeachingPopoverCarouselFooterButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderTeachingPopoverCarouselFooterButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type {\n  TeachingPopoverCarouselFooterButtonState,\n  TeachingPopoverCarouselFooterButtonSlots,\n} from './TeachingPopoverCarouselFooterButton.types';\n\n/**\n * Render the final JSX of TeachingPopoverCarouselFooterButton\n */\nexport const renderTeachingPopoverCarouselFooterButton_unstable = (state: TeachingPopoverCarouselFooterButtonState) => {\n  assertSlots<TeachingPopoverCarouselFooterButtonSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderTeachingPopoverCarouselFooterButton_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAMxD;;CAEC,GACD,OAAO,MAAMC,qDAAqD,CAACC;IACjEF,YAAsDE;IAEtD,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/TeachingPopoverCarouselFooterButton/useTeachingPopoverCarouselFooterButton.js

@@ -0,0 +1,71 @@
+import * as React from 'react';
+import { getIntrinsicElementProps, mergeCallbacks, slot } from '@fluentui/react-utilities';
+import { usePopoverContext_unstable } from '@fluentui/react-popover';
+import { useCarouselContext_unstable } from '../TeachingPopoverCarousel/Carousel/CarouselContext';
+import { useEventCallback } from '@fluentui/react-utilities';
+import { useButton_unstable } from '@fluentui/react-button';
+import { useCarouselValues_unstable } from '../TeachingPopoverCarousel/Carousel/useCarouselValues';
+/**
+ * Create the state required to render TeachingPopoverCarouselFooterButton.
+ *
+ * The returned state can be modified with hooks such as useTeachingPopoverCarouselFooterButtonStyles_unstable,
+ * before being passed to renderTeachingPopoverCarouselFooterButton_unstable.
+ *
+ * @param props - props from this instance of TeachingPopoverCarouselFooterButton
+ * @param ref - reference to root HTMLDivElement of TeachingPopoverCarouselFooterButton
+ */ export const useTeachingPopoverCarouselFooterButton_unstable = (props, ref)=>{
+    const { navType, altText } = props;
+    const popoverAppearance = usePopoverContext_unstable((context)=>context.appearance);
+    const selectPageByDirection = useCarouselContext_unstable((c)=>c.selectPageByDirection);
+    const values = useCarouselValues_unstable((snapshot)=>snapshot);
+    const activeValue = useCarouselContext_unstable((c)=>c.value);
+    const handleClick = (event)=>{
+        if (event.isDefaultPrevented()) {
+            return;
+        }
+        selectPageByDirection(event, navType);
+    };
+    const handleButtonClick = useEventCallback(mergeCallbacks(handleClick, props.onClick));
+    const isTrailing = React.useMemo(()=>{
+        if (!activeValue) {
+            return false;
+        }
+        if (navType === 'prev') {
+            return values.indexOf(activeValue) === 0;
+        }
+        return values.indexOf(activeValue) === values.length - 1;
+    }, [
+        navType,
+        activeValue,
+        values
+    ]);
+    let buttonAppearanceType;
+    if (navType === 'next') {
+        buttonAppearanceType = popoverAppearance === 'brand' ? undefined : 'primary';
+    } else {
+        buttonAppearanceType = popoverAppearance === 'brand' ? 'outline' : undefined;
+    }
+    /* Handle altText on trailing step */ let buttonChild = props.children;
+    if (isTrailing) {
+        buttonChild = altText;
+    }
+    return {
+        ...useButton_unstable({
+            appearance: buttonAppearanceType,
+            ...props
+        }, ref),
+        navType,
+        popoverAppearance,
+        altText,
+        // Override useButton root slot
+        root: slot.always(getIntrinsicElementProps('button', {
+            ref,
+            appearance: buttonAppearanceType,
+            ...props,
+            onClick: handleButtonClick,
+            children: buttonChild
+        }), {
+            elementType: 'button'
+        })
+    };
+};

package/lib/components/TeachingPopoverCarouselFooterButton/useTeachingPopoverCarouselFooterButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useTeachingPopoverCarouselFooterButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, mergeCallbacks, slot } from '@fluentui/react-utilities';\nimport type {\n  TeachingPopoverCarouselFooterButtonProps,\n  TeachingPopoverCarouselFooterButtonState,\n} from './TeachingPopoverCarouselFooterButton.types';\nimport { usePopoverContext_unstable } from '@fluentui/react-popover';\nimport { useCarouselContext_unstable } from '../TeachingPopoverCarousel/Carousel/CarouselContext';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useButton_unstable } from '@fluentui/react-button';\nimport { useCarouselValues_unstable } from '../TeachingPopoverCarousel/Carousel/useCarouselValues';\n\n/**\n * Create the state required to render TeachingPopoverCarouselFooterButton.\n *\n * The returned state can be modified with hooks such as useTeachingPopoverCarouselFooterButtonStyles_unstable,\n * before being passed to renderTeachingPopoverCarouselFooterButton_unstable.\n *\n * @param props - props from this instance of TeachingPopoverCarouselFooterButton\n * @param ref - reference to root HTMLDivElement of TeachingPopoverCarouselFooterButton\n */\nexport const useTeachingPopoverCarouselFooterButton_unstable = (\n  props: TeachingPopoverCarouselFooterButtonProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): TeachingPopoverCarouselFooterButtonState => {\n  const { navType, altText } = props;\n\n  const popoverAppearance = usePopoverContext_unstable(context => context.appearance);\n  const selectPageByDirection = useCarouselContext_unstable(c => c.selectPageByDirection);\n  const values = useCarouselValues_unstable(snapshot => snapshot);\n  const activeValue = useCarouselContext_unstable(c => c.value);\n\n  const handleClick = (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement>) => {\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n\n    selectPageByDirection(event, navType);\n  };\n\n  const handleButtonClick = useEventCallback(mergeCallbacks(handleClick, props.onClick));\n\n  const isTrailing = React.useMemo(() => {\n    if (!activeValue) {\n      return false;\n    }\n\n    if (navType === 'prev') {\n      return values.indexOf(activeValue) === 0;\n    }\n\n    return values.indexOf(activeValue) === values.length - 1;\n  }, [navType, activeValue, values]);\n\n  let buttonAppearanceType: 'primary' | 'outline' | undefined;\n\n  if (navType === 'next') {\n    buttonAppearanceType = popoverAppearance === 'brand' ? undefined : 'primary';\n  } else {\n    buttonAppearanceType = popoverAppearance === 'brand' ? 'outline' : undefined;\n  }\n\n  /* Handle altText on trailing step */\n  let buttonChild = props.children;\n  if (isTrailing) {\n    buttonChild = altText;\n  }\n\n  return {\n    ...useButton_unstable({ appearance: buttonAppearanceType, ...props }, ref),\n    navType,\n    popoverAppearance,\n    altText,\n    // Override useButton root slot\n    root: slot.always(\n      getIntrinsicElementProps('button', {\n        ref,\n        appearance: buttonAppearanceType,\n        ...props,\n        onClick: handleButtonClick,\n        children: buttonChild,\n      }),\n      { elementType: 'button' },\n    ),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","mergeCallbacks","slot","usePopoverContext_unstable","useCarouselContext_unstable","useEventCallback","useButton_unstable","useCarouselValues_unstable","useTeachingPopoverCarouselFooterButton_unstable","props","ref","navType","altText","popoverAppearance","context","appearance","selectPageByDirection","c","values","snapshot","activeValue","value","handleClick","event","isDefaultPrevented","handleButtonClick","onClick","isTrailing","useMemo","indexOf","length","buttonAppearanceType","undefined","buttonChild","children","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,cAAc,EAAEC,IAAI,QAAQ,4BAA4B;AAK3F,SAASC,0BAA0B,QAAQ,0BAA0B;AACrE,SAASC,2BAA2B,QAAQ,sDAAsD;AAClG,SAASC,gBAAgB,QAAQ,4BAA4B;AAC7D,SAASC,kBAAkB,QAAQ,yBAAyB;AAC5D,SAASC,0BAA0B,QAAQ,wDAAwD;AAEnG;;;;;;;;CAQC,GACD,OAAO,MAAMC,kDAAkD,CAC7DC,OACAC;IAEA,MAAM,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGH;IAE7B,MAAMI,oBAAoBV,2BAA2BW,CAAAA,UAAWA,QAAQC,UAAU;IAClF,MAAMC,wBAAwBZ,4BAA4Ba,CAAAA,IAAKA,EAAED,qBAAqB;IACtF,MAAME,SAASX,2BAA2BY,CAAAA,WAAYA;IACtD,MAAMC,cAAchB,4BAA4Ba,CAAAA,IAAKA,EAAEI,KAAK;IAE5D,MAAMC,cAAc,CAACC;QACnB,IAAIA,MAAMC,kBAAkB,IAAI;YAC9B;QACF;QAEAR,sBAAsBO,OAAOZ;IAC/B;IAEA,MAAMc,oBAAoBpB,iBAAiBJ,eAAeqB,aAAab,MAAMiB,OAAO;IAEpF,MAAMC,aAAa5B,MAAM6B,OAAO,CAAC;QAC/B,IAAI,CAACR,aAAa;YAChB,OAAO;QACT;QAEA,IAAIT,YAAY,QAAQ;YACtB,OAAOO,OAAOW,OAAO,CAACT,iBAAiB;QACzC;QAEA,OAAOF,OAAOW,OAAO,CAACT,iBAAiBF,OAAOY,MAAM,GAAG;IACzD,GAAG;QAACnB;QAASS;QAAaF;KAAO;IAEjC,IAAIa;IAEJ,IAAIpB,YAAY,QAAQ;QACtBoB,uBAAuBlB,sBAAsB,UAAUmB,YAAY;IACrE,OAAO;QACLD,uBAAuBlB,sBAAsB,UAAU,YAAYmB;IACrE;IAEA,mCAAmC,GACnC,IAAIC,cAAcxB,MAAMyB,QAAQ;IAChC,IAAIP,YAAY;QACdM,cAAcrB;IAChB;IAEA,OAAO;QACL,GAAGN,mBAAmB;YAAES,YAAYgB;YAAsB,GAAGtB,KAAK;QAAC,GAAGC,IAAI;QAC1EC;QACAE;QACAD;QACA,+BAA+B;QAC/BuB,MAAMjC,KAAKkC,MAAM,CACfpC,yBAAyB,UAAU;YACjCU;YACAK,YAAYgB;YACZ,GAAGtB,KAAK;YACRiB,SAASD;YACTS,UAAUD;QACZ,IACA;YAAEI,aAAa;QAAS;IAE5B;AACF,EAAE"}

package/lib/components/TeachingPopoverCarouselFooterButton/useTeachingPopoverCarouselFooterButtonStyles.styles.js

@@ -0,0 +1,64 @@
+import { __styles, mergeClasses, shorthands } from '@griffel/react';
+import { tokens } from '@fluentui/react-theme';
+import { useButtonStyles_unstable } from '@fluentui/react-button';
+export const teachingPopoverCarouselFooterButtonClassNames = {
+  root: 'fui-TeachingPopoverCarouselFooterButton'
+};
+const useStyles = /*#__PURE__*/__styles({
+  root: {
+    Bf4jedk: "f14es27b"
+  },
+  brandNext: {
+    sj55zd: "f16muhyy",
+    De3pzq: "f10s6wn9",
+    g2u3we: "f1iimpp0",
+    h3c5rm: ["f19uhqvu", "f1nx14hx"],
+    B9xav0g: "fnqa90p",
+    zhjwy3: ["f1nx14hx", "f19uhqvu"],
+    Bi91k9c: "f3ymbdj",
+    Jwef8y: "f1rgtb95",
+    B2d53fq: "f1pu27ff",
+    iro3zm: "f1d5c7in"
+  },
+  brandPrevious: {
+    sj55zd: "f1phragk",
+    De3pzq: "ffp7eso",
+    g2u3we: "fm1ebug",
+    h3c5rm: ["f28omuz", "f1uhflii"],
+    B9xav0g: "f1ixw5o4",
+    zhjwy3: ["f1uhflii", "f28omuz"],
+    Bi91k9c: "f1rq72xc",
+    Bgoe8wy: "f1bg5g8r",
+    Bwzppfd: ["f1h9bnsk", "f12x9t0k"],
+    oetu4i: "f19ervry",
+    gg5e9n: ["f12x9t0k", "f1h9bnsk"],
+    Jwef8y: "f15wkkf3",
+    B2d53fq: "f1d6v5y2",
+    b661bw: "f1565b9n",
+    Bk6r4ia: ["fm07gvo", "fwlsg72"],
+    B9zn80p: "fzw6fmy",
+    Bpld233: ["fwlsg72", "fm07gvo"],
+    iro3zm: "fnp9lpt"
+  }
+}, {
+  d: [".f14es27b{min-width:96px;}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".f10s6wn9{background-color:var(--colorNeutralForegroundOnBrand);}", ".f1iimpp0{border-top-color:var(--colorTransparentBackground);}", ".f19uhqvu{border-right-color:var(--colorTransparentBackground);}", ".f1nx14hx{border-left-color:var(--colorTransparentBackground);}", ".fnqa90p{border-bottom-color:var(--colorTransparentBackground);}", ".f1phragk{color:var(--colorNeutralForegroundOnBrand);}", ".ffp7eso{background-color:var(--colorBrandBackground);}", ".fm1ebug{border-top-color:var(--colorNeutralForegroundOnBrand);}", ".f28omuz{border-right-color:var(--colorNeutralForegroundOnBrand);}", ".f1uhflii{border-left-color:var(--colorNeutralForegroundOnBrand);}", ".f1ixw5o4{border-bottom-color:var(--colorNeutralForegroundOnBrand);}"],
+  h: [".f3ymbdj:hover{color:var(--colorCompoundBrandForeground1Hover);}", ".f1rgtb95:hover{background-color:var(--colorNeutralForegroundOnBrand);}", ".f1pu27ff:hover:active{color:var(--colorCompoundBrandForeground1Pressed);}", ".f1d5c7in:hover:active{background-color:var(--colorNeutralForegroundOnBrand);}", ".f1rq72xc:hover{color:var(--colorNeutralForegroundOnBrand);}", ".f1bg5g8r:hover{border-top-color:var(--colorNeutralForegroundOnBrand);}", ".f1h9bnsk:hover{border-right-color:var(--colorNeutralForegroundOnBrand);}", ".f12x9t0k:hover{border-left-color:var(--colorNeutralForegroundOnBrand);}", ".f19ervry:hover{border-bottom-color:var(--colorNeutralForegroundOnBrand);}", ".f15wkkf3:hover{background-color:var(--colorBrandBackgroundHover);}", ".f1d6v5y2:hover:active{color:var(--colorNeutralForegroundOnBrand);}", ".f1565b9n:hover:active{border-top-color:var(--colorNeutralForegroundOnBrand);}", ".fm07gvo:hover:active{border-right-color:var(--colorNeutralForegroundOnBrand);}", ".fwlsg72:hover:active{border-left-color:var(--colorNeutralForegroundOnBrand);}", ".fzw6fmy:hover:active{border-bottom-color:var(--colorNeutralForegroundOnBrand);}", ".fnp9lpt:hover:active{background-color:var(--colorBrandBackgroundPressed);}"]
+});
+/**
+ * Apply styling to the TeachingPopoverCarouselFooterButton slots based on the state
+ */
+export const useTeachingPopoverCarouselFooterButtonStyles_unstable = state => {
+  const styles = useStyles();
+  const {
+    navType,
+    popoverAppearance
+  } = state;
+  // Apply underlying fluent Button styles
+  state = {
+    ...state,
+    ...useButtonStyles_unstable(state)
+  };
+  state.root.className = mergeClasses(teachingPopoverCarouselFooterButtonClassNames.root, styles.root, navType === 'prev' && popoverAppearance === 'brand' && styles.brandPrevious, navType === 'next' && popoverAppearance === 'brand' && styles.brandNext, state.root.className);
+  return state;
+};
+//# sourceMappingURL=useTeachingPopoverCarouselFooterButtonStyles.styles.js.map

package/lib/components/TeachingPopoverCarouselFooterButton/useTeachingPopoverCarouselFooterButtonStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","useButtonStyles_unstable","teachingPopoverCarouselFooterButtonClassNames","root","useStyles","Bf4jedk","brandNext","sj55zd","De3pzq","g2u3we","h3c5rm","B9xav0g","zhjwy3","Bi91k9c","Jwef8y","B2d53fq","iro3zm","brandPrevious","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","b661bw","Bk6r4ia","B9zn80p","Bpld233","d","h","useTeachingPopoverCarouselFooterButtonStyles_unstable","state","styles","navType","popoverAppearance","className"],"sources":["useTeachingPopoverCarouselFooterButtonStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nexport const teachingPopoverCarouselFooterButtonClassNames = {\n    root: 'fui-TeachingPopoverCarouselFooterButton'\n};\nconst useStyles = makeStyles({\n    root: {\n        minWidth: '96px'\n    },\n    brandNext: {\n        color: tokens.colorBrandForeground1,\n        backgroundColor: tokens.colorNeutralForegroundOnBrand,\n        ...shorthands.borderColor(tokens.colorTransparentBackground),\n        ':hover': {\n            color: tokens.colorCompoundBrandForeground1Hover,\n            backgroundColor: tokens.colorNeutralForegroundOnBrand\n        },\n        ':hover:active': {\n            color: tokens.colorCompoundBrandForeground1Pressed,\n            backgroundColor: tokens.colorNeutralForegroundOnBrand\n        }\n    },\n    brandPrevious: {\n        // In brand, this is always 'NeutralForegroundOnBrand'\n        color: tokens.colorNeutralForegroundOnBrand,\n        backgroundColor: tokens.colorBrandBackground,\n        ...shorthands.borderColor(tokens.colorNeutralForegroundOnBrand),\n        ':hover': {\n            color: tokens.colorNeutralForegroundOnBrand,\n            ...shorthands.borderColor(tokens.colorNeutralForegroundOnBrand),\n            backgroundColor: tokens.colorBrandBackgroundHover\n        },\n        ':hover:active': {\n            color: tokens.colorNeutralForegroundOnBrand,\n            ...shorthands.borderColor(tokens.colorNeutralForegroundOnBrand),\n            backgroundColor: tokens.colorBrandBackgroundPressed\n        }\n    }\n});\n/**\n * Apply styling to the TeachingPopoverCarouselFooterButton slots based on the state\n */ export const useTeachingPopoverCarouselFooterButtonStyles_unstable = (state)=>{\n    const styles = useStyles();\n    const { navType, popoverAppearance } = state;\n    // Apply underlying fluent Button styles\n    state = {\n        ...state,\n        ...useButtonStyles_unstable(state)\n    };\n    state.root.className = mergeClasses(teachingPopoverCarouselFooterButtonClassNames.root, styles.root, navType === 'prev' && popoverAppearance === 'brand' && styles.brandPrevious, navType === 'next' && popoverAppearance === 'brand' && styles.brandNext, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,wBAAwB,QAAQ,wBAAwB;AACjE,OAAO,MAAMC,6CAA6C,GAAG;EACzDC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,OAAA;EAAA;EAAAC,SAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,aAAA;IAAAV,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAK,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAP,MAAA;IAAAC,OAAA;IAAAO,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAT,MAAA;EAAA;AAAA;EAAAU,CAAA;EAAAC,CAAA;AAAA,CAiCjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,qDAAqD,GAAIC,KAAK,IAAG;EAC9E,MAAMC,MAAM,GAAG1B,SAAS,CAAC,CAAC;EAC1B,MAAM;IAAE2B,OAAO;IAAEC;EAAkB,CAAC,GAAGH,KAAK;EAC5C;EACAA,KAAK,GAAG;IACJ,GAAGA,KAAK;IACR,GAAG5B,wBAAwB,CAAC4B,KAAK;EACrC,CAAC;EACDA,KAAK,CAAC1B,IAAI,CAAC8B,SAAS,GAAGnC,YAAY,CAACI,6CAA6C,CAACC,IAAI,EAAE2B,MAAM,CAAC3B,IAAI,EAAE4B,OAAO,KAAK,MAAM,IAAIC,iBAAiB,KAAK,OAAO,IAAIF,MAAM,CAACb,aAAa,EAAEc,OAAO,KAAK,MAAM,IAAIC,iBAAiB,KAAK,OAAO,IAAIF,MAAM,CAACxB,SAAS,EAAEuB,KAAK,CAAC1B,IAAI,CAAC8B,SAAS,CAAC;EAChR,OAAOJ,KAAK;AAChB,CAAC"}

package/lib/components/TeachingPopoverCarouselNav/TeachingPopoverCarouselNav.js

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { useTeachingPopoverCarouselNav_unstable } from './useTeachingPopoverCarouselNav';
+import { renderTeachingPopoverCarouselNav_unstable } from './renderTeachingPopoverCarouselNav';
+import { useTeachingPopoverCarouselNavStyles_unstable } from './useTeachingPopoverCarouselNavStyles.styles';
+/**
+ * Define a styled TeachingPopoverCarouselNav, using the `useTeachingPopoverCarouselNav_unstable` and `useTeachingPopoverCarouselNavStyles_unstable`
+ * hooks.
+ *
+ * TeachingPopoverCarouselNav provides an index-based pagination list to jump to any page within the carousel.
+ */ export const TeachingPopoverCarouselNav = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTeachingPopoverCarouselNav_unstable(props, ref);
+    useTeachingPopoverCarouselNavStyles_unstable(state);
+    return renderTeachingPopoverCarouselNav_unstable(state);
+});
+TeachingPopoverCarouselNav.displayName = 'TeachingPopoverCarouselNav';

package/lib/components/TeachingPopoverCarouselNav/TeachingPopoverCarouselNav.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TeachingPopoverCarouselNav.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTeachingPopoverCarouselNav_unstable } from './useTeachingPopoverCarouselNav';\nimport { renderTeachingPopoverCarouselNav_unstable } from './renderTeachingPopoverCarouselNav';\nimport { useTeachingPopoverCarouselNavStyles_unstable } from './useTeachingPopoverCarouselNavStyles.styles';\nimport type { TeachingPopoverCarouselNavProps } from './TeachingPopoverCarouselNav.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled TeachingPopoverCarouselNav, using the `useTeachingPopoverCarouselNav_unstable` and `useTeachingPopoverCarouselNavStyles_unstable`\n * hooks.\n *\n * TeachingPopoverCarouselNav provides an index-based pagination list to jump to any page within the carousel.\n */\nexport const TeachingPopoverCarouselNav: ForwardRefComponent<TeachingPopoverCarouselNavProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useTeachingPopoverCarouselNav_unstable(props, ref);\n\n    useTeachingPopoverCarouselNavStyles_unstable(state);\n\n    return renderTeachingPopoverCarouselNav_unstable(state);\n  },\n);\n\nTeachingPopoverCarouselNav.displayName = 'TeachingPopoverCarouselNav';\n"],"names":["React","useTeachingPopoverCarouselNav_unstable","renderTeachingPopoverCarouselNav_unstable","useTeachingPopoverCarouselNavStyles_unstable","TeachingPopoverCarouselNav","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sCAAsC,QAAQ,kCAAkC;AACzF,SAASC,yCAAyC,QAAQ,qCAAqC;AAC/F,SAASC,4CAA4C,QAAQ,+CAA+C;AAI5G;;;;;CAKC,GACD,OAAO,MAAMC,2CAAmFJ,MAAMK,UAAU,CAC9G,CAACC,OAAOC;IACN,MAAMC,QAAQP,uCAAuCK,OAAOC;IAE5DJ,6CAA6CK;IAE7C,OAAON,0CAA0CM;AACnD,GACA;AAEFJ,2BAA2BK,WAAW,GAAG"}

package/lib/components/TeachingPopoverCarouselNav/TeachingPopoverCarouselNav.types.js

@@ -0,0 +1 @@
+import * as React from 'react';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["TeachingPopoverCarouselNav.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TeachingPopoverCarouselNavSlots = {\n  /**\n   * The element wrapping the carousel pagination. By default this is a div,\n   * it may contain icons or text depending on TeachingPopoverCarouselNavStyle\n   */\n  root: NonNullable<Slot<'div'>>;\n};\n\nexport type NavButtonRenderFunction = (value: string) => React.ReactNode;\n\nexport type TeachingPopoverCarouselNavState = ComponentState<TeachingPopoverCarouselNavSlots> & {\n  values: string[];\n\n  renderNavButton: NavButtonRenderFunction;\n};\n\nexport type TeachingPopoverCarouselNavProps = Omit<\n  ComponentProps<Partial<TeachingPopoverCarouselNavSlots>>,\n  'children'\n> & {\n  children: NavButtonRenderFunction;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/lib/components/TeachingPopoverCarouselNav/index.js

@@ -0,0 +1,5 @@
+export * from './TeachingPopoverCarouselNav';
+export * from './TeachingPopoverCarouselNav.types';
+export * from './renderTeachingPopoverCarouselNav';
+export * from './useTeachingPopoverCarouselNav';
+export * from './useTeachingPopoverCarouselNavStyles.styles';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TeachingPopoverCarouselNav';\nexport * from './TeachingPopoverCarouselNav.types';\nexport * from './renderTeachingPopoverCarouselNav';\nexport * from './useTeachingPopoverCarouselNav';\nexport * from './useTeachingPopoverCarouselNavStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,+BAA+B;AAC7C,cAAc,qCAAqC;AACnD,cAAc,qCAAqC;AACnD,cAAc,kCAAkC;AAChD,cAAc,+CAA+C"}

package/lib/components/TeachingPopoverCarouselNav/renderTeachingPopoverCarouselNav.js

@@ -0,0 +1,15 @@
+  import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-utilities';
+import { ValueIdContextProvider } from './valueIdContext';
+/**
+ * Render the final JSX of TeachingPopoverCarouselNav
+ */ export const renderTeachingPopoverCarouselNav_unstable = (state)=>{
+    assertSlots(state);
+    const { values, renderNavButton } = state;
+    return /*#__PURE__*/ _jsx(state.root, {
+        children: values.map((value)=>/*#__PURE__*/ _jsx(ValueIdContextProvider, {
+                value: value,
+                children: renderNavButton(value)
+            }, value))
+    });
+};

package/lib/components/TeachingPopoverCarouselNav/renderTeachingPopoverCarouselNav.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderTeachingPopoverCarouselNav.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport type { TeachingPopoverCarouselNavState } from './TeachingPopoverCarouselNav.types';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { TeachingPopoverCarouselNavSlots } from './TeachingPopoverCarouselNav.types';\nimport { ValueIdContextProvider } from './valueIdContext';\n\n/**\n * Render the final JSX of TeachingPopoverCarouselNav\n */\nexport const renderTeachingPopoverCarouselNav_unstable = (state: TeachingPopoverCarouselNavState) => {\n  assertSlots<TeachingPopoverCarouselNavSlots>(state);\n\n  const { values, renderNavButton } = state;\n\n  return (\n    <state.root>\n      {values.map(value => (\n        <ValueIdContextProvider value={value} key={value}>\n          {renderNavButton(value)}\n        </ValueIdContextProvider>\n      ))}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","ValueIdContextProvider","renderTeachingPopoverCarouselNav_unstable","state","values","renderNavButton","root","map","value"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,sBAAsB,QAAQ,mBAAmB;AAE1D;;CAEC,GACD,OAAO,MAAMC,4CAA4C,CAACC;IACxDH,YAA6CG;IAE7C,MAAM,EAAEC,MAAM,EAAEC,eAAe,EAAE,GAAGF;IAEpC,qBACE,KAACA,MAAMG,IAAI;kBACRF,OAAOG,GAAG,CAACC,CAAAA,sBACV,KAACP;gBAAuBO,OAAOA;0BAC5BH,gBAAgBG;eADwBA;;AAMnD,EAAE"}

package/lib/components/TeachingPopoverCarouselNav/useTeachingPopoverCarouselNav.js

@@ -0,0 +1,35 @@
+import { useArrowNavigationGroup } from '@fluentui/react-tabster';
+import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
+import * as React from 'react';
+import { useCarouselValues_unstable } from '../TeachingPopoverCarousel/Carousel/useCarouselValues';
+/**
+ * Returns the props and state required to render the component
+ * @param props - TeachingPopoverCarouselNav properties
+ * @param ref - reference to root HTMLElement of TeachingPopoverCarouselNav
+ */ export const useTeachingPopoverCarouselNav_unstable = (props, ref)=>{
+    const focusableGroupAttr = useArrowNavigationGroup({
+        circular: false,
+        axis: 'horizontal',
+        memorizeCurrent: false,
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        unstable_hasDefault: true
+    });
+    const values = useCarouselValues_unstable((snapshot)=>snapshot);
+    return {
+        values,
+        renderNavButton: props.children,
+        components: {
+            root: 'div'
+        },
+        root: slot.always(getIntrinsicElementProps('div', {
+            ref,
+            role: 'tablist',
+            tabIndex: 0,
+            ...props,
+            ...focusableGroupAttr,
+            children: null
+        }), {
+            elementType: 'div'
+        })
+    };
+};

package/lib/components/TeachingPopoverCarouselNav/useTeachingPopoverCarouselNav.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useTeachingPopoverCarouselNav.tsx"],"sourcesContent":["import { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type {\n  TeachingPopoverCarouselNavProps,\n  TeachingPopoverCarouselNavState,\n} from './TeachingPopoverCarouselNav.types';\nimport { useCarouselValues_unstable } from '../TeachingPopoverCarousel/Carousel/useCarouselValues';\n\n/**\n * Returns the props and state required to render the component\n * @param props - TeachingPopoverCarouselNav properties\n * @param ref - reference to root HTMLElement of TeachingPopoverCarouselNav\n */\nexport const useTeachingPopoverCarouselNav_unstable = (\n  props: TeachingPopoverCarouselNavProps,\n  ref: React.Ref<HTMLDivElement>,\n): TeachingPopoverCarouselNavState => {\n  const focusableGroupAttr = useArrowNavigationGroup({\n    circular: false,\n    axis: 'horizontal',\n    memorizeCurrent: false,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    unstable_hasDefault: true,\n  });\n  const values = useCarouselValues_unstable(snapshot => snapshot);\n\n  return {\n    values,\n    renderNavButton: props.children,\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        role: 'tablist',\n        tabIndex: 0,\n        ...props,\n        ...focusableGroupAttr,\n        children: null,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n"],"names":["useArrowNavigationGroup","getIntrinsicElementProps","slot","React","useCarouselValues_unstable","useTeachingPopoverCarouselNav_unstable","props","ref","focusableGroupAttr","circular","axis","memorizeCurrent","unstable_hasDefault","values","snapshot","renderNavButton","children","components","root","always","role","tabIndex","elementType"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,YAAYC,WAAW,QAAQ;AAM/B,SAASC,0BAA0B,QAAQ,wDAAwD;AAEnG;;;;CAIC,GACD,OAAO,MAAMC,yCAAyC,CACpDC,OACAC;IAEA,MAAMC,qBAAqBR,wBAAwB;QACjDS,UAAU;QACVC,MAAM;QACNC,iBAAiB;QACjB,gEAAgE;QAChEC,qBAAqB;IACvB;IACA,MAAMC,SAAST,2BAA2BU,CAAAA,WAAYA;IAEtD,OAAO;QACLD;QACAE,iBAAiBT,MAAMU,QAAQ;QAC/BC,YAAY;YACVC,MAAM;QACR;QACAA,MAAMhB,KAAKiB,MAAM,CACflB,yBAAyB,OAAO;YAC9BM;YACAa,MAAM;YACNC,UAAU;YACV,GAAGf,KAAK;YACR,GAAGE,kBAAkB;YACrBQ,UAAU;QACZ,IACA;YAAEM,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib/components/TeachingPopoverCarouselNav/useTeachingPopoverCarouselNavStyles.styles.js

@@ -0,0 +1,35 @@
+import { __styles, mergeClasses, shorthands } from '@griffel/react';
+import { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';
+import { tokens } from '@fluentui/react-theme';
+export const teachingPopoverCarouselNavClassNames = {
+  root: 'fui-TeachingPopoverCarouselNav'
+};
+const useStyles = /*#__PURE__*/__styles({
+  root: {
+    mc9l5x: "f22iagw",
+    Beiy3e4: "f1063pyq",
+    i8kkvl: "f1ufnopg",
+    Bt984gj: "f122n59",
+    Brf1p80: "f4d9j23",
+    Bn4voq9: "f1p7hgxw",
+    g9k6zt: "f9znhxp",
+    Bfpq7zp: "fqrak0z",
+    kdpuga: ["f1o2ludy", "f1kjnpwc"],
+    Bw81rd7: ["f1kjnpwc", "f1o2ludy"],
+    B6xbmo0: ["fxmnebo", "f1witrsb"],
+    dm238s: ["f1witrsb", "fxmnebo"],
+    B8q5s1w: "f8hki3x",
+    Bci5o5g: ["f1d2448m", "ffh67wi"],
+    n8qw10: "f1bjia2o",
+    Bdrgwmp: ["ffh67wi", "f1d2448m"]
+  }
+}, {
+  d: [".f22iagw{display:flex;}", ".f1063pyq{flex-direction:row;}", ".f1ufnopg{column-gap:var(--spacingHorizontalXS);}", ".f122n59{align-items:center;}", ".f4d9j23{justify-content:center;}", ".f1p7hgxw[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);}", ".f9znhxp[data-fui-focus-visible]{outline-style:solid;}", ".fqrak0z[data-fui-focus-visible]{outline-color:var(--colorStrokeFocus2);}", ".f1o2ludy[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}", ".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}", ".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}", ".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;}"]
+});
+/** Applies style classnames to slots */
+export const useTeachingPopoverCarouselNavStyles_unstable = state => {
+  const styles = useStyles();
+  state.root.className = mergeClasses(teachingPopoverCarouselNavClassNames.root, styles.root, state.root.className);
+  return state;
+};
+//# sourceMappingURL=useTeachingPopoverCarouselNavStyles.styles.js.map

package/lib/components/TeachingPopoverCarouselNav/useTeachingPopoverCarouselNavStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","shorthands","createCustomFocusIndicatorStyle","tokens","teachingPopoverCarouselNavClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Bt984gj","Brf1p80","Bn4voq9","g9k6zt","Bfpq7zp","kdpuga","Bw81rd7","B6xbmo0","dm238s","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","d","useTeachingPopoverCarouselNavStyles_unstable","state","styles","className"],"sources":["useTeachingPopoverCarouselNavStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const teachingPopoverCarouselNavClassNames = {\n    root: 'fui-TeachingPopoverCarouselNav'\n};\nconst useStyles = makeStyles({\n    root: {\n        display: 'flex',\n        flexDirection: 'row',\n        columnGap: tokens.spacingHorizontalXS,\n        alignItems: 'center',\n        justifyContent: 'center',\n        ...createCustomFocusIndicatorStyle({\n            ...shorthands.outline(tokens.strokeWidthThick, 'solid', tokens.colorStrokeFocus2),\n            ...shorthands.borderRadius(tokens.borderRadiusMedium),\n            ...shorthands.borderColor('transparent')\n        })\n    }\n});\n/** Applies style classnames to slots */ export const useTeachingPopoverCarouselNavStyles_unstable = (state)=>{\n    const styles = useStyles();\n    state.root.className = mergeClasses(teachingPopoverCarouselNavClassNames.root, styles.root, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,oCAAoC,GAAG;EAChDC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGP,QAAA;EAAAM,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAajB,CAAC;AACF;AAAyC,OAAO,MAAMC,4CAA4C,GAAIC,KAAK,IAAG;EAC1G,MAAMC,MAAM,GAAGpB,SAAS,CAAC,CAAC;EAC1BmB,KAAK,CAACpB,IAAI,CAACsB,SAAS,GAAG3B,YAAY,CAACI,oCAAoC,CAACC,IAAI,EAAEqB,MAAM,CAACrB,IAAI,EAAEoB,KAAK,CAACpB,IAAI,CAACsB,SAAS,CAAC;EACjH,OAAOF,KAAK;AAChB,CAAC"}

package/lib/components/TeachingPopoverCarouselNav/valueIdContext.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+const valueIdContext = React.createContext(undefined);
+export const valueIdContextDefaultValue = '';
+export const useValueIdContext = ()=>{
+    var _React_useContext;
+    return (_React_useContext = React.useContext(valueIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : valueIdContextDefaultValue;
+};
+export const ValueIdContextProvider = valueIdContext.Provider;

package/lib/components/TeachingPopoverCarouselNav/valueIdContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["valueIdContext.ts"],"sourcesContent":["import * as React from 'react';\n\nconst valueIdContext = React.createContext<string | undefined>(undefined);\n\nexport const valueIdContextDefaultValue = '';\n\nexport const useValueIdContext = () => React.useContext(valueIdContext) ?? valueIdContextDefaultValue;\n\nexport const ValueIdContextProvider = valueIdContext.Provider;\n"],"names":["React","valueIdContext","createContext","undefined","valueIdContextDefaultValue","useValueIdContext","useContext","ValueIdContextProvider","Provider"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,iBAAiBD,MAAME,aAAa,CAAqBC;AAE/D,OAAO,MAAMC,6BAA6B,GAAG;AAE7C,OAAO,MAAMC,oBAAoB;QAAML;WAAAA,CAAAA,oBAAAA,MAAMM,UAAU,CAACL,6BAAjBD,+BAAAA,oBAAoCI;AAAyB,EAAE;AAEtG,OAAO,MAAMG,yBAAyBN,eAAeO,QAAQ,CAAC"}

package/lib/components/TeachingPopoverCarouselNavButton/TeachingPopoverCarouselNavButton.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { useTeachingPopoverCarouselNavButton_unstable } from './useTeachingPopoverCarouselNavButton';
+import { renderTeachingPopoverCarouselNavButton_unstable } from './renderTeachingPopoverCarouselNavButton';
+import { useTeachingPopoverCarouselNavButtonStyles_unstable } from './useTeachingPopoverCarouselNavButtonStyles.styles';
+/**
+ * TeachingPopoverCarouselNavButton is a button to jump to a single page within TeachingPopoverCarousel
+ *
+ * It's value is injected via context and must be wrapped with a ValueIdContextProvider (automatically handled via TeachingPopoverCarouselNav)
+ */ export const TeachingPopoverCarouselNavButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useTeachingPopoverCarouselNavButton_unstable(props, ref);
+    useTeachingPopoverCarouselNavButtonStyles_unstable(state);
+    return renderTeachingPopoverCarouselNavButton_unstable(state);
+});
+TeachingPopoverCarouselNavButton.displayName = 'TeachingPopoverCarouselNavButton';

package/lib/components/TeachingPopoverCarouselNavButton/TeachingPopoverCarouselNavButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["TeachingPopoverCarouselNavButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTeachingPopoverCarouselNavButton_unstable } from './useTeachingPopoverCarouselNavButton';\nimport { renderTeachingPopoverCarouselNavButton_unstable } from './renderTeachingPopoverCarouselNavButton';\nimport { useTeachingPopoverCarouselNavButtonStyles_unstable } from './useTeachingPopoverCarouselNavButtonStyles.styles';\nimport type { TeachingPopoverCarouselNavButtonProps } from './TeachingPopoverCarouselNavButton.types';\n\n/**\n * TeachingPopoverCarouselNavButton is a button to jump to a single page within TeachingPopoverCarousel\n *\n * It's value is injected via context and must be wrapped with a ValueIdContextProvider (automatically handled via TeachingPopoverCarouselNav)\n */\nexport const TeachingPopoverCarouselNavButton: ForwardRefComponent<TeachingPopoverCarouselNavButtonProps> =\n  React.forwardRef((props, ref) => {\n    const state = useTeachingPopoverCarouselNavButton_unstable(props, ref);\n\n    useTeachingPopoverCarouselNavButtonStyles_unstable(state);\n\n    return renderTeachingPopoverCarouselNavButton_unstable(state);\n  }) as ForwardRefComponent<TeachingPopoverCarouselNavButtonProps>;\n\nTeachingPopoverCarouselNavButton.displayName = 'TeachingPopoverCarouselNavButton';\n"],"names":["React","useTeachingPopoverCarouselNavButton_unstable","renderTeachingPopoverCarouselNavButton_unstable","useTeachingPopoverCarouselNavButtonStyles_unstable","TeachingPopoverCarouselNavButton","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,4CAA4C,QAAQ,wCAAwC;AACrG,SAASC,+CAA+C,QAAQ,2CAA2C;AAC3G,SAASC,kDAAkD,QAAQ,qDAAqD;AAGxH;;;;CAIC,GACD,OAAO,MAAMC,iDACXJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACvB,MAAMC,QAAQP,6CAA6CK,OAAOC;IAElEJ,mDAAmDK;IAEnD,OAAON,gDAAgDM;AACzD,GAAiE;AAEnEJ,iCAAiCK,WAAW,GAAG"}

package/lib/components/TeachingPopoverCarouselNavButton/TeachingPopoverCarouselNavButton.types.js

@@ -0,0 +1 @@
+export { };

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

@@ -0,0 +1 @@
+{"version":3,"sources":["TeachingPopoverCarouselNavButton.types.ts"],"sourcesContent":["import { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport { PopoverContextValue } from '@fluentui/react-popover';\nimport type { ComponentState, ComponentProps, Slot } from '@fluentui/react-utilities';\n\nexport type TeachingPopoverCarouselNavButtonSlots = {\n  /**\n   * ARIA compliant nav buttons used to jump to pages\n   */\n  root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;\n};\n\n/**\n * TeachingPopoverCarouselNavButton Props\n */\nexport type TeachingPopoverCarouselNavButtonProps = ComponentProps<TeachingPopoverCarouselNavButtonSlots>;\n\n/**\n * TeachingPopoverCarouselNavButton State\n */\nexport type TeachingPopoverCarouselNavButtonState = ComponentState<TeachingPopoverCarouselNavButtonSlots> & {\n  /**\n   * Enables selection state control\n   */\n  isSelected?: boolean;\n} & Pick<PopoverContextValue, 'appearance'>;\n"],"names":[],"mappings":"AAAA,WAwB4C"}

package/lib/components/TeachingPopoverCarouselNavButton/index.js

@@ -0,0 +1,5 @@
+export * from './TeachingPopoverCarouselNavButton';
+export * from './TeachingPopoverCarouselNavButton.types';
+export * from './renderTeachingPopoverCarouselNavButton';
+export * from './useTeachingPopoverCarouselNavButton';
+export * from './useTeachingPopoverCarouselNavButtonStyles.styles';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TeachingPopoverCarouselNavButton';\nexport * from './TeachingPopoverCarouselNavButton.types';\nexport * from './renderTeachingPopoverCarouselNavButton';\nexport * from './useTeachingPopoverCarouselNavButton';\nexport * from './useTeachingPopoverCarouselNavButtonStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,qCAAqC;AACnD,cAAc,2CAA2C;AACzD,cAAc,2CAA2C;AACzD,cAAc,wCAAwC;AACtD,cAAc,qDAAqD"}

package/lib/components/TeachingPopoverCarouselNavButton/renderTeachingPopoverCarouselNavButton.js

@@ -0,0 +1,8 @@
+  import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-utilities';
+/**
+ * Render the final JSX of TeachingPopoverCarouselNavButton
+ */ export const renderTeachingPopoverCarouselNavButton_unstable = (state)=>{
+    assertSlots(state);
+    return /*#__PURE__*/ _jsx(state.root, {});
+};

package/lib/components/TeachingPopoverCarouselNavButton/renderTeachingPopoverCarouselNavButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderTeachingPopoverCarouselNavButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type {\n  TeachingPopoverCarouselNavButtonState,\n  TeachingPopoverCarouselNavButtonSlots,\n} from './TeachingPopoverCarouselNavButton.types';\n\n/**\n * Render the final JSX of TeachingPopoverCarouselNavButton\n */\nexport const renderTeachingPopoverCarouselNavButton_unstable = (state: TeachingPopoverCarouselNavButtonState) => {\n  assertSlots<TeachingPopoverCarouselNavButtonSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderTeachingPopoverCarouselNavButton_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAMxD;;CAEC,GACD,OAAO,MAAMC,kDAAkD,CAACC;IAC9DF,YAAmDE;IAEnD,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/TeachingPopoverCarouselNavButton/useTeachingPopoverCarouselNavButton.js

@@ -0,0 +1,52 @@
+import * as React from 'react';
+import { useARIAButtonProps } from '@fluentui/react-aria';
+import { usePopoverContext_unstable } from '@fluentui/react-popover';
+import { useTabsterAttributes } from '@fluentui/react-tabster';
+import { getIntrinsicElementProps, isHTMLElement, slot, useEventCallback } from '@fluentui/react-utilities';
+import { useCarouselContext_unstable } from '../TeachingPopoverCarousel/Carousel/CarouselContext';
+import { useValueIdContext } from '../TeachingPopoverCarouselNav/valueIdContext';
+/**
+ * Create the state required to render TeachingPopoverCarouselNavButton.
+ *
+ * The returned state can be modified with hooks such as useTeachingPopoverCarouselNavButtonStyles_unstable,
+ * before being passed to renderTeachingPopoverCarouselNavButton_unstable.
+ *
+ * @param props - props from this instance of TeachingPopoverCarouselNavButton
+ * @param ref - reference to root HTMLElement of TeachingPopoverCarouselNavButton
+ */ export const useTeachingPopoverCarouselNavButton_unstable = (props, ref)=>{
+    const { onClick, as = 'a' } = props;
+    const value = useValueIdContext();
+    const appearance = usePopoverContext_unstable((context)=>context.appearance);
+    const selectPageByValue = useCarouselContext_unstable((c)=>c.selectPageByValue);
+    const isSelected = useCarouselContext_unstable((c)=>c.value === value);
+    const handleClick = useEventCallback((event)=>{
+        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        if (!event.defaultPrevented && isHTMLElement(event.target)) {
+            selectPageByValue(event, value);
+        }
+    });
+    const defaultTabProps = useTabsterAttributes({
+        focusable: {
+            isDefault: isSelected
+        }
+    });
+    const _carouselButton = slot.always(getIntrinsicElementProps(as, useARIAButtonProps(props.as, props)), {
+        elementType: 'button',
+        defaultProps: {
+            ref: ref,
+            role: 'tab',
+            type: 'button',
+            ...defaultTabProps
+        }
+    });
+    _carouselButton.onClick = handleClick;
+    const state = {
+        isSelected,
+        appearance,
+        components: {
+            root: 'button'
+        },
+        root: _carouselButton
+    };
+    return state;
+};

package/lib/components/TeachingPopoverCarouselNavButton/useTeachingPopoverCarouselNavButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useTeachingPopoverCarouselNavButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ARIAButtonSlotProps, useARIAButtonProps } from '@fluentui/react-aria';\nimport { usePopoverContext_unstable } from '@fluentui/react-popover';\nimport { useTabsterAttributes } from '@fluentui/react-tabster';\nimport { getIntrinsicElementProps, isHTMLElement, slot, useEventCallback } from '@fluentui/react-utilities';\n\nimport type {\n  TeachingPopoverCarouselNavButtonProps,\n  TeachingPopoverCarouselNavButtonState,\n} from './TeachingPopoverCarouselNavButton.types';\nimport { useCarouselContext_unstable } from '../TeachingPopoverCarousel/Carousel/CarouselContext';\nimport { useValueIdContext } from '../TeachingPopoverCarouselNav/valueIdContext';\n\n/**\n * Create the state required to render TeachingPopoverCarouselNavButton.\n *\n * The returned state can be modified with hooks such as useTeachingPopoverCarouselNavButtonStyles_unstable,\n * before being passed to renderTeachingPopoverCarouselNavButton_unstable.\n *\n * @param props - props from this instance of TeachingPopoverCarouselNavButton\n * @param ref - reference to root HTMLElement of TeachingPopoverCarouselNavButton\n */\nexport const useTeachingPopoverCarouselNavButton_unstable = (\n  props: TeachingPopoverCarouselNavButtonProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): TeachingPopoverCarouselNavButtonState => {\n  const { onClick, as = 'a' } = props;\n\n  const value = useValueIdContext();\n\n  const appearance = usePopoverContext_unstable(context => context.appearance);\n  const selectPageByValue = useCarouselContext_unstable(c => c.selectPageByValue);\n  const isSelected = useCarouselContext_unstable(c => c.value === value);\n\n  const handleClick: ARIAButtonSlotProps<'a'>['onClick'] = useEventCallback(event => {\n    onClick?.(event);\n\n    if (!event.defaultPrevented && isHTMLElement(event.target)) {\n      selectPageByValue(event, value);\n    }\n  });\n\n  const defaultTabProps = useTabsterAttributes({\n    focusable: { isDefault: isSelected },\n  });\n\n  const _carouselButton = slot.always<ARIAButtonSlotProps<'a'>>(\n    getIntrinsicElementProps(as, useARIAButtonProps(props.as, props)),\n    {\n      elementType: 'button',\n      defaultProps: {\n        ref: ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>,\n        role: 'tab',\n        type: 'button',\n        ...defaultTabProps,\n      },\n    },\n  );\n\n  _carouselButton.onClick = handleClick;\n\n  const state: TeachingPopoverCarouselNavButtonState = {\n    isSelected,\n    appearance,\n    components: {\n      root: 'button',\n    },\n    root: _carouselButton,\n  };\n\n  return state;\n};\n"],"names":["React","useARIAButtonProps","usePopoverContext_unstable","useTabsterAttributes","getIntrinsicElementProps","isHTMLElement","slot","useEventCallback","useCarouselContext_unstable","useValueIdContext","useTeachingPopoverCarouselNavButton_unstable","props","ref","onClick","as","value","appearance","context","selectPageByValue","c","isSelected","handleClick","event","defaultPrevented","target","defaultTabProps","focusable","isDefault","_carouselButton","always","elementType","defaultProps","role","type","state","components","root"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAA8BC,kBAAkB,QAAQ,uBAAuB;AAC/E,SAASC,0BAA0B,QAAQ,0BAA0B;AACrE,SAASC,oBAAoB,QAAQ,0BAA0B;AAC/D,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,IAAI,EAAEC,gBAAgB,QAAQ,4BAA4B;AAM5G,SAASC,2BAA2B,QAAQ,sDAAsD;AAClG,SAASC,iBAAiB,QAAQ,+CAA+C;AAEjF;;;;;;;;CAQC,GACD,OAAO,MAAMC,+CAA+C,CAC1DC,OACAC;IAEA,MAAM,EAAEC,OAAO,EAAEC,KAAK,GAAG,EAAE,GAAGH;IAE9B,MAAMI,QAAQN;IAEd,MAAMO,aAAad,2BAA2Be,CAAAA,UAAWA,QAAQD,UAAU;IAC3E,MAAME,oBAAoBV,4BAA4BW,CAAAA,IAAKA,EAAED,iBAAiB;IAC9E,MAAME,aAAaZ,4BAA4BW,CAAAA,IAAKA,EAAEJ,KAAK,KAAKA;IAEhE,MAAMM,cAAmDd,iBAAiBe,CAAAA;QACxET,oBAAAA,8BAAAA,QAAUS;QAEV,IAAI,CAACA,MAAMC,gBAAgB,IAAIlB,cAAciB,MAAME,MAAM,GAAG;YAC1DN,kBAAkBI,OAAOP;QAC3B;IACF;IAEA,MAAMU,kBAAkBtB,qBAAqB;QAC3CuB,WAAW;YAAEC,WAAWP;QAAW;IACrC;IAEA,MAAMQ,kBAAkBtB,KAAKuB,MAAM,CACjCzB,yBAAyBU,IAAIb,mBAAmBU,MAAMG,EAAE,EAAEH,SAC1D;QACEmB,aAAa;QACbC,cAAc;YACZnB,KAAKA;YACLoB,MAAM;YACNC,MAAM;YACN,GAAGR,eAAe;QACpB;IACF;IAGFG,gBAAgBf,OAAO,GAAGQ;IAE1B,MAAMa,QAA+C;QACnDd;QACAJ;QACAmB,YAAY;YACVC,MAAM;QACR;QACAA,MAAMR;IACR;IAEA,OAAOM;AACT,EAAE"}