@fluentui/react-migration-v0-v9 9.2.0 → 9.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +27 -2
- package/lib/components/Attachment/Attachment.js.map +1 -1
- package/lib/components/Attachment/AttachmentAction.js.map +1 -1
- package/lib/components/Attachment/AttachmentBody.js.map +1 -1
- package/lib/components/Attachment/AttachmentDescription.js.map +1 -1
- package/lib/components/Attachment/AttachmentHeader.js.map +1 -1
- package/lib/components/Attachment/AttachmentIcon.js.map +1 -1
- package/lib/components/Attachment/index.js.map +1 -1
- package/lib/components/Button/ButtonMigration.mixins.js.map +1 -1
- package/lib/components/Button/index.js.map +1 -1
- package/lib/components/Flex/Flex.js.map +1 -1
- package/lib/components/Flex/FlexItem.mixins.js.map +1 -1
- package/lib/components/Flex/index.js.map +1 -1
- package/lib/components/FormField/FormFieldShim.js.map +1 -1
- package/lib/components/FormField/index.js.map +1 -1
- package/lib/components/Grid/Grid.mixins.js.map +1 -1
- package/lib/components/Grid/GridShim.js.map +1 -1
- package/lib/components/Grid/index.js.map +1 -1
- package/lib/components/Input/Input.mixins.js.map +1 -1
- package/lib/components/Input/index.js.map +1 -1
- package/lib/components/ItemLayout/ItemLayout.js.map +1 -1
- package/lib/components/ItemLayout/index.js.map +1 -1
- package/lib/components/List/List/List.js.map +1 -1
- package/lib/components/List/List/List.types.js.map +1 -1
- package/lib/components/List/List/index.js.map +1 -1
- package/lib/components/List/List/listContext.js.map +1 -1
- package/lib/components/List/List/renderList.js.map +1 -1
- package/lib/components/List/List/useList.js.map +1 -1
- package/lib/components/List/List/useListContextValues.js.map +1 -1
- package/lib/components/List/ListItem/ListItem.js.map +1 -1
- package/lib/components/List/ListItem/ListItem.types.js.map +1 -1
- package/lib/components/List/ListItem/index.js.map +1 -1
- package/lib/components/List/ListItem/renderListItem.js.map +1 -1
- package/lib/components/List/ListItem/useListItem.js +10 -4
- package/lib/components/List/ListItem/useListItem.js.map +1 -1
- package/lib/components/List/hooks/index.js.map +1 -1
- package/lib/components/List/hooks/types.js.map +1 -1
- package/lib/components/List/hooks/useListSelection.js.map +1 -1
- package/lib/components/List/index.js.map +1 -1
- package/lib/components/Primitive/Primitive.js.map +1 -1
- package/lib/components/Primitive/index.js.map +1 -1
- package/lib/components/Segment/Segment.js.map +1 -1
- package/lib/components/Segment/index.js.map +1 -1
- package/lib/components/Slider/Slider.mixins.js.map +1 -1
- package/lib/components/Slider/index.js.map +1 -1
- package/lib/components/Spinner/SpinnerMigration.mixins.js.map +1 -1
- package/lib/components/Spinner/index.js.map +1 -1
- package/lib/components/StyledText/StyledText.js.map +1 -1
- package/lib/components/StyledText/index.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Attachment/Attachment.js +5 -5
- package/lib-commonjs/components/Attachment/Attachment.js.map +1 -1
- package/lib-commonjs/components/Attachment/Attachment.styles.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentAction.js +3 -3
- package/lib-commonjs/components/Attachment/AttachmentAction.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentAction.styles.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentBody.js +3 -3
- package/lib-commonjs/components/Attachment/AttachmentBody.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentBody.styles.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentDescription.js +3 -3
- package/lib-commonjs/components/Attachment/AttachmentDescription.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentDescription.styles.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentHeader.js +3 -3
- package/lib-commonjs/components/Attachment/AttachmentHeader.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentHeader.styles.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentIcon.js +3 -3
- package/lib-commonjs/components/Attachment/AttachmentIcon.js.map +1 -1
- package/lib-commonjs/components/Attachment/AttachmentIcon.styles.js.map +1 -1
- package/lib-commonjs/components/Attachment/index.js.map +1 -1
- package/lib-commonjs/components/Button/ButtonMigration.mixins.js +8 -8
- package/lib-commonjs/components/Button/ButtonMigration.mixins.js.map +1 -1
- package/lib-commonjs/components/Button/index.js.map +1 -1
- package/lib-commonjs/components/Flex/Flex.js +3 -3
- package/lib-commonjs/components/Flex/Flex.js.map +1 -1
- package/lib-commonjs/components/Flex/Flex.styles.js.map +1 -1
- package/lib-commonjs/components/Flex/FlexItem.mixins.js.map +1 -1
- package/lib-commonjs/components/Flex/index.js +3 -3
- package/lib-commonjs/components/Flex/index.js.map +1 -1
- package/lib-commonjs/components/FormField/FormFieldShim.js.map +1 -1
- package/lib-commonjs/components/FormField/index.js.map +1 -1
- package/lib-commonjs/components/Grid/Grid.mixins.js.map +1 -1
- package/lib-commonjs/components/Grid/Grid.styles.js.map +1 -1
- package/lib-commonjs/components/Grid/GridShim.js +3 -3
- package/lib-commonjs/components/Grid/GridShim.js.map +1 -1
- package/lib-commonjs/components/Grid/index.js +3 -3
- package/lib-commonjs/components/Grid/index.js.map +1 -1
- package/lib-commonjs/components/Input/Input.mixins.js.map +1 -1
- package/lib-commonjs/components/Input/index.js.map +1 -1
- package/lib-commonjs/components/ItemLayout/ItemLayout.js +3 -3
- package/lib-commonjs/components/ItemLayout/ItemLayout.js.map +1 -1
- package/lib-commonjs/components/ItemLayout/ItemLayout.styles.js.map +1 -1
- package/lib-commonjs/components/ItemLayout/index.js.map +1 -1
- package/lib-commonjs/components/List/List/List.js.map +1 -1
- package/lib-commonjs/components/List/List/List.types.js.map +1 -1
- package/lib-commonjs/components/List/List/index.js.map +1 -1
- package/lib-commonjs/components/List/List/listContext.js +3 -3
- package/lib-commonjs/components/List/List/listContext.js.map +1 -1
- package/lib-commonjs/components/List/List/renderList.js.map +1 -1
- package/lib-commonjs/components/List/List/useList.js.map +1 -1
- package/lib-commonjs/components/List/List/useListContextValues.js.map +1 -1
- package/lib-commonjs/components/List/List/useListStyles.styles.js.map +1 -1
- package/lib-commonjs/components/List/ListItem/ListItem.js.map +1 -1
- package/lib-commonjs/components/List/ListItem/ListItem.types.js.map +1 -1
- package/lib-commonjs/components/List/ListItem/index.js.map +1 -1
- package/lib-commonjs/components/List/ListItem/renderListItem.js.map +1 -1
- package/lib-commonjs/components/List/ListItem/useListItem.js +10 -4
- package/lib-commonjs/components/List/ListItem/useListItem.js.map +1 -1
- package/lib-commonjs/components/List/ListItem/useListItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/List/hooks/index.js.map +1 -1
- package/lib-commonjs/components/List/hooks/types.js.map +1 -1
- package/lib-commonjs/components/List/hooks/useListSelection.js.map +1 -1
- package/lib-commonjs/components/List/index.js +12 -12
- package/lib-commonjs/components/List/index.js.map +1 -1
- package/lib-commonjs/components/Primitive/Primitive.js +3 -3
- package/lib-commonjs/components/Primitive/Primitive.js.map +1 -1
- package/lib-commonjs/components/Primitive/index.js.map +1 -1
- package/lib-commonjs/components/Segment/Segment.js +3 -3
- package/lib-commonjs/components/Segment/Segment.js.map +1 -1
- package/lib-commonjs/components/Segment/Segment.styles.js.map +1 -1
- package/lib-commonjs/components/Segment/index.js.map +1 -1
- package/lib-commonjs/components/Slider/Slider.mixins.js.map +1 -1
- package/lib-commonjs/components/Slider/index.js.map +1 -1
- package/lib-commonjs/components/Spinner/SpinnerMigration.mixins.js.map +1 -1
- package/lib-commonjs/components/Spinner/index.js.map +1 -1
- package/lib-commonjs/components/StyledText/StyledText.js +3 -3
- package/lib-commonjs/components/StyledText/StyledText.js.map +1 -1
- package/lib-commonjs/components/StyledText/StyledText.styles.js +3 -3
- package/lib-commonjs/components/StyledText/StyledText.styles.js.map +1 -1
- package/lib-commonjs/components/StyledText/index.js.map +1 -1
- package/lib-commonjs/index.js +85 -85
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +8 -8
|
@@ -59,12 +59,18 @@ const useListItem_unstable = (props, ref)=>{
|
|
|
59
59
|
}
|
|
60
60
|
toggleItem === null || toggleItem === void 0 ? void 0 : toggleItem(e, value);
|
|
61
61
|
});
|
|
62
|
-
//
|
|
63
|
-
|
|
64
|
-
|
|
62
|
+
// avoid passing empty onClick to prevent items unnecessary being narrated as clickable
|
|
63
|
+
// see https://github.com/microsoft/fluentui/issues/20658
|
|
64
|
+
const passClickHandler = !!onClick || isSelectionEnabled;
|
|
65
|
+
const clickHandlerProps = {
|
|
66
|
+
onClick: passClickHandler ? handleClick : undefined,
|
|
65
67
|
onKeyDown: onKeyDown,
|
|
66
68
|
onKeyUp: onKeyUp
|
|
67
|
-
}
|
|
69
|
+
};
|
|
70
|
+
// This will give us the onKeyDown and onKeyUp props for Enter and Space
|
|
71
|
+
const ariaButtonProps = (0, _reactaria.useARIAButtonProps)('div', clickHandlerProps);
|
|
72
|
+
// v0 ListItem adds keyboard handling only for navigable or selectable items
|
|
73
|
+
const buttonProps = navigable || isSelectionEnabled ? ariaButtonProps : clickHandlerProps;
|
|
68
74
|
const root = _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(DEFAULT_ROOT_EL_TYPE, {
|
|
69
75
|
ref: ref,
|
|
70
76
|
tabIndex: navigable || isSelectionEnabled ? 0 : undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useListItem.
|
|
1
|
+
{"version":3,"sources":["useListItem.tsx"],"sourcesContent":["import { useARIAButtonProps } from '@fluentui/react-aria';\nimport { getIntrinsicElementProps, slot, useEventCallback, useId } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useListContext_unstable } from '../List/listContext';\nimport type { ListItemProps, ListItemState } from './ListItem.types';\n\nconst DEFAULT_ROOT_EL_TYPE = 'li';\n\nfunction validateProperElementTypes(parentRenderedAs?: 'div' | 'ul' | 'ol', renderedAs?: 'div' | 'li') {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (renderedAs === 'div' && parentRenderedAs !== 'div') {\n throw new Error('ListItem cannot be rendered as a div when its parent is not a div.');\n }\n if (renderedAs === 'li' && parentRenderedAs === 'div') {\n throw new Error('ListItem cannot be rendered as a li when its parent is a div.');\n }\n}\n\nfunction validateNavigableWhenOnClickPresent(navigable: boolean, onClick?: React.MouseEventHandler) {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (onClick && !navigable) {\n throw new Error('ListItem must be navigable when onClick is present. Set navigable={true} on the List.');\n }\n}\n\n/**\n * Create the state required to render ListItem.\n *\n * The returned state can be modified with hooks such as useListItemStyles_unstable,\n * before being passed to renderListItem_unstable.\n *\n * @param props - props from this instance of ListItem\n * @param ref - reference to root HTMLLIElement | HTMLDivElementof ListItem\n */\nexport const useListItem_unstable = (\n props: ListItemProps,\n ref: React.Ref<HTMLLIElement | HTMLDivElement>,\n): ListItemState => {\n const id = useId('listItem');\n const { value = id, truncateHeader, truncateContent, onClick, onKeyDown, onKeyUp } = props;\n\n const navigable = useListContext_unstable(ctx => ctx.navigable);\n const toggleItem = useListContext_unstable(ctx => ctx.selection?.toggleItem);\n const isSelectionEnabled = useListContext_unstable(ctx => !!ctx.selection);\n const isSelected = useListContext_unstable(ctx => ctx.selection?.isSelected(value));\n\n const truncateHeaderOnList = useListContext_unstable(ctx => ctx.truncateHeader);\n const truncateContentOnList = useListContext_unstable(ctx => ctx.truncateContent);\n\n const parentRenderedAs = useListContext_unstable(ctx => ctx.as);\n const renderedAs = props.as || DEFAULT_ROOT_EL_TYPE;\n\n validateProperElementTypes(parentRenderedAs, renderedAs);\n\n validateNavigableWhenOnClickPresent(navigable, onClick);\n\n const handleClick: React.MouseEventHandler<HTMLLIElement & HTMLDivElement> = useEventCallback(e => {\n onClick?.(e);\n\n if (!isSelectionEnabled || e.defaultPrevented) {\n return;\n }\n\n toggleItem?.(e, value);\n });\n\n // avoid passing empty onClick to prevent items unnecessary being narrated as clickable\n // see https://github.com/microsoft/fluentui/issues/20658\n const passClickHandler = !!onClick || isSelectionEnabled;\n\n const clickHandlerProps = {\n onClick: passClickHandler ? handleClick : undefined,\n onKeyDown: onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n };\n\n // This will give us the onKeyDown and onKeyUp props for Enter and Space\n const ariaButtonProps = useARIAButtonProps('div', clickHandlerProps);\n\n // v0 ListItem adds keyboard handling only for navigable or selectable items\n const buttonProps = navigable || isSelectionEnabled ? ariaButtonProps : clickHandlerProps;\n\n const root = slot.always(\n getIntrinsicElementProps(DEFAULT_ROOT_EL_TYPE, {\n ref: ref as React.Ref<HTMLLIElement & HTMLDivElement>,\n tabIndex: navigable || isSelectionEnabled ? 0 : undefined,\n role: navigable ? 'menuitem' : 'listitem',\n id: String(value),\n ...(isSelectionEnabled && {\n role: 'option',\n 'aria-selected': isSelected,\n }),\n ...props,\n onKeyDown: buttonProps.onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: buttonProps.onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onClick: buttonProps.onClick as React.MouseEventHandler<HTMLLIElement & HTMLDivElement>,\n }),\n { elementType: DEFAULT_ROOT_EL_TYPE },\n );\n\n const state: ListItemState = {\n components: {\n root: DEFAULT_ROOT_EL_TYPE,\n media: 'div',\n header: 'div',\n contentWrapper: 'div',\n headerMedia: 'div',\n contentMedia: 'div',\n endMedia: 'div',\n },\n root,\n navigable,\n selectable: isSelectionEnabled,\n selected: isSelected,\n media: slot.optional(props.media, { elementType: 'div' }),\n header: slot.optional(props.header, { elementType: 'div' }),\n contentWrapper: slot.optional(props.contentWrapper, { elementType: 'div', renderByDefault: true }),\n headerMedia: slot.optional(props.headerMedia, { elementType: 'div' }),\n contentMedia: slot.optional(props.contentMedia, { elementType: 'div' }),\n endMedia: slot.optional(props.endMedia, { elementType: 'div' }),\n truncateHeader: truncateHeader ?? truncateHeaderOnList,\n truncateContent: truncateContent ?? truncateContentOnList,\n };\n\n return state;\n};\n"],"names":["useListItem_unstable","DEFAULT_ROOT_EL_TYPE","validateProperElementTypes","parentRenderedAs","renderedAs","process","env","NODE_ENV","Error","validateNavigableWhenOnClickPresent","navigable","onClick","props","ref","id","useId","value","truncateHeader","truncateContent","onKeyDown","onKeyUp","useListContext_unstable","ctx","toggleItem","selection","isSelectionEnabled","isSelected","truncateHeaderOnList","truncateContentOnList","as","handleClick","useEventCallback","e","defaultPrevented","passClickHandler","clickHandlerProps","undefined","ariaButtonProps","useARIAButtonProps","buttonProps","root","slot","always","getIntrinsicElementProps","tabIndex","role","String","elementType","state","components","media","header","contentWrapper","headerMedia","contentMedia","endMedia","selectable","selected","optional","renderByDefault"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useListItemStyles.styles.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"sources":["useListItemStyles.styles.js"],"sourcesContent":["import { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const listItemClassNames = {\n root: 'fui-ListItem',\n media: 'fui-ListItem__media',\n header: 'fui-ListItem__header',\n contentWrapper: 'fui-ListItem__contentWrapper',\n headerMedia: 'fui-ListItem__headerMedia',\n contentMedia: 'fui-ListItem__contentMedia',\n endMedia: 'fui-ListItem__endMedia'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: '0 10px',\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n contentWrapper: {\n fontSize: tokens.fontSizeBase200\n },\n // The content should go all the way to the end if the content media is not present\n contentWrapperWithoutMedia: {\n gridColumnEnd: 4\n },\n truncate: {\n overflow: 'hidden',\n textWrap: 'nowrap',\n textOverflow: 'ellipsis'\n },\n rootSelected: {\n backgroundColor: tokens.colorNeutralBackground1Selected\n },\n rootClickable: {\n cursor: 'pointer',\n '&:hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover\n }\n }\n});\n/**\n * Apply styling to the ListItem slots based on the state\n */ export const useListItemStyles_unstable = (state)=>{\n 'use no memo';\n const rootBaseStyles = useRootBaseStyles();\n const styles = useStyles();\n state.root.className = mergeClasses(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickable, state.selected && styles.rootSelected, state.root.className);\n if (state.header) {\n var _state_header;\n state.header.className = mergeClasses(state.truncateHeader && styles.truncate, (_state_header = state.header) === null || _state_header === void 0 ? void 0 : _state_header.className);\n }\n if (state.contentWrapper) {\n var _state_contentWrapper;\n state.contentWrapper.className = mergeClasses(styles.contentWrapper, state.truncateContent && styles.truncate, !state.contentMedia && styles.contentWrapperWithoutMedia, (_state_contentWrapper = state.contentWrapper) === null || _state_contentWrapper === void 0 ? void 0 : _state_contentWrapper.className);\n }\n return state;\n};\n"],"names":["listItemClassNames","useListItemStyles_unstable","root","media","header","contentWrapper","headerMedia","contentMedia","endMedia","useRootBaseStyles","__resetStyles","useStyles","__styles","Be2twd7","contentWrapperWithoutMedia","Bw0ie65","truncate","B68tc82","Bmxbyg5","Bpg54ce","j4b8c3","ygn44y","rootSelected","De3pzq","rootClickable","Bceei9c","Jwef8y","d","p","h","state","rootBaseStyles","styles","className","mergeClasses","selectable","navigable","selected","_state_header","truncateHeader","_state_contentWrapper","truncateContent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAGaA,kBAAkB;eAAlBA;;IAgDIC,0BAA0B;eAA1BA;;;uBAnDyC;AAGnD,MAAMD,qBAAqB;IAC9BE,MAAM;IACNC,OAAO;IACPC,QAAQ;IACRC,gBAAgB;IAChBC,aAAa;IACbC,cAAc;IACdC,UAAU;AACd;AACA,MAAMC,oBAAiB,WAAA,GAAGC,IAAAA,oBAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAWzB;AACD;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAP,gBAAA;QAAAQ,SAAA;IAAA;IAAAC,4BAAA;QAAAC,SAAA;IAAA;IAAAC,UAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;IAAA;IAAAC,cAAA;QAAAC,QAAA;IAAA;IAAAC,eAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,GAAA;QAAA;KAAA;AAAA;AAyBX,MAAM5B,6BAA8B6B,CAAAA;IAC3C;IACA,MAAMC,iBAAiBtB;IACvB,MAAMuB,SAASrB;IACfmB,MAAM5B,IAAI,CAAC+B,SAAS,GAAGC,IAAAA,mBAAY,EAAClC,mBAAmBE,IAAI,EAAE6B,gBAAgB,AAACD,CAAAA,MAAMK,UAAU,IAAIL,MAAMM,SAAS,AAATA,KAAcJ,OAAOR,aAAa,EAAEM,MAAMO,QAAQ,IAAIL,OAAOV,YAAY,EAAEQ,MAAM5B,IAAI,CAAC+B,SAAS;IACvM,IAAIH,MAAM1B,MAAM,EAAE;QACd,IAAIkC;QACJR,MAAM1B,MAAM,CAAC6B,SAAS,GAAGC,IAAAA,mBAAY,EAACJ,MAAMS,cAAc,IAAIP,OAAOhB,QAAQ,EAAE,AAACsB,CAAAA,gBAAgBR,MAAM1B,MAAM,AAANA,MAAY,QAAQkC,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcL,SAAS;IACzL;IACA,IAAIH,MAAMzB,cAAc,EAAE;QACtB,IAAImC;QACJV,MAAMzB,cAAc,CAAC4B,SAAS,GAAGC,IAAAA,mBAAY,EAACF,OAAO3B,cAAc,EAAEyB,MAAMW,eAAe,IAAIT,OAAOhB,QAAQ,EAAE,CAACc,MAAMvB,YAAY,IAAIyB,OAAOlB,0BAA0B,EAAE,AAAC0B,CAAAA,wBAAwBV,MAAMzB,cAAc,AAAdA,MAAoB,QAAQmC,0BAA0B,KAAK,IAAI,KAAK,IAAIA,sBAAsBP,SAAS;IACnT;IACA,OAAOH;AACX"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './useListSelection';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["types.
|
|
1
|
+
{"version":3,"sources":["types.ts"],"sourcesContent":["import { SelectionItemId } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nexport type ListSelectionState = {\n isSelected: (item: string | number) => boolean;\n toggleItem: (e: React.SyntheticEvent, id: string | number) => void;\n deselectItem: (e: React.SyntheticEvent, id: string | number) => void;\n selectItem: (e: React.SyntheticEvent, id: string | number) => void;\n clearSelection: (e: React.SyntheticEvent) => void;\n toggleAllItems: (e: React.SyntheticEvent, itemIds: string[] | number[]) => void;\n setSelectedItems: React.Dispatch<React.SetStateAction<Iterable<SelectionItemId>>>;\n selectedItems: SelectionItemId[];\n};\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEACuB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useListSelection.
|
|
1
|
+
{"version":3,"sources":["useListSelection.tsx"],"sourcesContent":["import { SelectionHookParams, useControllableState, useEventCallback, useSelection } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { ListSelectionState } from './types';\n\nexport function useListSelection(options: SelectionHookParams = { selectionMode: 'multiselect' }): ListSelectionState {\n const { selectionMode, defaultSelectedItems, onSelectionChange } = options;\n\n const [selectedItems, setSelectedItems] = useControllableState({\n state: options.selectedItems,\n defaultState: defaultSelectedItems,\n initialState: [],\n });\n\n const [selected, selectionMethods] = useSelection({\n selectionMode,\n defaultSelectedItems,\n selectedItems,\n onSelectionChange: (e, data) => {\n setSelectedItems(data.selectedItems);\n onSelectionChange?.(e, data);\n },\n });\n\n const toggleItem: ListSelectionState['toggleItem'] = useEventCallback((e, itemId) =>\n selectionMethods.toggleItem(e, itemId),\n );\n\n const toggleAllItems: ListSelectionState['toggleAllItems'] = useEventCallback((e, itemIds) => {\n selectionMethods.toggleAllItems(e, itemIds);\n });\n\n const deselectItem: ListSelectionState['deselectItem'] = useEventCallback((e, itemId: string | number) =>\n selectionMethods.deselectItem(e, itemId),\n );\n\n const selectItem: ListSelectionState['selectItem'] = useEventCallback((e, itemId: string | number) =>\n selectionMethods.selectItem(e, itemId),\n );\n\n const clearSelection: ListSelectionState['clearSelection'] = useEventCallback(e => selectionMethods.clearItems(e));\n\n const selectedArray = React.useMemo(() => Array.from(selected), [selected]);\n\n return {\n selectedItems: selectedArray,\n toggleItem,\n toggleAllItems,\n deselectItem,\n selectItem,\n setSelectedItems,\n isSelected: (id: string | number) => selectionMethods.isSelected(id),\n clearSelection,\n };\n}\n"],"names":["useListSelection","options","selectionMode","defaultSelectedItems","onSelectionChange","selectedItems","setSelectedItems","useControllableState","state","defaultState","initialState","selected","selectionMethods","useSelection","e","data","toggleItem","useEventCallback","itemId","toggleAllItems","itemIds","deselectItem","selectItem","clearSelection","clearItems","selectedArray","React","useMemo","Array","from","isSelected","id"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAIgBA;;;eAAAA;;;;gCAJ0E;iEACnE;AAGhB,SAASA,iBAAiBC,UAA+B;IAAEC,eAAe;AAAc,CAAC;IAC9F,MAAM,EAAEA,aAAa,EAAEC,oBAAoB,EAAEC,iBAAiB,EAAE,GAAGH;IAEnE,MAAM,CAACI,eAAeC,iBAAiB,GAAGC,IAAAA,oCAAAA,EAAqB;QAC7DC,OAAOP,QAAQI,aAAa;QAC5BI,cAAcN;QACdO,cAAc,EAAE;IAClB;IAEA,MAAM,CAACC,UAAUC,iBAAiB,GAAGC,IAAAA,4BAAAA,EAAa;QAChDX;QACAC;QACAE;QACAD,mBAAmB,CAACU,GAAGC;YACrBT,iBAAiBS,KAAKV,aAAa;YACnCD,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,kBAAoBU,GAAGC;QACzB;IACF;IAEA,MAAMC,aAA+CC,IAAAA,gCAAAA,EAAiB,CAACH,GAAGI,SACxEN,iBAAiBI,UAAU,CAACF,GAAGI;IAGjC,MAAMC,iBAAuDF,IAAAA,gCAAAA,EAAiB,CAACH,GAAGM;QAChFR,iBAAiBO,cAAc,CAACL,GAAGM;IACrC;IAEA,MAAMC,eAAmDJ,IAAAA,gCAAAA,EAAiB,CAACH,GAAGI,SAC5EN,iBAAiBS,YAAY,CAACP,GAAGI;IAGnC,MAAMI,aAA+CL,IAAAA,gCAAAA,EAAiB,CAACH,GAAGI,SACxEN,iBAAiBU,UAAU,CAACR,GAAGI;IAGjC,MAAMK,iBAAuDN,IAAAA,gCAAAA,EAAiBH,CAAAA,IAAKF,iBAAiBY,UAAU,CAACV;IAE/G,MAAMW,gBAAgBC,OAAMC,OAAO,CAAC,IAAMC,MAAMC,IAAI,CAAClB,WAAW;QAACA;KAAS;IAE1E,OAAO;QACLN,eAAeoB;QACfT;QACAG;QACAE;QACAC;QACAhB;QACAwB,YAAY,CAACC,KAAwBnB,iBAAiBkB,UAAU,CAACC;QACjER;IACF;AACF"}
|
|
@@ -12,27 +12,21 @@ _export(exports, {
|
|
|
12
12
|
List: function() {
|
|
13
13
|
return _List.List;
|
|
14
14
|
},
|
|
15
|
-
listClassNames: function() {
|
|
16
|
-
return _List.listClassNames;
|
|
17
|
-
},
|
|
18
|
-
renderList_unstable: function() {
|
|
19
|
-
return _List.renderList_unstable;
|
|
20
|
-
},
|
|
21
|
-
useListStyles_unstable: function() {
|
|
22
|
-
return _List.useListStyles_unstable;
|
|
23
|
-
},
|
|
24
|
-
useList_unstable: function() {
|
|
25
|
-
return _List.useList_unstable;
|
|
26
|
-
},
|
|
27
15
|
ListItem: function() {
|
|
28
16
|
return _ListItem.ListItem;
|
|
29
17
|
},
|
|
18
|
+
listClassNames: function() {
|
|
19
|
+
return _List.listClassNames;
|
|
20
|
+
},
|
|
30
21
|
listItemClassNames: function() {
|
|
31
22
|
return _ListItem.listItemClassNames;
|
|
32
23
|
},
|
|
33
24
|
renderListItem_unstable: function() {
|
|
34
25
|
return _ListItem.renderListItem_unstable;
|
|
35
26
|
},
|
|
27
|
+
renderList_unstable: function() {
|
|
28
|
+
return _List.renderList_unstable;
|
|
29
|
+
},
|
|
36
30
|
useListItemStyles_unstable: function() {
|
|
37
31
|
return _ListItem.useListItemStyles_unstable;
|
|
38
32
|
},
|
|
@@ -41,6 +35,12 @@ _export(exports, {
|
|
|
41
35
|
},
|
|
42
36
|
useListSelection: function() {
|
|
43
37
|
return _hooks.useListSelection;
|
|
38
|
+
},
|
|
39
|
+
useListStyles_unstable: function() {
|
|
40
|
+
return _List.useListStyles_unstable;
|
|
41
|
+
},
|
|
42
|
+
useList_unstable: function() {
|
|
43
|
+
return _List.useList_unstable;
|
|
44
44
|
}
|
|
45
45
|
});
|
|
46
46
|
const _List = require("./List");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export { List, listClassNames, renderList_unstable, useListStyles_unstable, useList_unstable } from './List';\nexport type { ListProps, ListSlots, ListState } from './List';\n\nexport {\n ListItem,\n listItemClassNames,\n renderListItem_unstable,\n useListItemStyles_unstable,\n useListItem_unstable,\n} from './ListItem';\nexport type { ListItemProps, ListItemSlots, ListItemState } from './ListItem';\n\nexport { useListSelection } from './hooks';\n"],"names":["List","ListItem","listClassNames","listItemClassNames","renderListItem_unstable","renderList_unstable","useListItemStyles_unstable","useListItem_unstable","useListSelection","useListStyles_unstable","useList_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,IAAI;eAAJA,UAAI;;IAIXC,QAAQ;eAARA,kBAAQ;;IAJKC,cAAc;eAAdA,oBAAc;;IAK3BC,kBAAkB;eAAlBA,4BAAkB;;IAClBC,uBAAuB;eAAvBA,iCAAuB;;IANMC,mBAAmB;eAAnBA,yBAAmB;;IAOhDC,0BAA0B;eAA1BA,oCAA0B;;IAC1BC,oBAAoB;eAApBA,8BAAoB;;IAIbC,gBAAgB;eAAhBA,uBAAgB;;IAZ2BC,sBAAsB;eAAtBA,4BAAsB;;IAAEC,gBAAgB;eAAhBA,sBAAgB;;;sBAAQ;0BAS7F;uBAG0B"}
|
|
@@ -9,11 +9,11 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
primitiveClassName: function() {
|
|
13
|
-
return primitiveClassName;
|
|
14
|
-
},
|
|
15
12
|
Primitive: function() {
|
|
16
13
|
return Primitive;
|
|
14
|
+
},
|
|
15
|
+
primitiveClassName: function() {
|
|
16
|
+
return primitiveClassName;
|
|
17
17
|
}
|
|
18
18
|
});
|
|
19
19
|
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Primitive.
|
|
1
|
+
{"version":3,"sources":["Primitive.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mergeClasses } from '@fluentui/react-components';\n\n// Simplified version from https://github.com/reach/reach-ui/blob/55d28eda39afc4c667e97f5f62a48d1de034b93f/packages/utils/src/polymorphic.ts\ninterface PrimitiveComponent {\n /**\n * Infers props from JSX.IntrinsicElements based on \"as\" value. Explicitly avoids `React.ElementType` and manually\n * narrow the prop types so that events are typed when using JSX.IntrinsicElements.\n */\n <As extends keyof JSX.IntrinsicElements>(props: { as?: As } & JSX.IntrinsicElements[As]): React.ReactElement | null;\n\n displayName: string;\n}\n\nexport const primitiveClassName = 'fui-Primitive';\n\nexport const Primitive = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLElement> & { as: 'div' }>(\n (props, ref) => {\n const { as: Component = 'div', ...rest } = props;\n\n const dir = typeof props.children === 'string' ? 'auto' : undefined;\n\n const className = mergeClasses(primitiveClassName, props.className);\n\n return <Component dir={dir} {...rest} className={className} ref={ref} />;\n },\n) as PrimitiveComponent;\n\nPrimitive.displayName = 'Primitive';\n"],"names":["Primitive","primitiveClassName","React","forwardRef","props","ref","as","Component","rest","dir","children","undefined","className","mergeClasses","createElement","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAgBaA,SAAAA;eAAAA;;IAFAC,kBAAAA;eAAAA;;;;iEAdU;iCACM;AAatB,MAAMA,qBAAqB;AAE3B,MAAMD,YAAAA,WAAAA,GAAYE,OAAMC,UAAU,CACvC,CAACC,OAAOC;IACN,MAAM,EAAEC,IAAIC,YAAY,KAAK,EAAE,GAAGC,MAAM,GAAGJ;IAE3C,MAAMK,MAAM,OAAOL,MAAMM,QAAQ,KAAK,WAAW,SAASC;IAE1D,MAAMC,YAAYC,IAAAA,6BAAAA,EAAaZ,oBAAoBG,MAAMQ,SAAS;IAElE,OAAA,WAAA,GAAOV,OAAAY,aAAA,CAACP,WAAAA;QAAUE,KAAKA;QAAM,GAAGD,IAAI;QAAEI,WAAWA;QAAWP,KAAKA;;AACnE;AAGFL,UAAUe,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"sourcesContent":["export * from './Primitive';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
@@ -9,11 +9,11 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
segmentClassName: function() {
|
|
13
|
-
return segmentClassName;
|
|
14
|
-
},
|
|
15
12
|
Segment: function() {
|
|
16
13
|
return Segment;
|
|
14
|
+
},
|
|
15
|
+
segmentClassName: function() {
|
|
16
|
+
return segmentClassName;
|
|
17
17
|
}
|
|
18
18
|
});
|
|
19
19
|
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Segment.
|
|
1
|
+
{"version":3,"sources":["Segment.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport * as React from 'react';\n\nimport { useSegmentStyles } from './Segment.styles';\n\nexport const segmentClassName = 'fui-Segment';\n\nexport const Segment = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLElement>>((props, ref) => {\n const { children, className, ...rest } = props;\n const classes = useSegmentStyles();\n\n const segmentClasses = mergeClasses(segmentClassName, classes.segment, className);\n\n return (\n <div ref={ref} className={segmentClasses} {...rest}>\n {children}\n </div>\n );\n});\n\nSegment.displayName = 'Segment';\n"],"names":["Segment","segmentClassName","React","forwardRef","props","ref","children","className","rest","classes","useSegmentStyles","segmentClasses","mergeClasses","segment","createElement","div","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAOaA,OAAAA;eAAAA;;IAFAC,gBAAAA;eAAAA;;;;iCALgB;iEACN;+BAEU;AAE1B,MAAMA,mBAAmB;AAEzB,MAAMD,UAAAA,WAAAA,GAAUE,OAAMC,UAAU,CAAoD,CAACC,OAAOC;IACjG,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,MAAM,GAAGJ;IACzC,MAAMK,UAAUC,IAAAA,+BAAAA;IAEhB,MAAMC,iBAAiBC,IAAAA,6BAAAA,EAAaX,kBAAkBQ,QAAQI,OAAO,EAAEN;IAEvE,OAAA,WAAA,GACEL,OAAAY,aAAA,CAACC,OAAAA;QAAIV,KAAKA;QAAKE,WAAWI;QAAiB,GAAGH,IAAI;OAC/CF;AAGP;AAEAN,QAAQgB,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Segment.styles.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"sources":["Segment.styles.js"],"sourcesContent":["import { makeStyles, shorthands, tokens } from '@fluentui/react-components';\nexport const useSegmentStyles = makeStyles({\n segment: {\n padding: '1em',\n ...shorthands.borderWidth('2px', 0, 0),\n ...shorthands.borderColor('transparent'),\n ...shorthands.borderStyle('solid'),\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: `0 1px 1px 1px ${tokens.colorNeutralShadowKey}`\n }\n});\n"],"names":["useSegmentStyles","__styles","segment","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","g2u3we","h3c5rm","B9xav0g","zhjwy3","icvyot","vrafjx","oivjwe","wvpqe5","De3pzq","E5pizo","d","p"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BACaA;;;eAAAA;;;iCADkC;AACxC,MAAMA,mBAAgB,WAAA,GAAGC,IAAAA,yBAAA,EAAA;IAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;YAAA;YAAA;SAAA;QAAAC,SAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;QAAAC,QAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;QAAAC,SAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;QAAAC,QAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;QAAAC,QAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;QAAAC,QAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Segment';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Slider.mixins.
|
|
1
|
+
{"version":3,"sources":["Slider.mixins.ts"],"sourcesContent":["import { GriffelStyle } from '@fluentui/react-components';\n\nconst fluid = (): GriffelStyle => ({ width: '100%' });\n\nexport const slider = {\n fluid,\n};\n"],"names":["slider","fluid","width"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":";;;;+BAIaA;;;eAAAA;;;AAFb,MAAMC,QAAQ,IAAqB,CAAA;QAAEC,OAAO;IAAO,CAAA;AAE5C,MAAMF,SAAS;IACpBC;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export { slider } from './Slider.mixins';\n"],"names":["slider"],"rangeMappings":";;;;;;;;;;","mappings":";;;;+BAASA;;;eAAAA,oBAAM;;;8BAAQ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["SpinnerMigration.mixins.
|
|
1
|
+
{"version":3,"sources":["SpinnerMigration.mixins.ts"],"sourcesContent":["import { GriffelStyle, tokens, labelClassNames } from '@fluentui/react-components';\n\nconst v0Inline = (): GriffelStyle => ({ display: 'inline-flex' });\n\nconst v0SpinnerLabelStyle = (): GriffelStyle => ({\n [`& .${labelClassNames.root}`]: {\n fontSize: '14px',\n fontWeight: tokens.fontWeightMedium,\n },\n});\n\nexport const spinner = {\n v0Inline,\n v0SpinnerLabelStyle,\n};\n"],"names":["spinner","v0Inline","display","v0SpinnerLabelStyle","labelClassNames","root","fontSize","fontWeight","tokens","fontWeightMedium"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;iCAXyC;AAEtD,MAAMC,WAAW,IAAqB,CAAA;QAAEC,SAAS;IAAc,CAAA;AAE/D,MAAMC,sBAAsB,IAAqB,CAAA;QAC/C,CAAC,CAAC,GAAG,EAAEC,gCAAAA,CAAgBC,IAAI,CAAC,CAAC,CAAC,EAAE;YAC9BC,UAAU;YACVC,YAAYC,uBAAAA,CAAOC,gBAAgB;QACrC;IACF,CAAA;AAEO,MAAMT,UAAU;IACrBC;IACAE;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"sourcesContent":["export { spinner } from './SpinnerMigration.mixins';\n"],"names":["spinner"],"rangeMappings":";;;;;;;;;;","mappings":";;;;+BAASA;;;eAAAA,+BAAO;;;wCAAQ"}
|
|
@@ -9,11 +9,11 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
styledTextClassName: function() {
|
|
13
|
-
return styledTextClassName;
|
|
14
|
-
},
|
|
15
12
|
StyledText: function() {
|
|
16
13
|
return StyledText;
|
|
14
|
+
},
|
|
15
|
+
styledTextClassName: function() {
|
|
16
|
+
return styledTextClassName;
|
|
17
17
|
}
|
|
18
18
|
});
|
|
19
19
|
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["StyledText.
|
|
1
|
+
{"version":3,"sources":["StyledText.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, mergeClasses, Slot, ComponentProps, slot } from '@fluentui/react-components';\nimport { useSizeStyles, useStyles, useWeightStyles } from './StyledText.styles';\n\nexport type StyledTextSlots = {\n root: Slot<'span', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'pre' | 'time'>;\n};\n\nexport type StyledTextProps = ComponentProps<StyledTextSlots> & {\n /**\n * Aligns text based on the parent container.\n */\n align?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * At mentions can be formatted to draw users' attention.\n * Mentions for \"me\" can be formatted to appear differently.\n */\n atMention?: 'me' | boolean;\n\n /**\n * Set as disabled StyledText component\n */\n disabled?: boolean;\n\n /**\n * Set as error StyledText component\n */\n error?: boolean;\n\n /**\n * The StyledText can appear more important and draw user's attention\n */\n important?: boolean;\n\n /**\n * Applies font size and line height based on the theme tokens.\n */\n size?:\n | 'smaller'\n | 'small'\n | 'medium'\n | 'large'\n | 'large500'\n | 'larger'\n | 'largest'\n | 100\n | 200\n | 300\n | 400\n | 500\n | 600\n | 700;\n\n /**\n * Set as success StyledText component\n */\n success?: boolean;\n\n /**\n * The text can signify a temporary state\n */\n temporary?: boolean;\n\n /**\n * Set as timestamp StyledText component\n */\n timestamp?: boolean;\n\n /**\n * Truncate overflowing text for block displays.\n */\n truncate?: boolean;\n\n /**\n * Applies font weight to the content.\n */\n weight?: 'light' | 'semilight' | 'regular' | 'medium' | 'semibold' | 'bold';\n\n /**\n * Wraps the text content on white spaces.\n *\n * @default true\n */\n wrap?: boolean;\n};\n\nexport const styledTextClassName = 'fui-StyledText';\n\nconst sizeMap: Record<string, 'base100' | 'base200' | 'base300' | 'base400' | 'base500' | 'base600' | 'hero700'> = {\n '100': 'base100',\n '200': 'base200',\n '300': 'base300',\n '400': 'base400',\n '500': 'base500',\n '600': 'base600',\n '700': 'hero700',\n smaller: 'base100',\n small: 'base200',\n medium: 'base300',\n large: 'base400',\n large500: 'base500',\n larger: 'base600',\n largest: 'hero700',\n};\n\nexport const StyledText = React.forwardRef<HTMLSpanElement, StyledTextProps>((props, ref) => {\n const {\n align,\n atMention,\n disabled,\n error,\n important,\n success,\n temporary,\n timestamp,\n truncate,\n weight,\n wrap = true,\n } = props;\n\n const dir = typeof props.children === 'string' ? 'auto' : undefined;\n\n const sizeStyles = useSizeStyles();\n const weightStyles = useWeightStyles();\n const styles = useStyles();\n\n const size = props.size ? sizeMap[props.size] : props.size;\n\n const RootSlot = slot.always(\n getIntrinsicElementProps('span', {\n ref,\n ...props,\n dir,\n className: mergeClasses(\n styledTextClassName,\n size && sizeStyles[size],\n weight && weightStyles[weight],\n wrap === false && styles.nowrap,\n truncate && styles.truncate,\n align === 'center' && styles.alignCenter,\n align === 'end' && styles.alignEnd,\n align === 'justify' && styles.alignJustify,\n\n atMention && styles.mention,\n atMention === 'me' && styles.mentionMe,\n disabled && styles.disabled,\n error && styles.error,\n important && styles.important,\n success && styles.success,\n temporary && styles.temporary,\n timestamp && styles.timestamp,\n props.className,\n ),\n }),\n { elementType: 'span' },\n );\n\n return <RootSlot />;\n});\n\nStyledText.displayName = 'StyledText';\n"],"names":["StyledText","styledTextClassName","sizeMap","smaller","small","medium","large","large500","larger","largest","React","forwardRef","props","ref","align","atMention","disabled","error","important","success","temporary","timestamp","truncate","weight","wrap","dir","children","undefined","sizeStyles","useSizeStyles","weightStyles","useWeightStyles","styles","useStyles","size","RootSlot","slot","always","getIntrinsicElementProps","className","mergeClasses","nowrap","alignCenter","alignEnd","alignJustify","mention","mentionMe","elementType","_jsx","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA6GaA,UAAAA;eAAAA;;IAnBAC,mBAAAA;eAAAA;;;;4BAzFb;iEAEuB;iCAC4D;kCACzB;AAqFnD,MAAMA,sBAAsB;AAEnC,MAAMC,UAA6G;IACjH,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACPC,SAAS;IACTC,OAAO;IACPC,QAAQ;IACRC,OAAO;IACPC,UAAU;IACVC,QAAQ;IACRC,SAAS;AACX;AAEO,MAAMT,aAAAA,WAAAA,GAAaU,OAAMC,UAAU,CAAmC,CAACC,OAAOC;IACnF,MAAM,EACJC,KAAK,EACLC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,SAAS,EACTC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,MAAM,EACNC,OAAO,IAAI,EACZ,GAAGZ;IAEJ,MAAMa,MAAM,OAAOb,MAAMc,QAAQ,KAAK,WAAW,SAASC;IAE1D,MAAMC,aAAaC,IAAAA,+BAAAA;IACnB,MAAMC,eAAeC,IAAAA,iCAAAA;IACrB,MAAMC,SAASC,IAAAA,2BAAAA;IAEf,MAAMC,OAAOtB,MAAMsB,IAAI,GAAGhC,OAAO,CAACU,MAAMsB,IAAI,CAAC,GAAGtB,MAAMsB,IAAI;IAE1D,MAAMC,WAAWC,qBAAAA,CAAKC,MAAM,CAC1BC,IAAAA,yCAAAA,EAAyB,QAAQ;QAC/BzB;QACA,GAAGD,KAAK;QACRa;QACAc,WAAWC,IAAAA,6BAAAA,EACTvC,qBACAiC,QAAQN,UAAU,CAACM,KAAK,EACxBX,UAAUO,YAAY,CAACP,OAAO,EAC9BC,SAAS,SAASQ,OAAOS,MAAM,EAC/BnB,YAAYU,OAAOV,QAAQ,EAC3BR,UAAU,YAAYkB,OAAOU,WAAW,EACxC5B,UAAU,SAASkB,OAAOW,QAAQ,EAClC7B,UAAU,aAAakB,OAAOY,YAAY,EAE1C7B,aAAaiB,OAAOa,OAAO,EAC3B9B,cAAc,QAAQiB,OAAOc,SAAS,EACtC9B,YAAYgB,OAAOhB,QAAQ,EAC3BC,SAASe,OAAOf,KAAK,EACrBC,aAAac,OAAOd,SAAS,EAC7BC,WAAWa,OAAOb,OAAO,EACzBC,aAAaY,OAAOZ,SAAS,EAC7BC,aAAaW,OAAOX,SAAS,EAC7BT,MAAM2B,SAAS;IAEnB,IACA;QAAEQ,aAAa;IAAO;IAGxB,OAAA,WAAA,GAAOC,IAAAA,eAAA,EAACb,UAAAA,CAAAA;AACV;AAEAnC,WAAWiD,WAAW,GAAG"}
|
|
@@ -12,11 +12,11 @@ _export(exports, {
|
|
|
12
12
|
useSizeStyles: function() {
|
|
13
13
|
return useSizeStyles;
|
|
14
14
|
},
|
|
15
|
-
useWeightStyles: function() {
|
|
16
|
-
return useWeightStyles;
|
|
17
|
-
},
|
|
18
15
|
useStyles: function() {
|
|
19
16
|
return useStyles;
|
|
17
|
+
},
|
|
18
|
+
useWeightStyles: function() {
|
|
19
|
+
return useWeightStyles;
|
|
20
20
|
}
|
|
21
21
|
});
|
|
22
22
|
const _reactcomponents = require("@fluentui/react-components");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["StyledText.styles.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"sources":["StyledText.styles.js"],"sourcesContent":["import { makeStyles, tokens } from '@fluentui/react-components';\nexport const useSizeStyles = makeStyles({\n base100: {\n fontSize: tokens.fontSizeBase100,\n lineHeight: tokens.lineHeightBase100\n },\n base200: {\n fontSize: tokens.fontSizeBase200,\n lineHeight: tokens.lineHeightBase200\n },\n base300: {\n fontSize: tokens.fontSizeBase300,\n lineHeight: tokens.lineHeightBase300\n },\n base400: {\n fontSize: tokens.fontSizeBase400,\n lineHeight: tokens.lineHeightBase400\n },\n base500: {\n fontSize: tokens.fontSizeBase500,\n lineHeight: tokens.lineHeightBase500\n },\n base600: {\n fontSize: tokens.fontSizeBase600,\n lineHeight: tokens.lineHeightBase600\n },\n hero700: {\n fontSize: tokens.fontSizeHero700,\n lineHeight: tokens.lineHeightHero700\n }\n});\nexport const useWeightStyles = makeStyles({\n light: {\n fontWeight: 200\n },\n semilight: {\n fontWeight: 300\n },\n regular: {\n fontWeight: 400\n },\n medium: {\n fontWeight: 500\n },\n semibold: {\n fontWeight: 600\n },\n bold: {\n fontWeight: 700\n }\n});\nexport const useStyles = makeStyles({\n mention: {\n color: tokens.colorBrandForegroundLink\n },\n mentionMe: {\n color: tokens.colorPalettePumpkinBorderActive,\n fontWeight: 700\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled\n },\n error: {\n color: tokens.colorPaletteRedForeground3\n },\n important: {\n color: tokens.colorPaletteDarkOrangeForeground3,\n fontWeight: 700\n },\n success: {\n color: tokens.colorPaletteGreenForeground3\n },\n temporary: {\n fontStyle: 'italic'\n },\n timestamp: {\n color: tokens.colorNeutralForeground3\n },\n nowrap: {\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n },\n truncate: {\n textOverflow: 'ellipsis'\n },\n alignCenter: {\n textAlign: 'center'\n },\n alignEnd: {\n textAlign: 'end'\n },\n alignJustify: {\n textAlign: 'justify'\n }\n});\n"],"names":["useSizeStyles","useStyles","useWeightStyles","__styles","base100","Be2twd7","Bg96gwp","base200","base300","base400","base500","base600","hero700","d","light","Bhrd7zp","semilight","regular","medium","semibold","bold","mention","sj55zd","mentionMe","disabled","error","important","success","temporary","B80ckks","timestamp","nowrap","Huce71","B68tc82","Bmxbyg5","Bpg54ce","truncate","ygn44y","alignCenter","fsow6f","alignEnd","alignJustify","p"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACaA,aAAa;eAAbA;;IAkDAC,SAAS;eAATA;;IApBAC,eAAe;eAAfA;;;iCA/BsB;AAC5B,MAAMF,gBAAa,WAAA,GAAGG,IAAAA,yBAAA,EAAA;IAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAC,SAAA;QAAAF,SAAA;QAAAC,SAAA;IAAA;IAAAE,SAAA;QAAAH,SAAA;QAAAC,SAAA;IAAA;IAAAG,SAAA;QAAAJ,SAAA;QAAAC,SAAA;IAAA;IAAAI,SAAA;QAAAL,SAAA;QAAAC,SAAA;IAAA;IAAAK,SAAA;QAAAN,SAAA;QAAAC,SAAA;IAAA;IAAAM,SAAA;QAAAP,SAAA;QAAAC,SAAA;IAAA;AAAA,GAAA;IAAAO,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AA8BtB,MAAMX,kBAAe,WAAA,GAAGC,IAAAA,yBAAA,EAAA;IAAAW,OAAA;QAAAC,SAAA;IAAA;IAAAC,WAAA;QAAAD,SAAA;IAAA;IAAAE,SAAA;QAAAF,SAAA;IAAA;IAAAG,QAAA;QAAAH,SAAA;IAAA;IAAAI,UAAA;QAAAJ,SAAA;IAAA;IAAAK,MAAA;QAAAL,SAAA;IAAA;AAAA,GAAA;IAAAF,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAoBxB,MAAMZ,YAAS,WAAA,GAAGE,IAAAA,yBAAA,EAAA;IAAAkB,SAAA;QAAAC,QAAA;IAAA;IAAAC,WAAA;QAAAD,QAAA;QAAAP,SAAA;IAAA;IAAAS,UAAA;QAAAF,QAAA;IAAA;IAAAG,OAAA;QAAAH,QAAA;IAAA;IAAAI,WAAA;QAAAJ,QAAA;QAAAP,SAAA;IAAA;IAAAY,SAAA;QAAAL,QAAA;IAAA;IAAAM,WAAA;QAAAC,SAAA;IAAA;IAAAC,WAAA;QAAAR,QAAA;IAAA;IAAAS,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAC,UAAA;QAAAC,QAAA;IAAA;IAAAC,aAAA;QAAAC,QAAA;IAAA;IAAAC,UAAA;QAAAD,QAAA;IAAA;IAAAE,cAAA;QAAAF,QAAA;IAAA;AAAA,GAAA;IAAA1B,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAA6B,GAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"sourcesContent":["export * from './StyledText';\nexport * from './StyledText.styles';\n"],"names":[],"rangeMappings":";;;;;;","mappings":";;;;;uBAAc;uBACA"}
|