Initial commit

This commit is contained in:
2025-03-07 19:22:02 +01:00
commit 4a98255d83
55743 changed files with 5280367 additions and 0 deletions
+28
View File
@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Badge: function() {
return _index.Badge;
},
badgeClassNames: function() {
return _index.badgeClassNames;
},
renderBadge_unstable: function() {
return _index.renderBadge_unstable;
},
useBadgeStyles_unstable: function() {
return _index.useBadgeStyles_unstable;
},
useBadge_unstable: function() {
return _index.useBadge_unstable;
}
});
const _index = require("./components/Badge/index");
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/Badge.ts"],"sourcesContent":["export type { BadgeProps, BadgeSlots, BadgeState } from './components/Badge/index';\nexport {\n Badge,\n badgeClassNames,\n renderBadge_unstable,\n useBadgeStyles_unstable,\n useBadge_unstable,\n} from './components/Badge/index';\n"],"names":["Badge","badgeClassNames","renderBadge_unstable","useBadgeStyles_unstable","useBadge_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEEA,KAAK;eAALA,YAAK;;IACLC,eAAe;eAAfA,sBAAe;;IACfC,oBAAoB;eAApBA,2BAAoB;;IACpBC,uBAAuB;eAAvBA,8BAAuB;;IACvBC,iBAAiB;eAAjBA,wBAAiB;;;uBACZ"}
+25
View File
@@ -0,0 +1,25 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
CounterBadge: function() {
return _index.CounterBadge;
},
counterBadgeClassNames: function() {
return _index.counterBadgeClassNames;
},
useCounterBadgeStyles_unstable: function() {
return _index.useCounterBadgeStyles_unstable;
},
useCounterBadge_unstable: function() {
return _index.useCounterBadge_unstable;
}
});
const _index = require("./components/CounterBadge/index");
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/CounterBadge.ts"],"sourcesContent":["export type { CounterBadgeProps, CounterBadgeState } from './components/CounterBadge/index';\nexport {\n CounterBadge,\n counterBadgeClassNames,\n useCounterBadgeStyles_unstable,\n useCounterBadge_unstable,\n} from './components/CounterBadge/index';\n"],"names":["CounterBadge","counterBadgeClassNames","useCounterBadgeStyles_unstable","useCounterBadge_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEEA,YAAY;eAAZA,mBAAY;;IACZC,sBAAsB;eAAtBA,6BAAsB;;IACtBC,8BAA8B;eAA9BA,qCAA8B;;IAC9BC,wBAAwB;eAAxBA,+BAAwB;;;uBACnB"}
+58
View File
@@ -0,0 +1,58 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
PresenceBadge: function() {
return _index.PresenceBadge;
},
presenceAvailableFilled: function() {
return _index.presenceAvailableFilled;
},
presenceAvailableRegular: function() {
return _index.presenceAvailableRegular;
},
presenceAwayFilled: function() {
return _index.presenceAwayFilled;
},
presenceAwayRegular: function() {
return _index.presenceAwayRegular;
},
presenceBadgeClassNames: function() {
return _index.presenceBadgeClassNames;
},
presenceBlockedRegular: function() {
return _index.presenceBlockedRegular;
},
presenceBusyFilled: function() {
return _index.presenceBusyFilled;
},
presenceDndFilled: function() {
return _index.presenceDndFilled;
},
presenceDndRegular: function() {
return _index.presenceDndRegular;
},
presenceOfflineRegular: function() {
return _index.presenceOfflineRegular;
},
presenceOofRegular: function() {
return _index.presenceOofRegular;
},
presenceUnknownRegular: function() {
return _index.presenceUnknownRegular;
},
usePresenceBadgeStyles_unstable: function() {
return _index.usePresenceBadgeStyles_unstable;
},
usePresenceBadge_unstable: function() {
return _index.usePresenceBadge_unstable;
}
});
const _index = require("./components/PresenceBadge/index");
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/PresenceBadge.ts"],"sourcesContent":["export type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './components/PresenceBadge/index';\nexport {\n PresenceBadge,\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceAwayRegular,\n presenceBadgeClassNames,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n usePresenceBadgeStyles_unstable,\n usePresenceBadge_unstable,\n} from './components/PresenceBadge/index';\n"],"names":["PresenceBadge","presenceAvailableFilled","presenceAvailableRegular","presenceAwayFilled","presenceAwayRegular","presenceBadgeClassNames","presenceBlockedRegular","presenceBusyFilled","presenceDndFilled","presenceDndRegular","presenceOfflineRegular","presenceOofRegular","presenceUnknownRegular","usePresenceBadgeStyles_unstable","usePresenceBadge_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEEA,aAAa;eAAbA,oBAAa;;IACbC,uBAAuB;eAAvBA,8BAAuB;;IACvBC,wBAAwB;eAAxBA,+BAAwB;;IACxBC,kBAAkB;eAAlBA,yBAAkB;;IAClBC,mBAAmB;eAAnBA,0BAAmB;;IACnBC,uBAAuB;eAAvBA,8BAAuB;;IACvBC,sBAAsB;eAAtBA,6BAAsB;;IACtBC,kBAAkB;eAAlBA,yBAAkB;;IAClBC,iBAAiB;eAAjBA,wBAAiB;;IACjBC,kBAAkB;eAAlBA,yBAAkB;;IAClBC,sBAAsB;eAAtBA,6BAAsB;;IACtBC,kBAAkB;eAAlBA,yBAAkB;;IAClBC,sBAAsB;eAAtBA,6BAAsB;;IACtBC,+BAA+B;eAA/BA,sCAA+B;;IAC/BC,yBAAyB;eAAzBA,gCAAyB;;;uBACpB"}
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "Badge", {
enumerable: true,
get: function() {
return Badge;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useBadge = require("./useBadge");
const _useBadgeStylesstyles = require("./useBadgeStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _renderBadge = require("./renderBadge");
const Badge = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useBadge.useBadge_unstable)(props, ref);
(0, _useBadgeStylesstyles.useBadgeStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useBadgeStyles_unstable')(state);
return (0, _renderBadge.renderBadge_unstable)(state);
});
Badge.displayName = 'Badge';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Badge/Badge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useBadge_unstable } from './useBadge';\nimport { useBadgeStyles_unstable } from './useBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from './renderBadge';\nimport type { BadgeProps } from './Badge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const Badge: ForwardRefComponent<BadgeProps> = React.forwardRef((props, ref) => {\n const state = useBadge_unstable(props, ref);\n\n useBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nBadge.displayName = 'Badge';\n"],"names":["Badge","React","forwardRef","props","ref","state","useBadge_unstable","useBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;0BACW;sCACM;qCACI;6BACP;AAO9B,MAAMA,QAAAA,WAAAA,GAAyCC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC7E,MAAMC,QAAQC,IAAAA,2BAAAA,EAAkBH,OAAOC;IAEvCG,IAAAA,6CAAAA,EAAwBF;IAExBG,IAAAA,gDAAAA,EAA4B,2BAA2BH;IAEvD,OAAOI,IAAAA,iCAAAA,EAAqBJ;AAC9B;AAEAL,MAAMU,WAAW,GAAG"}
@@ -0,0 +1,4 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Badge/Badge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type BadgeSlots = {\n root: Slot<'div'>;\n icon?: Slot<'span'>;\n};\n\n// react has a non-standard `color` attribute in its types\n// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a4ab0fa432320e70da9e51c8ae2e47377f65804b/types/react/index.d.ts#L1868\nexport type BadgeProps = Omit<ComponentProps<BadgeSlots>, 'color'> & {\n /**\n * A Badge can be filled, outline, ghost, inverted\n * @defaultvalue filled\n */\n appearance?: 'filled' | 'ghost' | 'outline' | 'tint';\n\n /**\n * A Badge can be one of preset colors\n * @defaultvalue brand\n */\n color?: 'brand' | 'danger' | 'important' | 'informative' | 'severe' | 'subtle' | 'success' | 'warning';\n\n /**\n * A Badge can position the icon before or after the content.\n * @defaultvalue before\n */\n iconPosition?: 'before' | 'after';\n\n /**\n * A Badge can be square, circular or rounded.\n * @defaultvalue circular\n */\n shape?: 'circular' | 'rounded' | 'square';\n\n /**\n * A Badge can be on of several preset sizes.\n * @defaultvalue medium\n */\n size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';\n};\n\nexport type BadgeState = ComponentState<BadgeSlots> &\n Required<Pick<BadgeProps, 'appearance' | 'color' | 'iconPosition' | 'shape' | 'size'>>;\n"],"names":[],"rangeMappings":"","mappings":""}
@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Badge: function() {
return _Badge.Badge;
},
badgeClassNames: function() {
return _useBadgeStylesstyles.badgeClassNames;
},
renderBadge_unstable: function() {
return _renderBadge.renderBadge_unstable;
},
useBadgeStyles_unstable: function() {
return _useBadgeStylesstyles.useBadgeStyles_unstable;
},
useBadge_unstable: function() {
return _useBadge.useBadge_unstable;
}
});
const _Badge = require("./Badge");
const _renderBadge = require("./renderBadge");
const _useBadge = require("./useBadge");
const _useBadgeStylesstyles = require("./useBadgeStyles.styles");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Badge/index.ts"],"sourcesContent":["export { Badge } from './Badge';\n// Explicit exports to omit BadgeCommons\nexport type { BadgeProps, BadgeSlots, BadgeState } from './Badge.types';\nexport { renderBadge_unstable } from './renderBadge';\nexport { useBadge_unstable } from './useBadge';\nexport { badgeClassNames, useBadgeStyles_unstable } from './useBadgeStyles.styles';\n"],"names":["Badge","badgeClassNames","renderBadge_unstable","useBadgeStyles_unstable","useBadge_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,KAAK;eAALA,YAAK;;IAKLC,eAAe;eAAfA,qCAAe;;IAFfC,oBAAoB;eAApBA,iCAAoB;;IAEHC,uBAAuB;eAAvBA,6CAAuB;;IADxCC,iBAAiB;eAAjBA,2BAAiB;;;uBAJJ;6BAGe;0BACH;sCACuB"}
@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderBadge_unstable", {
enumerable: true,
get: function() {
return renderBadge_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const renderBadge_unstable = (state)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
children: [
state.iconPosition === 'before' && state.icon && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.icon, {}),
state.root.children,
state.iconPosition === 'after' && state.icon && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.icon, {})
]
});
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Badge/renderBadge.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { BadgeState, BadgeSlots } from './Badge.types';\n\nexport const renderBadge_unstable = (state: BadgeState) => {\n assertSlots<BadgeSlots>(state);\n\n return (\n <state.root>\n {state.iconPosition === 'before' && state.icon && <state.icon />}\n {state.root.children}\n {state.iconPosition === 'after' && state.icon && <state.icon />}\n </state.root>\n );\n};\n"],"names":["renderBadge_unstable","state","assertSlots","_jsxs","root","iconPosition","icon","_jsx","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAMaA;;;eAAAA;;;4BALb;gCAE4B;AAGrB,MAAMA,uBAAuB,CAACC;IACnCC,IAAAA,2BAAAA,EAAwBD;IAExB,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;YACRH,MAAMI,YAAY,KAAK,YAAYJ,MAAMK,IAAI,IAAA,WAAA,GAAIC,IAAAA,eAAA,EAACN,MAAMK,IAAI,EAAA,CAAA;YAC5DL,MAAMG,IAAI,CAACI,QAAQ;YACnBP,MAAMI,YAAY,KAAK,WAAWJ,MAAMK,IAAI,IAAA,WAAA,GAAIC,IAAAA,eAAA,EAACN,MAAMK,IAAI,EAAA,CAAA;;;AAGlE"}
@@ -0,0 +1,40 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useBadge_unstable", {
enumerable: true,
get: function() {
return useBadge_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const useBadge_unstable = (props, ref)=>{
const { shape = 'circular', size = 'medium', iconPosition = 'before', appearance = 'filled', color = 'brand' } = props;
const state = {
shape,
size,
iconPosition,
appearance,
color,
components: {
root: 'div',
icon: 'span'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
// FIXME:
// `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
// but since it would be a breaking change to fix it, we are casting ref to it's proper type
ref: ref,
...props
}), {
elementType: 'div'
}),
icon: _reactutilities.slot.optional(props.icon, {
elementType: 'span'
})
};
return state;
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Badge/useBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState } from './Badge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useBadge_unstable = (props: BadgeProps, ref: React.Ref<HTMLElement>): BadgeState => {\n const {\n shape = 'circular',\n size = 'medium',\n iconPosition = 'before',\n appearance = 'filled',\n color = 'brand',\n } = props;\n\n const state: BadgeState = {\n shape,\n size,\n iconPosition,\n appearance,\n color,\n components: {\n root: 'div',\n icon: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n ),\n icon: slot.optional(props.icon, { elementType: 'span' }),\n };\n\n return state;\n};\n"],"names":["useBadge_unstable","props","ref","shape","size","iconPosition","appearance","color","state","components","root","icon","slot","always","getIntrinsicElementProps","elementType","optional"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAOaA;;;eAAAA;;;;iEAPU;gCACwB;AAMxC,MAAMA,oBAAoB,CAACC,OAAmBC;IACnD,MAAM,EACJC,QAAQ,UAAU,EAClBC,OAAO,QAAQ,EACfC,eAAe,QAAQ,EACvBC,aAAa,QAAQ,EACrBC,QAAQ,OAAO,EAChB,GAAGN;IAEJ,MAAMO,QAAoB;QACxBL;QACAC;QACAC;QACAC;QACAC;QACAE,YAAY;YACVC,MAAM;YACNC,MAAM;QACR;QACAD,MAAME,oBAAAA,CAAKC,MAAM,CACfC,IAAAA,wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FZ,KAAKA;YACL,GAAGD,KAAK;QACV,IACA;YAAEc,aAAa;QAAM;QAEvBJ,MAAMC,oBAAAA,CAAKI,QAAQ,CAACf,MAAMU,IAAI,EAAE;YAAEI,aAAa;QAAO;IACxD;IAEA,OAAOP;AACT"}
@@ -0,0 +1,589 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
badgeClassNames: function() {
return badgeClassNames;
},
useBadgeStyles_unstable: function() {
return useBadgeStyles_unstable;
}
});
const _react = require("@griffel/react");
const _reacttheme = require("@fluentui/react-theme");
const badgeClassNames = {
root: 'fui-Badge',
icon: 'fui-Badge__icon'
};
// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.
// Instead, add extra padding to the root, and a negative margin on the icon to "remove" the extra padding on the icon.
const textPadding = _reacttheme.tokens.spacingHorizontalXXS;
const useRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1l7mb74", "rntuq2r", [
".r1l7mb74{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--borderRadiusCircular);border-color:var(--colorTransparentStroke);}",
".r1l7mb74::after{content:\"\";position:absolute;top:0;left:0;bottom:0;right:0;border-style:solid;border-color:inherit;border-width:var(--strokeWidthThin);border-radius:inherit;}",
".rntuq2r{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--borderRadiusCircular);border-color:var(--colorTransparentStroke);}",
".rntuq2r::after{content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;border-style:solid;border-color:inherit;border-width:var(--strokeWidthThin);border-radius:inherit;}"
]);
const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
fontSmallToTiny: {
Bahqtrf: "fk6fouc",
Be2twd7: "f13mqy1h",
Bhrd7zp: "fl43uef",
Bg96gwp: "fcpl73t"
},
tiny: {
a9b677: "f16dn6v3",
Bqenvij: "f3mu39s",
Be2twd7: "f130uwy9",
Bg96gwp: "fod1mrr",
Bf4jedk: "f18p0k4z",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f19jm9xf"
},
"extra-small": {
a9b677: "fpd43o0",
Bqenvij: "f30q22z",
Be2twd7: "f1tccstq",
Bg96gwp: "f1y3arg5",
Bf4jedk: "f18p0k4z",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f19jm9xf"
},
small: {
a9b677: "fjw5fx7",
Bqenvij: "fd461yt",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "fupdldz"
},
medium: {},
large: {
a9b677: "fq4mcun",
Bqenvij: "frvgh55",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1996nqw"
},
"extra-large": {
a9b677: "f1szoe96",
Bqenvij: "f1d2rq10",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "fty64o7"
},
square: {
Beyfa6y: 0,
Bbmb7ep: 0,
Btl43ni: 0,
B7oj6ja: 0,
Dimara: "f1fabniw"
},
rounded: {
Beyfa6y: 0,
Bbmb7ep: 0,
Btl43ni: 0,
B7oj6ja: 0,
Dimara: "ft85np5"
},
roundedSmallToTiny: {
Beyfa6y: 0,
Bbmb7ep: 0,
Btl43ni: 0,
B7oj6ja: 0,
Dimara: "fq9zq91"
},
circular: {},
borderGhost: {
ap17g6: "f10ludwy"
},
filled: {},
"filled-brand": {
De3pzq: "ffp7eso",
sj55zd: "f1phragk"
},
"filled-danger": {
De3pzq: "fdl5y0r",
sj55zd: "f1phragk"
},
"filled-important": {
De3pzq: "f1c73kur",
sj55zd: "fr0bkrk"
},
"filled-informative": {
De3pzq: "f3vzo32",
sj55zd: "f11d4kpn"
},
"filled-severe": {
De3pzq: "f1s438gw",
sj55zd: "f1phragk"
},
"filled-subtle": {
De3pzq: "fxugw4r",
sj55zd: "f19n0e5"
},
"filled-success": {
De3pzq: "flxk52p",
sj55zd: "f1phragk"
},
"filled-warning": {
De3pzq: "ffq97bm",
sj55zd: "ff5vbop"
},
ghost: {},
"ghost-brand": {
sj55zd: "f16muhyy"
},
"ghost-danger": {
sj55zd: "f1whyuy6"
},
"ghost-important": {
sj55zd: "f19n0e5"
},
"ghost-informative": {
sj55zd: "f11d4kpn"
},
"ghost-severe": {
sj55zd: "f1l8vj45"
},
"ghost-subtle": {
sj55zd: "fonrgv7"
},
"ghost-success": {
sj55zd: "f1m7fhi8"
},
"ghost-warning": {
sj55zd: "fpti2h4"
},
outline: {
g2u3we: "f23ftbb",
h3c5rm: [
"f1gkuv52",
"f1p1bl80"
],
B9xav0g: "fioka3i",
zhjwy3: [
"f1p1bl80",
"f1gkuv52"
]
},
"outline-brand": {
sj55zd: "f16muhyy"
},
"outline-danger": {
sj55zd: "f1whyuy6",
g2u3we: "fyqpifd",
h3c5rm: [
"f3ukxca",
"f1k7dugc"
],
B9xav0g: "f1njxb2b",
zhjwy3: [
"f1k7dugc",
"f3ukxca"
]
},
"outline-important": {
sj55zd: "f11d4kpn",
g2u3we: "fq0vr37",
h3c5rm: [
"f1byw159",
"f11cr0be"
],
B9xav0g: "f1c1zstj",
zhjwy3: [
"f11cr0be",
"f1byw159"
]
},
"outline-informative": {
sj55zd: "f11d4kpn",
g2u3we: "f68mrw8",
h3c5rm: [
"f7pw515",
"fw35ms5"
],
B9xav0g: "frpde29",
zhjwy3: [
"fw35ms5",
"f7pw515"
]
},
"outline-severe": {
sj55zd: "f1l8vj45"
},
"outline-subtle": {
sj55zd: "fonrgv7"
},
"outline-success": {
sj55zd: "f1m7fhi8",
g2u3we: "f1mmhl11",
h3c5rm: [
"f1tjpp2f",
"f1ocn5n7"
],
B9xav0g: "f1gjv25d",
zhjwy3: [
"f1ocn5n7",
"f1tjpp2f"
]
},
"outline-warning": {
sj55zd: "fpti2h4"
},
tint: {},
"tint-brand": {
De3pzq: "f16xkysk",
sj55zd: "faj9fo0",
g2u3we: "f161y7kd",
h3c5rm: [
"f1c8dzaj",
"f1sl6hi9"
],
B9xav0g: "f1619yhw",
zhjwy3: [
"f1sl6hi9",
"f1c8dzaj"
]
},
"tint-danger": {
De3pzq: "ff0poqj",
sj55zd: "f1hcrxcs",
g2u3we: "f1oqjm8o",
h3c5rm: [
"fkgrb8g",
"frb5wm0"
],
B9xav0g: "f1iai1ph",
zhjwy3: [
"frb5wm0",
"fkgrb8g"
]
},
"tint-important": {
De3pzq: "f945g0u",
sj55zd: "fr0bkrk",
g2u3we: "fghlq4f",
h3c5rm: [
"f1gn591s",
"fjscplz"
],
B9xav0g: "fb073pr",
zhjwy3: [
"fjscplz",
"f1gn591s"
]
},
"tint-informative": {
De3pzq: "f1ctqxl6",
sj55zd: "f11d4kpn",
g2u3we: "f68mrw8",
h3c5rm: [
"f7pw515",
"fw35ms5"
],
B9xav0g: "frpde29",
zhjwy3: [
"fw35ms5",
"f7pw515"
]
},
"tint-severe": {
De3pzq: "f1xzsg4",
sj55zd: "f1k5f75o",
g2u3we: "fxy9dsj",
h3c5rm: [
"f54u6j2",
"fcm23ze"
],
B9xav0g: "f4vf0uq",
zhjwy3: [
"fcm23ze",
"f54u6j2"
]
},
"tint-subtle": {
De3pzq: "fxugw4r",
sj55zd: "f11d4kpn",
g2u3we: "f68mrw8",
h3c5rm: [
"f7pw515",
"fw35ms5"
],
B9xav0g: "frpde29",
zhjwy3: [
"fw35ms5",
"f7pw515"
]
},
"tint-success": {
De3pzq: "f2vsrz6",
sj55zd: "ffmvakt",
g2u3we: "fdmic9h",
h3c5rm: [
"f196y6m",
"fetptd8"
],
B9xav0g: "f1pev5xq",
zhjwy3: [
"fetptd8",
"f196y6m"
]
},
"tint-warning": {
De3pzq: "f10s6hli",
sj55zd: "f42v8de",
g2u3we: "fn9i3n",
h3c5rm: [
"f1aw8cx4",
"f51if14"
],
B9xav0g: "fvq8iai",
zhjwy3: [
"f51if14",
"f1aw8cx4"
]
}
}, {
d: [
".fk6fouc{font-family:var(--fontFamilyBase);}",
".f13mqy1h{font-size:var(--fontSizeBase100);}",
".fl43uef{font-weight:var(--fontWeightSemibold);}",
".fcpl73t{line-height:var(--lineHeightBase100);}",
".f16dn6v3{width:6px;}",
".f3mu39s{height:6px;}",
".f130uwy9{font-size:4px;}",
".fod1mrr{line-height:4px;}",
".f18p0k4z{min-width:unset;}",
[
".f19jm9xf{padding:unset;}",
{
p: -1
}
],
".fpd43o0{width:10px;}",
".f30q22z{height:10px;}",
".f1tccstq{font-size:6px;}",
".f1y3arg5{line-height:6px;}",
[
".f19jm9xf{padding:unset;}",
{
p: -1
}
],
".fjw5fx7{width:16px;}",
".fd461yt{height:16px;}",
[
".fupdldz{padding:0 calc(var(--spacingHorizontalXXS) + var(--spacingHorizontalXXS));}",
{
p: -1
}
],
".fq4mcun{width:24px;}",
".frvgh55{height:24px;}",
[
".f1996nqw{padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));}",
{
p: -1
}
],
".f1szoe96{width:32px;}",
".f1d2rq10{height:32px;}",
[
".fty64o7{padding:0 calc(var(--spacingHorizontalSNudge) + var(--spacingHorizontalXXS));}",
{
p: -1
}
],
[
".f1fabniw{border-radius:var(--borderRadiusNone);}",
{
p: -1
}
],
[
".ft85np5{border-radius:var(--borderRadiusMedium);}",
{
p: -1
}
],
[
".fq9zq91{border-radius:var(--borderRadiusSmall);}",
{
p: -1
}
],
".f10ludwy::after{display:none;}",
".ffp7eso{background-color:var(--colorBrandBackground);}",
".f1phragk{color:var(--colorNeutralForegroundOnBrand);}",
".fdl5y0r{background-color:var(--colorPaletteRedBackground3);}",
".f1c73kur{background-color:var(--colorNeutralForeground1);}",
".fr0bkrk{color:var(--colorNeutralBackground1);}",
".f3vzo32{background-color:var(--colorNeutralBackground5);}",
".f11d4kpn{color:var(--colorNeutralForeground3);}",
".f1s438gw{background-color:var(--colorPaletteDarkOrangeBackground3);}",
".fxugw4r{background-color:var(--colorNeutralBackground1);}",
".f19n0e5{color:var(--colorNeutralForeground1);}",
".flxk52p{background-color:var(--colorPaletteGreenBackground3);}",
".ffq97bm{background-color:var(--colorPaletteYellowBackground3);}",
".ff5vbop{color:var(--colorNeutralForeground1Static);}",
".f16muhyy{color:var(--colorBrandForeground1);}",
".f1whyuy6{color:var(--colorPaletteRedForeground3);}",
".f1l8vj45{color:var(--colorPaletteDarkOrangeForeground3);}",
".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}",
".f1m7fhi8{color:var(--colorPaletteGreenForeground3);}",
".fpti2h4{color:var(--colorPaletteYellowForeground2);}",
".f23ftbb{border-top-color:currentColor;}",
".f1gkuv52{border-right-color:currentColor;}",
".f1p1bl80{border-left-color:currentColor;}",
".fioka3i{border-bottom-color:currentColor;}",
".fyqpifd{border-top-color:var(--colorPaletteRedBorder2);}",
".f3ukxca{border-right-color:var(--colorPaletteRedBorder2);}",
".f1k7dugc{border-left-color:var(--colorPaletteRedBorder2);}",
".f1njxb2b{border-bottom-color:var(--colorPaletteRedBorder2);}",
".fq0vr37{border-top-color:var(--colorNeutralStrokeAccessible);}",
".f1byw159{border-right-color:var(--colorNeutralStrokeAccessible);}",
".f11cr0be{border-left-color:var(--colorNeutralStrokeAccessible);}",
".f1c1zstj{border-bottom-color:var(--colorNeutralStrokeAccessible);}",
".f68mrw8{border-top-color:var(--colorNeutralStroke2);}",
".f7pw515{border-right-color:var(--colorNeutralStroke2);}",
".fw35ms5{border-left-color:var(--colorNeutralStroke2);}",
".frpde29{border-bottom-color:var(--colorNeutralStroke2);}",
".f1mmhl11{border-top-color:var(--colorPaletteGreenBorder2);}",
".f1tjpp2f{border-right-color:var(--colorPaletteGreenBorder2);}",
".f1ocn5n7{border-left-color:var(--colorPaletteGreenBorder2);}",
".f1gjv25d{border-bottom-color:var(--colorPaletteGreenBorder2);}",
".f16xkysk{background-color:var(--colorBrandBackground2);}",
".faj9fo0{color:var(--colorBrandForeground2);}",
".f161y7kd{border-top-color:var(--colorBrandStroke2);}",
".f1c8dzaj{border-right-color:var(--colorBrandStroke2);}",
".f1sl6hi9{border-left-color:var(--colorBrandStroke2);}",
".f1619yhw{border-bottom-color:var(--colorBrandStroke2);}",
".ff0poqj{background-color:var(--colorPaletteRedBackground1);}",
".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
".f1oqjm8o{border-top-color:var(--colorPaletteRedBorder1);}",
".fkgrb8g{border-right-color:var(--colorPaletteRedBorder1);}",
".frb5wm0{border-left-color:var(--colorPaletteRedBorder1);}",
".f1iai1ph{border-bottom-color:var(--colorPaletteRedBorder1);}",
".f945g0u{background-color:var(--colorNeutralForeground3);}",
".fghlq4f{border-top-color:var(--colorTransparentStroke);}",
".f1gn591s{border-right-color:var(--colorTransparentStroke);}",
".fjscplz{border-left-color:var(--colorTransparentStroke);}",
".fb073pr{border-bottom-color:var(--colorTransparentStroke);}",
".f1ctqxl6{background-color:var(--colorNeutralBackground4);}",
".f1xzsg4{background-color:var(--colorPaletteDarkOrangeBackground1);}",
".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}",
".fxy9dsj{border-top-color:var(--colorPaletteDarkOrangeBorder1);}",
".f54u6j2{border-right-color:var(--colorPaletteDarkOrangeBorder1);}",
".fcm23ze{border-left-color:var(--colorPaletteDarkOrangeBorder1);}",
".f4vf0uq{border-bottom-color:var(--colorPaletteDarkOrangeBorder1);}",
".f2vsrz6{background-color:var(--colorPaletteGreenBackground1);}",
".ffmvakt{color:var(--colorPaletteGreenForeground1);}",
".fdmic9h{border-top-color:var(--colorPaletteGreenBorder1);}",
".f196y6m{border-right-color:var(--colorPaletteGreenBorder1);}",
".fetptd8{border-left-color:var(--colorPaletteGreenBorder1);}",
".f1pev5xq{border-bottom-color:var(--colorPaletteGreenBorder1);}",
".f10s6hli{background-color:var(--colorPaletteYellowBackground1);}",
".f42v8de{color:var(--colorPaletteYellowForeground1);}",
".fn9i3n{border-top-color:var(--colorPaletteYellowBorder1);}",
".f1aw8cx4{border-right-color:var(--colorPaletteYellowBorder1);}",
".f51if14{border-left-color:var(--colorPaletteYellowBorder1);}",
".fvq8iai{border-bottom-color:var(--colorPaletteYellowBorder1);}"
]
});
const useIconRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rttl5z0", null, [
".rttl5z0{display:flex;line-height:1;margin:0 calc(-1 * var(--spacingHorizontalXXS));font-size:12px;}"
]);
const useIconStyles = /*#__PURE__*/ (0, _react.__styles)({
beforeText: {
t21cq0: [
"f1t8l4o1",
"f11juvx6"
]
},
afterText: {
Frg6f3: [
"f11juvx6",
"f1t8l4o1"
]
},
beforeTextXL: {
t21cq0: [
"f1rs9grm",
"f1kwmkpi"
]
},
afterTextXL: {
Frg6f3: [
"f1kwmkpi",
"f1rs9grm"
]
},
tiny: {
Be2twd7: "f1tccstq"
},
"extra-small": {
Be2twd7: "fnmn6fi"
},
small: {
Be2twd7: "f1ugzwwg"
},
medium: {},
large: {
Be2twd7: "f4ybsrx"
},
"extra-large": {
Be2twd7: "fe5j1ua"
}
}, {
d: [
".f1t8l4o1{margin-right:calc(var(--spacingHorizontalXXS) + var(--spacingHorizontalXXS));}",
".f11juvx6{margin-left:calc(var(--spacingHorizontalXXS) + var(--spacingHorizontalXXS));}",
".f1rs9grm{margin-right:calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));}",
".f1kwmkpi{margin-left:calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));}",
".f1tccstq{font-size:6px;}",
".fnmn6fi{font-size:10px;}",
".f1ugzwwg{font-size:12px;}",
".f4ybsrx{font-size:16px;}",
".fe5j1ua{font-size:20px;}"
]
});
const useBadgeStyles_unstable = (state)=>{
'use no memo';
const rootClassName = useRootClassName();
const rootStyles = useRootStyles();
const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';
state.root.className = (0, _react.mergeClasses)(badgeClassNames.root, rootClassName, smallToTiny && rootStyles.fontSmallToTiny, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny, state.appearance === 'ghost' && rootStyles.borderGhost, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);
const iconRootClassName = useIconRootClassName();
const iconStyles = useIconStyles();
if (state.icon) {
let iconPositionClass;
if (state.root.children) {
if (state.size === 'extra-large') {
iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;
} else {
iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;
}
}
state.icon.className = (0, _react.mergeClasses)(badgeClassNames.icon, iconRootClassName, iconPositionClass, iconStyles[state.size], state.icon.className);
}
return state;
};
File diff suppressed because one or more lines are too long
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "CounterBadge", {
enumerable: true,
get: function() {
return CounterBadge;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useCounterBadge = require("./useCounterBadge");
const _useCounterBadgeStylesstyles = require("./useCounterBadgeStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _index = require("../Badge/index");
const CounterBadge = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useCounterBadge.useCounterBadge_unstable)(props, ref);
(0, _useCounterBadgeStylesstyles.useCounterBadgeStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useCounterBadgeStyles_unstable')(state);
return (0, _index.renderBadge_unstable)(state);
});
CounterBadge.displayName = 'CounterBadge';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CounterBadge/CounterBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCounterBadge_unstable } from './useCounterBadge';\nimport { useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps } from './CounterBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.\n */\nexport const CounterBadge: ForwardRefComponent<CounterBadgeProps> = React.forwardRef((props, ref) => {\n const state = useCounterBadge_unstable(props, ref);\n\n useCounterBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCounterBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nCounterBadge.displayName = 'CounterBadge';\n"],"names":["CounterBadge","React","forwardRef","props","ref","state","useCounterBadge_unstable","useCounterBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;iCACkB;6CACM;qCACH;uBACP;AAO9B,MAAMA,eAAAA,WAAAA,GAAuDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQC,IAAAA,yCAAAA,EAAyBH,OAAOC;IAE9CG,IAAAA,2DAAAA,EAA+BF;IAE/BG,IAAAA,gDAAAA,EAA4B,kCAAkCH;IAE9D,OAAOI,IAAAA,2BAAAA,EAAqBJ;AAC9B;AAEAL,aAAaU,WAAW,GAAG"}
@@ -0,0 +1,4 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CounterBadge/CounterBadge.types.ts"],"sourcesContent":["import type { BadgeProps, BadgeState } from '../Badge/index';\n\nexport type CounterBadgeProps = Omit<BadgeProps, 'appearance' | 'color' | 'shape'> & {\n /**\n * A Badge can have different appearances that emphasize certain parts of it:\n * - filled: The default appearance if one is not specified.\n * The badge background is filled with color with a contrasting foreground text to match.\n * - ghost: The badge background is transparent, with the foreground text taking color to emphasize it.\n * @default filled\n */\n appearance?: 'filled' | 'ghost';\n\n /**\n * Semantic colors for a counter badge\n * @default brand\n */\n color?: Extract<BadgeProps['color'], 'brand' | 'danger' | 'important' | 'informative'>;\n\n /**\n * Value displayed by the Badge\n * @default 0\n */\n count?: number;\n\n /**\n * If a dot should be displayed without the count\n * @default false\n */\n dot?: boolean;\n\n /**\n * Max number to be displayed\n * @default 99\n */\n overflowCount?: number;\n\n /**\n * A Badge can be circular or rounded\n * @default circular\n */\n shape?: 'circular' | 'rounded';\n\n /**\n * If the badge should be shown when count is 0\n * @default false\n */\n showZero?: boolean;\n};\n\nexport type CounterBadgeState = Omit<BadgeState, 'appearance' | 'color' | 'shape'> &\n Required<Pick<CounterBadgeProps, 'appearance' | 'color' | 'count' | 'dot' | 'shape' | 'showZero'>>;\n"],"names":[],"rangeMappings":"","mappings":""}
@@ -0,0 +1,27 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
CounterBadge: function() {
return _CounterBadge.CounterBadge;
},
counterBadgeClassNames: function() {
return _useCounterBadgeStylesstyles.counterBadgeClassNames;
},
useCounterBadgeStyles_unstable: function() {
return _useCounterBadgeStylesstyles.useCounterBadgeStyles_unstable;
},
useCounterBadge_unstable: function() {
return _useCounterBadge.useCounterBadge_unstable;
}
});
const _CounterBadge = require("./CounterBadge");
const _useCounterBadge = require("./useCounterBadge");
const _useCounterBadgeStylesstyles = require("./useCounterBadgeStyles.styles");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CounterBadge/index.ts"],"sourcesContent":["export { CounterBadge } from './CounterBadge';\nexport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\nexport { useCounterBadge_unstable } from './useCounterBadge';\nexport { counterBadgeClassNames, useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\n"],"names":["CounterBadge","counterBadgeClassNames","useCounterBadgeStyles_unstable","useCounterBadge_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,YAAY;eAAZA,0BAAY;;IAGZC,sBAAsB;eAAtBA,mDAAsB;;IAAEC,8BAA8B;eAA9BA,2DAA8B;;IADtDC,wBAAwB;eAAxBA,yCAAwB;;;8BAFJ;iCAEY;6CAC8B"}
@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCounterBadge_unstable", {
enumerable: true,
get: function() {
return useCounterBadge_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _index = require("../Badge/index");
const useCounterBadge_unstable = (props, ref)=>{
const { shape = 'circular', appearance = 'filled', showZero = false, overflowCount = 99, count = 0, dot = false } = props;
const state = {
...(0, _index.useBadge_unstable)(props, ref),
shape,
appearance,
showZero,
count,
dot
};
if ((count !== 0 || showZero) && !dot && !state.root.children) {
state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;
}
return state;
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/CounterBadge/useCounterBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport type { BadgeState } from '../Badge/index';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useCounterBadge_unstable = (props: CounterBadgeProps, ref: React.Ref<HTMLElement>): CounterBadgeState => {\n const {\n shape = 'circular',\n appearance = 'filled',\n showZero = false,\n overflowCount = 99,\n count = 0,\n dot = false,\n } = props;\n\n const state: CounterBadgeState = {\n ...(useBadge_unstable(props, ref) as Pick<CounterBadgeState, keyof BadgeState>),\n shape,\n appearance,\n showZero,\n count,\n dot,\n };\n\n if ((count !== 0 || showZero) && !dot && !state.root.children) {\n state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;\n }\n\n return state;\n};\n"],"names":["useCounterBadge_unstable","props","ref","shape","appearance","showZero","overflowCount","count","dot","state","useBadge_unstable","root","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;uBAEW;AAM3B,MAAMA,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EACJC,QAAQ,UAAU,EAClBC,aAAa,QAAQ,EACrBC,WAAW,KAAK,EAChBC,gBAAgB,EAAE,EAClBC,QAAQ,CAAC,EACTC,MAAM,KAAK,EACZ,GAAGP;IAEJ,MAAMQ,QAA2B;QAC/B,GAAIC,IAAAA,wBAAAA,EAAkBT,OAAOC,IAAI;QACjCC;QACAC;QACAC;QACAE;QACAC;IACF;IAEA,IAAI,AAACD,CAAAA,UAAU,KAAKF,QAAAA,KAAa,CAACG,OAAO,CAACC,MAAME,IAAI,CAACC,QAAQ,EAAE;QAC7DH,MAAME,IAAI,CAACC,QAAQ,GAAGL,QAAQD,gBAAgB,CAAC,EAAEA,cAAc,CAAC,CAAC,GAAG,CAAC,EAAEC,MAAM,CAAC;IAChF;IAEA,OAAOE;AACT"}
@@ -0,0 +1,61 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
counterBadgeClassNames: function() {
return counterBadgeClassNames;
},
useCounterBadgeStyles_unstable: function() {
return useCounterBadgeStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useBadgeStylesstyles = require("../Badge/useBadgeStyles.styles");
const counterBadgeClassNames = {
root: 'fui-CounterBadge',
icon: 'fui-CounterBadge__icon'
};
const useStyles = /*#__PURE__*/ (0, _react.__styles)({
dot: {
Bf4jedk: "fgfkb25",
a9b677: "f16dn6v3",
Bqenvij: "f3mu39s",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1mk8lai"
},
hide: {
mc9l5x: "fjseox"
}
}, {
d: [
".fgfkb25{min-width:auto;}",
".f16dn6v3{width:6px;}",
".f3mu39s{height:6px;}",
[
".f1mk8lai{padding:0;}",
{
p: -1
}
],
".fjseox{display:none;}"
]
});
const useCounterBadgeStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(counterBadgeClassNames.root, state.dot && styles.dot, !state.root.children && !state.dot && styles.hide, state.root.className);
if (state.icon) {
state.icon.className = (0, _react.mergeClasses)(counterBadgeClassNames.icon, state.icon.className);
}
return (0, _useBadgeStylesstyles.useBadgeStyles_unstable)(state);
};
@@ -0,0 +1 @@
{"version":3,"sources":["useCounterBadgeStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { useBadgeStyles_unstable } from '../Badge/useBadgeStyles.styles';\nexport const counterBadgeClassNames = {\n root: 'fui-CounterBadge',\n icon: 'fui-CounterBadge__icon'\n};\nconst useStyles = makeStyles({\n dot: {\n minWidth: 'auto',\n width: '6px',\n height: '6px',\n padding: '0'\n },\n hide: {\n display: 'none'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useCounterBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(counterBadgeClassNames.root, state.dot && styles.dot, !state.root.children && !state.dot && styles.hide, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(counterBadgeClassNames.icon, state.icon.className);\n }\n return useBadgeStyles_unstable(state);\n};\n"],"names":["counterBadgeClassNames","useCounterBadgeStyles_unstable","root","icon","useStyles","__styles","dot","Bf4jedk","a9b677","Bqenvij","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","hide","mc9l5x","d","p","state","styles","className","mergeClasses","children","useBadgeStyles_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEaA,sBAAsB;eAAtBA;;IAiBIC,8BAA8B;eAA9BA;;;uBAnBwB;sCACD;AACjC,MAAMD,yBAAyB;IAClCE,MAAM;IACNC,MAAM;AACV;AACA,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAC,KAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;IAAA;IAAAC,MAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;KAAA;AAAA;AAaP,MAAMjB,iCAAkCkB,CAAAA;IAC/C;IACA,MAAMC,SAAShB;IACfe,MAAMjB,IAAI,CAACmB,SAAS,GAAGC,IAAAA,mBAAY,EAACtB,uBAAuBE,IAAI,EAAEiB,MAAMb,GAAG,IAAIc,OAAOd,GAAG,EAAE,CAACa,MAAMjB,IAAI,CAACqB,QAAQ,IAAI,CAACJ,MAAMb,GAAG,IAAIc,OAAOL,IAAI,EAAEI,MAAMjB,IAAI,CAACmB,SAAS;IACjK,IAAIF,MAAMhB,IAAI,EAAE;QACZgB,MAAMhB,IAAI,CAACkB,SAAS,GAAGC,IAAAA,mBAAY,EAACtB,uBAAuBG,IAAI,EAAEgB,MAAMhB,IAAI,CAACkB,SAAS;IACzF;IACA,OAAOG,IAAAA,6CAAuB,EAACL;AACnC"}
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "PresenceBadge", {
enumerable: true,
get: function() {
return PresenceBadge;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _usePresenceBadge = require("./usePresenceBadge");
const _usePresenceBadgeStylesstyles = require("./usePresenceBadgeStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _Badge = require("../../Badge");
const PresenceBadge = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _usePresenceBadge.usePresenceBadge_unstable)(props, ref);
(0, _usePresenceBadgeStylesstyles.usePresenceBadgeStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('usePresenceBadgeStyles_unstable')(state);
return (0, _Badge.renderBadge_unstable)(state);
});
PresenceBadge.displayName = 'PresenceBadge';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PresenceBadge/PresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePresenceBadge_unstable } from './usePresenceBadge';\nimport { usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../../Badge';\nimport type { PresenceBadgeProps } from './PresenceBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const PresenceBadge: ForwardRefComponent<PresenceBadgeProps> = React.forwardRef((props, ref) => {\n const state = usePresenceBadge_unstable(props, ref);\n\n usePresenceBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('usePresenceBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nPresenceBadge.displayName = 'PresenceBadge';\n"],"names":["PresenceBadge","React","forwardRef","props","ref","state","usePresenceBadge_unstable","usePresenceBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;kCACmB;8CACM;qCACJ;uBACP;AAO9B,MAAMA,gBAAAA,WAAAA,GAAyDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQC,IAAAA,2CAAAA,EAA0BH,OAAOC;IAE/CG,IAAAA,6DAAAA,EAAgCF;IAEhCG,IAAAA,gDAAAA,EAA4B,mCAAmCH;IAE/D,OAAOI,IAAAA,2BAAAA,EAAqBJ;AAC9B;AAEAL,cAAcU,WAAW,GAAG"}
@@ -0,0 +1,4 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PresenceBadge/PresenceBadge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState, BadgeSlots } from '../Badge/Badge.types';\n\nexport type PresenceBadgeStatus =\n | 'busy'\n | 'out-of-office'\n | 'away'\n | 'available'\n | 'offline'\n | 'do-not-disturb'\n | 'unknown'\n | 'blocked';\n\nexport type PresenceBadgeProps = Omit<ComponentProps<Pick<BadgeSlots, 'root' | 'icon'>>, 'color'> &\n Pick<BadgeProps, 'size'> & {\n /**\n * Represents several status\n * @default available\n */\n status?: PresenceBadgeStatus;\n\n /**\n * Modifies the display to indicate that the user is out of office.\n * This can be combined with any status to display an out-of-office version of that status\n * @default false\n */\n outOfOffice?: boolean;\n };\n\nexport type PresenceBadgeState = ComponentState<BadgeSlots> &\n BadgeState &\n Required<Pick<PresenceBadgeProps, 'status' | 'outOfOffice'>>;\n"],"names":[],"rangeMappings":"","mappings":""}
@@ -0,0 +1,61 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
PresenceBadge: function() {
return _PresenceBadge.PresenceBadge;
},
presenceAvailableFilled: function() {
return _presenceIcons.presenceAvailableFilled;
},
presenceAvailableRegular: function() {
return _presenceIcons.presenceAvailableRegular;
},
presenceAwayFilled: function() {
return _presenceIcons.presenceAwayFilled;
},
presenceAwayRegular: function() {
return _presenceIcons.presenceAwayRegular;
},
presenceBadgeClassNames: function() {
return _usePresenceBadgeStylesstyles.presenceBadgeClassNames;
},
presenceBlockedRegular: function() {
return _presenceIcons.presenceBlockedRegular;
},
presenceBusyFilled: function() {
return _presenceIcons.presenceBusyFilled;
},
presenceDndFilled: function() {
return _presenceIcons.presenceDndFilled;
},
presenceDndRegular: function() {
return _presenceIcons.presenceDndRegular;
},
presenceOfflineRegular: function() {
return _presenceIcons.presenceOfflineRegular;
},
presenceOofRegular: function() {
return _presenceIcons.presenceOofRegular;
},
presenceUnknownRegular: function() {
return _presenceIcons.presenceUnknownRegular;
},
usePresenceBadgeStyles_unstable: function() {
return _usePresenceBadgeStylesstyles.usePresenceBadgeStyles_unstable;
},
usePresenceBadge_unstable: function() {
return _usePresenceBadge.usePresenceBadge_unstable;
}
});
const _PresenceBadge = require("./PresenceBadge");
const _usePresenceBadge = require("./usePresenceBadge");
const _usePresenceBadgeStylesstyles = require("./usePresenceBadgeStyles.styles");
const _presenceIcons = require("./presenceIcons");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PresenceBadge/index.ts"],"sourcesContent":["export { PresenceBadge } from './PresenceBadge';\nexport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\nexport { usePresenceBadge_unstable } from './usePresenceBadge';\nexport { presenceBadgeClassNames, usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nexport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceAwayRegular,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\n"],"names":["PresenceBadge","presenceAvailableFilled","presenceAvailableRegular","presenceAwayFilled","presenceAwayRegular","presenceBadgeClassNames","presenceBlockedRegular","presenceBusyFilled","presenceDndFilled","presenceDndRegular","presenceOfflineRegular","presenceOofRegular","presenceUnknownRegular","usePresenceBadgeStyles_unstable","usePresenceBadge_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,aAAa;eAAbA,4BAAa;;IAKpBC,uBAAuB;eAAvBA,sCAAuB;;IACvBC,wBAAwB;eAAxBA,uCAAwB;;IACxBC,kBAAkB;eAAlBA,iCAAkB;;IAClBC,mBAAmB;eAAnBA,kCAAmB;;IALZC,uBAAuB;eAAvBA,qDAAuB;;IAM9BC,sBAAsB;eAAtBA,qCAAsB;;IACtBC,kBAAkB;eAAlBA,iCAAkB;;IAClBC,iBAAiB;eAAjBA,gCAAiB;;IACjBC,kBAAkB;eAAlBA,iCAAkB;;IAClBC,sBAAsB;eAAtBA,qCAAsB;;IACtBC,kBAAkB;eAAlBA,iCAAkB;;IAClBC,sBAAsB;eAAtBA,qCAAsB;;IAZUC,+BAA+B;eAA/BA,6DAA+B;;IADxDC,yBAAyB;eAAzBA,2CAAyB;;;+BAFJ;kCAEY;8CAC+B;+BAalE"}
@@ -0,0 +1,180 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
presenceAvailableFilled: function() {
return presenceAvailableFilled;
},
presenceAvailableRegular: function() {
return presenceAvailableRegular;
},
presenceAwayFilled: function() {
return presenceAwayFilled;
},
presenceAwayRegular: function() {
return presenceAwayRegular;
},
presenceBlockedRegular: function() {
return presenceBlockedRegular;
},
presenceBusyFilled: function() {
return presenceBusyFilled;
},
presenceDndFilled: function() {
return presenceDndFilled;
},
presenceDndRegular: function() {
return presenceDndRegular;
},
presenceOfflineRegular: function() {
return presenceOfflineRegular;
},
presenceOofRegular: function() {
return presenceOofRegular;
},
presenceUnknownRegular: function() {
return presenceUnknownRegular;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reacticons = require("@fluentui/react-icons");
const presenceAwayRegular = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceAway10Regular,
'extra-small': _reacticons.PresenceAway10Regular,
small: _reacticons.PresenceAway12Regular,
medium: _reacticons.PresenceAway16Regular,
large: _reacticons.PresenceAway20Regular,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceAway20Regular
};
const presenceAwayFilled = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceAway10Filled,
'extra-small': _reacticons.PresenceAway10Filled,
small: _reacticons.PresenceAway12Filled,
medium: _reacticons.PresenceAway16Filled,
large: _reacticons.PresenceAway20Filled,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceAway20Filled
};
const presenceAvailableRegular = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceAvailable10Regular,
'extra-small': _reacticons.PresenceAvailable10Regular,
small: _reacticons.PresenceAvailable12Regular,
medium: _reacticons.PresenceAvailable16Regular,
large: _reacticons.PresenceAvailable20Regular,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceAvailable20Regular
};
const presenceAvailableFilled = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceAvailable10Filled,
'extra-small': _reacticons.PresenceAvailable10Filled,
small: _reacticons.PresenceAvailable12Filled,
medium: _reacticons.PresenceAvailable16Filled,
large: _reacticons.PresenceAvailable20Filled,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceAvailable20Filled
};
const presenceBlockedRegular = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceBlocked10Regular,
'extra-small': _reacticons.PresenceBlocked10Regular,
small: _reacticons.PresenceBlocked12Regular,
medium: _reacticons.PresenceBlocked16Regular,
large: _reacticons.PresenceBlocked20Regular,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceBlocked20Regular
};
const presenceBusyFilled = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceBusy10Filled,
'extra-small': _reacticons.PresenceBusy10Filled,
small: _reacticons.PresenceBusy12Filled,
medium: _reacticons.PresenceBusy16Filled,
large: _reacticons.PresenceBusy20Filled,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceBusy20Filled
};
const presenceDndFilled = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceDnd10Filled,
'extra-small': _reacticons.PresenceDnd10Filled,
small: _reacticons.PresenceDnd12Filled,
medium: _reacticons.PresenceDnd16Filled,
large: _reacticons.PresenceDnd20Filled,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceDnd20Filled
};
const presenceDndRegular = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceDnd10Regular,
'extra-small': _reacticons.PresenceDnd10Regular,
small: _reacticons.PresenceDnd12Regular,
medium: _reacticons.PresenceDnd16Regular,
large: _reacticons.PresenceDnd20Regular,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceDnd20Regular
};
const presenceOofRegular = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceOof10Regular,
'extra-small': _reacticons.PresenceOof10Regular,
small: _reacticons.PresenceOof12Regular,
medium: _reacticons.PresenceOof16Regular,
large: _reacticons.PresenceOof20Regular,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceOof20Regular
};
const presenceOfflineRegular = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceOffline10Regular,
'extra-small': _reacticons.PresenceOffline10Regular,
small: _reacticons.PresenceOffline12Regular,
medium: _reacticons.PresenceOffline16Regular,
large: _reacticons.PresenceOffline20Regular,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceOffline20Regular
};
const presenceUnknownRegular = {
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
tiny: _reacticons.PresenceUnknown10Regular,
'extra-small': _reacticons.PresenceUnknown10Regular,
small: _reacticons.PresenceUnknown12Regular,
medium: _reacticons.PresenceUnknown16Regular,
large: _reacticons.PresenceUnknown20Regular,
// FIXME not all presence icon sizes are available
// https://github.com/microsoft/fluentui/issues/20650
'extra-large': _reacticons.PresenceUnknown20Regular
};
File diff suppressed because one or more lines are too long
@@ -0,0 +1,69 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "usePresenceBadge_unstable", {
enumerable: true,
get: function() {
return usePresenceBadge_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _presenceIcons = require("./presenceIcons");
const _index = require("../Badge/index");
const iconMap = (status, outOfOffice, size)=>{
switch(status){
case 'available':
return outOfOffice ? _presenceIcons.presenceAvailableRegular[size] : _presenceIcons.presenceAvailableFilled[size];
case 'away':
return outOfOffice ? _presenceIcons.presenceOofRegular[size] : _presenceIcons.presenceAwayFilled[size];
case 'blocked':
return _presenceIcons.presenceBlockedRegular[size];
case 'busy':
return outOfOffice ? _presenceIcons.presenceUnknownRegular[size] : _presenceIcons.presenceBusyFilled[size];
case 'do-not-disturb':
return outOfOffice ? _presenceIcons.presenceDndRegular[size] : _presenceIcons.presenceDndFilled[size];
case 'offline':
return outOfOffice ? _presenceIcons.presenceOofRegular[size] : _presenceIcons.presenceOfflineRegular[size];
case 'out-of-office':
return _presenceIcons.presenceOofRegular[size];
case 'unknown':
return _presenceIcons.presenceUnknownRegular[size];
}
};
const DEFAULT_STRINGS = {
busy: 'busy',
'out-of-office': 'out of office',
away: 'away',
available: 'available',
offline: 'offline',
'do-not-disturb': 'do not disturb',
unknown: 'unknown',
blocked: 'blocked'
};
const usePresenceBadge_unstable = (props, ref)=>{
const { size = 'medium', status = 'available', outOfOffice = false } = props;
const statusText = DEFAULT_STRINGS[status];
const oofText = props.outOfOffice && props.status !== 'out-of-office' ? ` ${DEFAULT_STRINGS['out-of-office']}` : '';
const IconElement = iconMap(status, outOfOffice, size);
const state = {
...(0, _index.useBadge_unstable)({
'aria-label': statusText + oofText,
role: 'img',
...props,
size,
icon: _reactutilities.slot.optional(props.icon, {
defaultProps: {
children: IconElement ? /*#__PURE__*/ _react.createElement(IconElement, null) : null
},
renderByDefault: true,
elementType: 'span'
})
}, ref),
status,
outOfOffice
};
return state;
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PresenceBadge/usePresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types';\n\nconst iconMap = (status: PresenceBadgeState['status'], outOfOffice: boolean, size: PresenceBadgeState['size']) => {\n switch (status) {\n case 'available':\n return outOfOffice ? presenceAvailableRegular[size] : presenceAvailableFilled[size];\n case 'away':\n return outOfOffice ? presenceOofRegular[size] : presenceAwayFilled[size];\n case 'blocked':\n return presenceBlockedRegular[size];\n case 'busy':\n return outOfOffice ? presenceUnknownRegular[size] : presenceBusyFilled[size];\n case 'do-not-disturb':\n return outOfOffice ? presenceDndRegular[size] : presenceDndFilled[size];\n case 'offline':\n return outOfOffice ? presenceOofRegular[size] : presenceOfflineRegular[size];\n case 'out-of-office':\n return presenceOofRegular[size];\n case 'unknown':\n return presenceUnknownRegular[size];\n }\n};\n\nconst DEFAULT_STRINGS = {\n busy: 'busy',\n 'out-of-office': 'out of office',\n away: 'away',\n available: 'available',\n offline: 'offline',\n 'do-not-disturb': 'do not disturb',\n unknown: 'unknown',\n blocked: 'blocked',\n};\n\n/**\n * Returns the props and state required to render the component\n */\nexport const usePresenceBadge_unstable = (\n props: PresenceBadgeProps,\n ref: React.Ref<HTMLElement>,\n): PresenceBadgeState => {\n const { size = 'medium', status = 'available', outOfOffice = false } = props;\n\n const statusText = DEFAULT_STRINGS[status];\n const oofText = props.outOfOffice && props.status !== 'out-of-office' ? ` ${DEFAULT_STRINGS['out-of-office']}` : '';\n\n const IconElement = iconMap(status, outOfOffice, size);\n\n const state: PresenceBadgeState = {\n ...useBadge_unstable(\n {\n 'aria-label': statusText + oofText,\n role: 'img',\n ...props,\n size,\n icon: slot.optional(props.icon, {\n defaultProps: {\n children: IconElement ? <IconElement /> : null,\n },\n renderByDefault: true,\n elementType: 'span',\n }),\n },\n ref,\n ),\n status,\n outOfOffice,\n };\n\n return state;\n};\n"],"names":["usePresenceBadge_unstable","iconMap","status","outOfOffice","size","presenceAvailableRegular","presenceAvailableFilled","presenceOofRegular","presenceAwayFilled","presenceBlockedRegular","presenceUnknownRegular","presenceBusyFilled","presenceDndRegular","presenceDndFilled","presenceOfflineRegular","DEFAULT_STRINGS","busy","away","available","offline","unknown","blocked","props","ref","statusText","oofText","IconElement","state","useBadge_unstable","role","icon","slot","optional","defaultProps","children","React","createElement","renderByDefault","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAoDaA;;;eAAAA;;;;iEApDU;gCACF;+BAYd;uBAC2B;AAGlC,MAAMC,UAAU,CAACC,QAAsCC,aAAsBC;IAC3E,OAAQF;QACN,KAAK;YACH,OAAOC,cAAcE,uCAAwB,CAACD,KAAK,GAAGE,sCAAuB,CAACF,KAAK;QACrF,KAAK;YACH,OAAOD,cAAcI,iCAAkB,CAACH,KAAK,GAAGI,iCAAkB,CAACJ,KAAK;QAC1E,KAAK;YACH,OAAOK,qCAAsB,CAACL,KAAK;QACrC,KAAK;YACH,OAAOD,cAAcO,qCAAsB,CAACN,KAAK,GAAGO,iCAAkB,CAACP,KAAK;QAC9E,KAAK;YACH,OAAOD,cAAcS,iCAAkB,CAACR,KAAK,GAAGS,gCAAiB,CAACT,KAAK;QACzE,KAAK;YACH,OAAOD,cAAcI,iCAAkB,CAACH,KAAK,GAAGU,qCAAsB,CAACV,KAAK;QAC9E,KAAK;YACH,OAAOG,iCAAkB,CAACH,KAAK;QACjC,KAAK;YACH,OAAOM,qCAAsB,CAACN,KAAK;IACvC;AACF;AAEA,MAAMW,kBAAkB;IACtBC,MAAM;IACN,iBAAiB;IACjBC,MAAM;IACNC,WAAW;IACXC,SAAS;IACT,kBAAkB;IAClBC,SAAS;IACTC,SAAS;AACX;AAKO,MAAMrB,4BAA4B,CACvCsB,OACAC;IAEA,MAAM,EAAEnB,OAAO,QAAQ,EAAEF,SAAS,WAAW,EAAEC,cAAc,KAAK,EAAE,GAAGmB;IAEvE,MAAME,aAAaT,eAAe,CAACb,OAAO;IAC1C,MAAMuB,UAAUH,MAAMnB,WAAW,IAAImB,MAAMpB,MAAM,KAAK,kBAAkB,CAAC,CAAC,EAAEa,eAAe,CAAC,gBAAgB,CAAC,CAAC,GAAG;IAEjH,MAAMW,cAAczB,QAAQC,QAAQC,aAAaC;IAEjD,MAAMuB,QAA4B;QAChC,GAAGC,IAAAA,wBAAAA,EACD;YACE,cAAcJ,aAAaC;YAC3BI,MAAM;YACN,GAAGP,KAAK;YACRlB;YACA0B,MAAMC,oBAAAA,CAAKC,QAAQ,CAACV,MAAMQ,IAAI,EAAE;gBAC9BG,cAAc;oBACZC,UAAUR,cAAAA,WAAAA,GAAcS,OAAAC,aAAA,CAACV,aAAAA,QAAiB;gBAC5C;gBACAW,iBAAiB;gBACjBC,aAAa;YACf;QACF,GACAf,IACD;QACDrB;QACAC;IACF;IAEA,OAAOwB;AACT"}
@@ -0,0 +1,118 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
presenceBadgeClassNames: function() {
return presenceBadgeClassNames;
},
usePresenceBadgeStyles_unstable: function() {
return usePresenceBadgeStyles_unstable;
}
});
const _react = require("@griffel/react");
const presenceBadgeClassNames = {
root: 'fui-PresenceBadge',
icon: 'fui-PresenceBadge__icon'
};
const getIsBusy = (status)=>{
if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {
return true;
}
return false;
};
const useRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r832ydo", null, [
".r832ydo{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;border-radius:var(--borderRadiusCircular);background-color:var(--colorNeutralBackground1);padding:1px;background-clip:content-box;}"
]);
const useIconClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r11ag4qr", null, [
".r11ag4qr{display:flex;margin:-1px;}"
]);
const useStyles = /*#__PURE__*/ (0, _react.__styles)({
statusBusy: {
sj55zd: "fvi85wt"
},
statusAway: {
sj55zd: "f14k8a89"
},
statusAvailable: {
sj55zd: "fqa5hgp"
},
statusOffline: {
sj55zd: "f11d4kpn"
},
statusOutOfOffice: {
sj55zd: "fdce8r3"
},
statusUnknown: {
sj55zd: "f11d4kpn"
},
outOfOffice: {
sj55zd: "fr0bkrk"
},
outOfOfficeAvailable: {
sj55zd: "fqa5hgp"
},
outOfOfficeBusy: {
sj55zd: "fvi85wt"
},
outOfOfficeUnknown: {
sj55zd: "f11d4kpn"
},
tiny: {
Bubjx69: "f9ikmtg",
a9b677: "f16dn6v3",
B2eet1l: "f1w2irj7",
B5pe6w7: "fab5kbq",
p4uzdd: "f1ms1d91"
},
large: {
Bubjx69: "f9ikmtg",
a9b677: "f64fuq3",
B5pe6w7: "f1vfi1yj",
p4uzdd: "f15s34gz"
},
extraLarge: {
Bubjx69: "f9ikmtg",
a9b677: "f1w9dchk",
B5pe6w7: "f14efy9b",
p4uzdd: "fhipgdu"
}
}, {
d: [
".fvi85wt{color:var(--colorPaletteRedBackground3);}",
".f14k8a89{color:var(--colorPaletteMarigoldBackground3);}",
".fqa5hgp{color:var(--colorPaletteLightGreenForeground3);}",
".f11d4kpn{color:var(--colorNeutralForeground3);}",
".fdce8r3{color:var(--colorPaletteBerryForeground3);}",
".fr0bkrk{color:var(--colorNeutralBackground1);}",
".f9ikmtg{aspect-ratio:1;}",
".f16dn6v3{width:6px;}",
".f1w2irj7{background-clip:unset;}",
".fab5kbq svg{width:6px!important;}",
".f1ms1d91 svg{height:6px!important;}",
".f64fuq3{width:20px;}",
".f1vfi1yj svg{width:20px!important;}",
".f15s34gz svg{height:20px!important;}",
".f1w9dchk{width:28px;}",
".f14efy9b svg{width:28px!important;}",
".fhipgdu svg{height:28px!important;}"
]
});
const usePresenceBadgeStyles_unstable = (state)=>{
'use no memo';
const rootClassName = useRootClassName();
const iconClassName = useIconClassName();
const styles = useStyles();
const isBusy = getIsBusy(state.status);
state.root.className = (0, _react.mergeClasses)(presenceBadgeClassNames.root, rootClassName, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.status === 'unknown' && styles.statusUnknown, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && (state.status === 'out-of-office' || state.status === 'away' || state.status === 'offline') && styles.statusOutOfOffice, state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);
if (state.icon) {
state.icon.className = (0, _react.mergeClasses)(presenceBadgeClassNames.icon, iconClassName, state.icon.className);
}
return state;
};
File diff suppressed because one or more lines are too long
+87
View File
@@ -0,0 +1,87 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Badge: function() {
return _Badge.Badge;
},
CounterBadge: function() {
return _CounterBadge.CounterBadge;
},
PresenceBadge: function() {
return _PresenceBadge.PresenceBadge;
},
badgeClassNames: function() {
return _Badge.badgeClassNames;
},
counterBadgeClassNames: function() {
return _CounterBadge.counterBadgeClassNames;
},
presenceAvailableFilled: function() {
return _PresenceBadge.presenceAvailableFilled;
},
presenceAvailableRegular: function() {
return _PresenceBadge.presenceAvailableRegular;
},
presenceAwayFilled: function() {
return _PresenceBadge.presenceAwayFilled;
},
presenceAwayRegular: function() {
return _PresenceBadge.presenceAwayRegular;
},
presenceBadgeClassNames: function() {
return _PresenceBadge.presenceBadgeClassNames;
},
presenceBlockedRegular: function() {
return _PresenceBadge.presenceBlockedRegular;
},
presenceBusyFilled: function() {
return _PresenceBadge.presenceBusyFilled;
},
presenceDndFilled: function() {
return _PresenceBadge.presenceDndFilled;
},
presenceDndRegular: function() {
return _PresenceBadge.presenceDndRegular;
},
presenceOfflineRegular: function() {
return _PresenceBadge.presenceOfflineRegular;
},
presenceOofRegular: function() {
return _PresenceBadge.presenceOofRegular;
},
presenceUnknownRegular: function() {
return _PresenceBadge.presenceUnknownRegular;
},
renderBadge_unstable: function() {
return _Badge.renderBadge_unstable;
},
useBadgeStyles_unstable: function() {
return _Badge.useBadgeStyles_unstable;
},
useBadge_unstable: function() {
return _Badge.useBadge_unstable;
},
useCounterBadgeStyles_unstable: function() {
return _CounterBadge.useCounterBadgeStyles_unstable;
},
useCounterBadge_unstable: function() {
return _CounterBadge.useCounterBadge_unstable;
},
usePresenceBadgeStyles_unstable: function() {
return _PresenceBadge.usePresenceBadgeStyles_unstable;
},
usePresenceBadge_unstable: function() {
return _PresenceBadge.usePresenceBadge_unstable;
}
});
const _Badge = require("./Badge");
const _PresenceBadge = require("./PresenceBadge");
const _CounterBadge = require("./CounterBadge");
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { Badge, badgeClassNames, renderBadge_unstable, useBadgeStyles_unstable, useBadge_unstable } from './Badge';\nexport type { BadgeProps, BadgeSlots, BadgeState } from './Badge';\nexport {\n PresenceBadge,\n presenceBadgeClassNames,\n usePresenceBadgeStyles_unstable,\n usePresenceBadge_unstable,\n presenceAwayRegular,\n presenceAwayFilled,\n presenceAvailableRegular,\n presenceAvailableFilled,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndRegular,\n presenceDndFilled,\n presenceOofRegular,\n presenceOfflineRegular,\n presenceUnknownRegular,\n} from './PresenceBadge';\nexport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge';\nexport {\n CounterBadge,\n counterBadgeClassNames,\n useCounterBadgeStyles_unstable,\n useCounterBadge_unstable,\n} from './CounterBadge';\nexport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge';\n"],"names":["Badge","CounterBadge","PresenceBadge","badgeClassNames","counterBadgeClassNames","presenceAvailableFilled","presenceAvailableRegular","presenceAwayFilled","presenceAwayRegular","presenceBadgeClassNames","presenceBlockedRegular","presenceBusyFilled","presenceDndFilled","presenceDndRegular","presenceOfflineRegular","presenceOofRegular","presenceUnknownRegular","renderBadge_unstable","useBadgeStyles_unstable","useBadge_unstable","useCounterBadgeStyles_unstable","useCounterBadge_unstable","usePresenceBadgeStyles_unstable","usePresenceBadge_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,KAAK;eAALA,YAAK;;IAqBZC,YAAY;eAAZA,0BAAY;;IAlBZC,aAAa;eAAbA,4BAAa;;IAHCC,eAAe;eAAfA,sBAAe;;IAsB7BC,sBAAsB;eAAtBA,oCAAsB;;IAZtBC,uBAAuB;eAAvBA,sCAAuB;;IADvBC,wBAAwB;eAAxBA,uCAAwB;;IADxBC,kBAAkB;eAAlBA,iCAAkB;;IADlBC,mBAAmB;eAAnBA,kCAAmB;;IAHnBC,uBAAuB;eAAvBA,sCAAuB;;IAOvBC,sBAAsB;eAAtBA,qCAAsB;;IACtBC,kBAAkB;eAAlBA,iCAAkB;;IAElBC,iBAAiB;eAAjBA,gCAAiB;;IADjBC,kBAAkB;eAAlBA,iCAAkB;;IAGlBC,sBAAsB;eAAtBA,qCAAsB;;IADtBC,kBAAkB;eAAlBA,iCAAkB;;IAElBC,sBAAsB;eAAtBA,qCAAsB;;IAjBSC,oBAAoB;eAApBA,2BAAoB;;IAAEC,uBAAuB;eAAvBA,8BAAuB;;IAAEC,iBAAiB;eAAjBA,wBAAiB;;IAuB/FC,8BAA8B;eAA9BA,4CAA8B;;IAC9BC,wBAAwB;eAAxBA,sCAAwB;;IAnBxBC,+BAA+B;eAA/BA,8CAA+B;;IAC/BC,yBAAyB;eAAzBA,wCAAyB;;;uBAN8E;+BAkBlG;8BAOA"}