@fluentui-react-native/persona-coin 0.16.0 → 0.16.3

package/lib/PersonaCoin.tokens.initialsBackground.js

@@ -2,26 +2,27 @@ import { styleFunction } from '@uifabricshared/foundation-tokens';
 import { convertCoinColor, convertCoinColorFluent, calculateEffectiveSizes } from './PersonaCoin.helpers';
 const _initialsBackgroundKeyProps = ['coinSize', 'size', 'coinColor', 'coinColorFluent', 'backgroundColor'];
 function _buildInitialsBackgroundStyles(tokenProps /*, theme: ITheme*/) {
-  const { physicalSize } = calculateEffectiveSizes(tokenProps);
-  const { backgroundColor, coinColor, coinColorFluent } = tokenProps;
-  let effectiveBackgroundColor = backgroundColor;
-  if (coinColorFluent) {
-    effectiveBackgroundColor = convertCoinColorFluent(coinColorFluent);
-  } else if (coinColor) {
-    effectiveBackgroundColor = convertCoinColor(coinColor);
-  }
-  return {
-    style: {
-      borderRadius: physicalSize / 2,
-      width: physicalSize,
-      height: physicalSize,
-      flexGrow: 1,
-      alignSelf: 'stretch',
-      justifyContent: 'center',
-      alignItems: 'center',
-      backgroundColor: effectiveBackgroundColor,
-    },
-  };
+    const { physicalSize } = calculateEffectiveSizes(tokenProps);
+    const { backgroundColor, coinColor, coinColorFluent } = tokenProps;
+    let effectiveBackgroundColor = backgroundColor;
+    if (coinColorFluent) {
+        effectiveBackgroundColor = convertCoinColorFluent(coinColorFluent);
+    }
+    else if (coinColor) {
+        effectiveBackgroundColor = convertCoinColor(coinColor);
+    }
+    return {
+        style: {
+            borderRadius: physicalSize / 2,
+            width: physicalSize,
+            height: physicalSize,
+            flexGrow: 1,
+            alignSelf: 'stretch',
+            justifyContent: 'center',
+            alignItems: 'center',
+            backgroundColor: effectiveBackgroundColor,
+        },
+    };
 }
 export const buildInitialsBackgroundStyles = styleFunction(_buildInitialsBackgroundStyles, _initialsBackgroundKeyProps);
-//# sourceMappingURL=PersonaCoin.tokens.initialsBackground.js.map
+//# sourceMappingURL=PersonaCoin.tokens.initialsBackground.js.map

package/lib/PersonaCoin.tokens.photo.d.ts

@@ -1,5 +1,5 @@
 import type { ImageProps } from 'react-native';
 import type { Theme } from '@fluentui-react-native/framework';
 import type { IPersonaCoinTokens } from './PersonaCoin.types';
-export declare const buildPhotoStyles: import('@fluentui-react-native/tokens').StyleFactoryFunction<ImageProps, IPersonaCoinTokens, Theme>;
-//# sourceMappingURL=PersonaCoin.tokens.photo.d.ts.map
+export declare const buildPhotoStyles: import("@fluentui-react-native/tokens").StyleFactoryFunction<ImageProps, IPersonaCoinTokens, Theme>;
+//# sourceMappingURL=PersonaCoin.tokens.photo.d.ts.map

package/lib/PersonaCoin.tokens.photo.js

@@ -2,16 +2,16 @@ import { styleFunction } from '@uifabricshared/foundation-tokens';
 import { calculateEffectiveSizes } from './PersonaCoin.helpers';
 const _photoKeyProps = ['coinSize', 'size'];
 function _buildPhotoStyles(tokenProps /*, theme: ITheme */) {
-  const { physicalSize } = calculateEffectiveSizes(tokenProps);
-  return {
-    source: {},
-    style: {
-      borderRadius: physicalSize / 2,
-      width: physicalSize,
-      height: physicalSize,
-    },
-    resizeMode: 'cover',
-  };
+    const { physicalSize } = calculateEffectiveSizes(tokenProps);
+    return {
+        source: {},
+        style: {
+            borderRadius: physicalSize / 2,
+            width: physicalSize,
+            height: physicalSize,
+        },
+        resizeMode: 'cover',
+    };
 }
 export const buildPhotoStyles = styleFunction(_buildPhotoStyles, _photoKeyProps);
-//# sourceMappingURL=PersonaCoin.tokens.photo.js.map
+//# sourceMappingURL=PersonaCoin.tokens.photo.js.map

package/lib/PersonaCoin.tokens.ring.d.ts

@@ -1,6 +1,6 @@
 import type { ViewProps } from 'react-native';
 import type { Theme } from '@fluentui-react-native/framework';
 import type { IPersonaCoinTokens } from './PersonaCoin.types';
-export declare const buildRingStyles: import('@fluentui-react-native/tokens').StyleFactoryFunction<ViewProps, IPersonaCoinTokens, Theme>;
-export declare const buildGlowStyles: import('@fluentui-react-native/tokens').StyleFactoryFunction<ViewProps, IPersonaCoinTokens, Theme>;
-//# sourceMappingURL=PersonaCoin.tokens.ring.d.ts.map
+export declare const buildRingStyles: import("@fluentui-react-native/tokens").StyleFactoryFunction<ViewProps, IPersonaCoinTokens, Theme>;
+export declare const buildGlowStyles: import("@fluentui-react-native/tokens").StyleFactoryFunction<ViewProps, IPersonaCoinTokens, Theme>;
+//# sourceMappingURL=PersonaCoin.tokens.ring.d.ts.map

package/lib/PersonaCoin.tokens.ring.js

@@ -2,49 +2,51 @@ import { styleFunction } from '@uifabricshared/foundation-tokens';
 import { getRingThickness, calculateEffectiveSizes } from './PersonaCoin.helpers';
 const _ringProps = ['coinSize', 'size', 'ring'];
 function _buildRingStyles(tokenProps, theme) {
-  const { physicalSize } = calculateEffectiveSizes(tokenProps);
-  const { ring } = tokenProps;
-  if (!ring) return {};
-  const innerGap = ring.innerGap != undefined ? getRingThickness(ring.innerGap) : getRingThickness(ring.ringThickness || 'xxlarge');
-  const effectiveRingThickness = 2 * getRingThickness(ring.ringThickness || 'xxlarge') + innerGap;
-  const effectiveSize = physicalSize + 2 * effectiveRingThickness;
-  const ringColor = ring.ringBackgroundColor || theme.colors.personaActivityRing;
-  return {
-    style: {
-      borderStyle: 'solid',
-      borderColor: ringColor,
-      borderWidth: effectiveRingThickness,
-      borderRadius: effectiveSize / 2,
-      width: effectiveSize,
-      height: effectiveSize,
-      position: 'absolute',
-      top: -effectiveRingThickness,
-      left: -effectiveRingThickness,
-    },
-  };
+    const { physicalSize } = calculateEffectiveSizes(tokenProps);
+    const { ring } = tokenProps;
+    if (!ring)
+        return {};
+    const innerGap = ring.innerGap != undefined ? getRingThickness(ring.innerGap) : getRingThickness(ring.ringThickness || 'xxlarge');
+    const effectiveRingThickness = 2 * getRingThickness(ring.ringThickness || 'xxlarge') + innerGap;
+    const effectiveSize = physicalSize + 2 * effectiveRingThickness;
+    const ringColor = ring.ringBackgroundColor || theme.colors.personaActivityRing;
+    return {
+        style: {
+            borderStyle: 'solid',
+            borderColor: ringColor,
+            borderWidth: effectiveRingThickness,
+            borderRadius: effectiveSize / 2,
+            width: effectiveSize,
+            height: effectiveSize,
+            position: 'absolute',
+            top: -effectiveRingThickness,
+            left: -effectiveRingThickness,
+        },
+    };
 }
 function _buildGlowStyles(tokenProps, theme) {
-  const { physicalSize } = calculateEffectiveSizes(tokenProps);
-  const { ring } = tokenProps;
-  if (!ring) return {};
-  const innerGap = ring.innerGap != undefined ? getRingThickness(ring.innerGap) : getRingThickness(ring.ringThickness || 'xxlarge');
-  const effectiveRingThickness = getRingThickness(ring.ringThickness || 'xxlarge') + innerGap;
-  const effectiveSize = physicalSize + 2 * effectiveRingThickness;
-  const glowColor = ring.accent ? theme.colors.accentButtonBackground : ring.ringColor || theme.colors.personaActivityGlow;
-  return {
-    style: {
-      borderStyle: 'solid',
-      borderColor: glowColor,
-      borderWidth: effectiveRingThickness - innerGap,
-      borderRadius: effectiveSize / 2,
-      width: effectiveSize,
-      height: effectiveSize,
-      position: 'absolute',
-      top: -effectiveRingThickness,
-      left: -effectiveRingThickness,
-    },
-  };
+    const { physicalSize } = calculateEffectiveSizes(tokenProps);
+    const { ring } = tokenProps;
+    if (!ring)
+        return {};
+    const innerGap = ring.innerGap != undefined ? getRingThickness(ring.innerGap) : getRingThickness(ring.ringThickness || 'xxlarge');
+    const effectiveRingThickness = getRingThickness(ring.ringThickness || 'xxlarge') + innerGap;
+    const effectiveSize = physicalSize + 2 * effectiveRingThickness;
+    const glowColor = ring.accent ? theme.colors.accentButtonBackground : ring.ringColor || theme.colors.personaActivityGlow;
+    return {
+        style: {
+            borderStyle: 'solid',
+            borderColor: glowColor,
+            borderWidth: effectiveRingThickness - innerGap,
+            borderRadius: effectiveSize / 2,
+            width: effectiveSize,
+            height: effectiveSize,
+            position: 'absolute',
+            top: -effectiveRingThickness,
+            left: -effectiveRingThickness,
+        },
+    };
 }
 export const buildRingStyles = styleFunction(_buildRingStyles, _ringProps);
 export const buildGlowStyles = styleFunction(_buildGlowStyles, _ringProps);
-//# sourceMappingURL=PersonaCoin.tokens.ring.js.map
+//# sourceMappingURL=PersonaCoin.tokens.ring.js.map

package/lib/PersonaCoin.tokens.root.d.ts

@@ -1,5 +1,5 @@
 import type { IViewProps } from '@fluentui-react-native/adapters';
 import type { Theme } from '@fluentui-react-native/framework';
 import type { IPersonaCoinTokens } from './PersonaCoin.types';
-export declare const buildRootStyles: import('@fluentui-react-native/tokens').StyleFactoryFunction<IViewProps, IPersonaCoinTokens, Theme>;
-//# sourceMappingURL=PersonaCoin.tokens.root.d.ts.map
+export declare const buildRootStyles: import("@fluentui-react-native/tokens").StyleFactoryFunction<IViewProps, IPersonaCoinTokens, Theme>;
+//# sourceMappingURL=PersonaCoin.tokens.root.d.ts.map

package/lib/PersonaCoin.tokens.root.js

@@ -1,22 +1,22 @@
 import { styleFunction } from '@uifabricshared/foundation-tokens';
 import { calculateEffectiveSizes } from './PersonaCoin.helpers';
 const nameMap = {
-  start: 'flex-start',
-  center: 'center',
-  end: 'flex-end',
+    start: 'flex-start',
+    center: 'center',
+    end: 'flex-end',
 };
 const _rootKeyProps = ['coinSize', 'size', 'horizontalIconAlignment', 'verticalIconAlignment'];
 function _buildRootStyles(tokenProps /*, theme: ITheme */) {
-  const rootStyle = {
-    flexDirection: 'row',
-  };
-  const { physicalSize } = calculateEffectiveSizes(tokenProps);
-  rootStyle.width = physicalSize;
-  rootStyle.height = physicalSize;
-  const { horizontalIconAlignment, verticalIconAlignment } = tokenProps;
-  rootStyle.justifyContent = nameMap[horizontalIconAlignment || 'end'];
-  rootStyle.alignItems = nameMap[verticalIconAlignment || 'end'];
-  return { style: rootStyle };
+    const rootStyle = {
+        flexDirection: 'row',
+    };
+    const { physicalSize } = calculateEffectiveSizes(tokenProps);
+    rootStyle.width = physicalSize;
+    rootStyle.height = physicalSize;
+    const { horizontalIconAlignment, verticalIconAlignment } = tokenProps;
+    rootStyle.justifyContent = nameMap[horizontalIconAlignment || 'end'];
+    rootStyle.alignItems = nameMap[verticalIconAlignment || 'end'];
+    return { style: rootStyle };
 }
 export const buildRootStyles = styleFunction(_buildRootStyles, _rootKeyProps);
-//# sourceMappingURL=PersonaCoin.tokens.root.js.map
+//# sourceMappingURL=PersonaCoin.tokens.root.js.map

package/lib/PersonaCoin.types.d.ts

@@ -2,114 +2,74 @@ import type { ImageProps, ViewProps, ImageURISource, TextProps, ColorValue } fro
 import type { IViewProps } from '@fluentui-react-native/adapters';
 import type { IBackgroundColorTokens, IForegroundColorTokens } from '@fluentui-react-native/tokens';
 import type { IRenderData } from '@uifabricshared/foundation-composable';
-export declare const personaCoinName = 'RNFPersonaCoin';
+export declare const personaCoinName = "RNFPersonaCoin";
 export type PersonaSize = 'size8' | 'size24' | 'size32' | 'size40' | 'size48' | 'size56' | 'size72' | 'size100' | 'size120';
 /**
  * Sets color of the coin when there is no picture
  * @deprecated Use PersonaCoinFluentColor instead.
  */
-export type PersonaCoinColor =
-  | 'lightBlue'
-  | 'blue'
-  | 'darkBlue'
-  | 'teal'
-  | 'green'
-  | 'darkGreen'
-  | 'lightPink'
-  | 'pink'
-  | 'magenta'
-  | 'purple'
-  | 'orange'
-  | 'darkRed'
-  | 'violet'
-  | 'lightRed'
-  | 'gold'
-  | 'burgundy'
-  | 'warmGray'
-  | 'coolGray'
-  | 'cyan'
-  | 'rust';
+export type PersonaCoinColor = 'lightBlue' | 'blue' | 'darkBlue' | 'teal' | 'green' | 'darkGreen' | 'lightPink' | 'pink' | 'magenta' | 'purple' | 'orange' | 'darkRed' | 'violet' | 'lightRed' | 'gold' | 'burgundy' | 'warmGray' | 'coolGray' | 'cyan' | 'rust';
 /**
  * Sets color of the coin when there is no picture. Uses fluent color names
  */
-export type PersonaCoinFluentColor =
-  | 'cornflower'
-  | 'blue'
-  | 'royalBlue'
-  | 'teal'
-  | 'forest'
-  | 'darkGreen'
-  | 'berry'
-  | 'hotPink'
-  | 'grape'
-  | 'purple'
-  | 'pumpkin'
-  | 'red'
-  | 'burgundy'
-  | 'orchid'
-  | 'brass'
-  | 'darkRed'
-  | 'beige'
-  | 'platinum'
-  | 'steel'
-  | 'brown';
+export type PersonaCoinFluentColor = 'cornflower' | 'blue' | 'royalBlue' | 'teal' | 'forest' | 'darkGreen' | 'berry' | 'hotPink' | 'grape' | 'purple' | 'pumpkin' | 'red' | 'burgundy' | 'orchid' | 'brass' | 'darkRed' | 'beige' | 'platinum' | 'steel' | 'brown';
 export type PersonaPresence = 'none' | 'offline' | 'online' | 'away' | 'dnd' | 'blocked' | 'busy';
 export type RingThickness = number | 'xSmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge';
 export interface RingConfig {
-  accent?: boolean;
-  transparent?: boolean;
-  ringColor?: ColorValue;
-  ringBackgroundColor?: ColorValue;
-  ringThickness?: RingThickness;
-  innerGap?: RingThickness;
+    accent?: boolean;
+    transparent?: boolean;
+    ringColor?: ColorValue;
+    ringBackgroundColor?: ColorValue;
+    ringThickness?: RingThickness;
+    innerGap?: RingThickness;
 }
 export interface IPersonaConfigurableProps {
-  size?: PersonaSize;
-  /**
-   * Sets color of the coin when there is no picture
-   * @deprecated Use coinColorFluent instead
-   */
-  coinColor?: PersonaCoinColor;
-  ring?: RingConfig;
-  coinColorFluent?: PersonaCoinFluentColor;
+    size?: PersonaSize;
+    /**
+     * Sets color of the coin when there is no picture
+     * @deprecated Use coinColorFluent instead
+     */
+    coinColor?: PersonaCoinColor;
+    ring?: RingConfig;
+    coinColorFluent?: PersonaCoinFluentColor;
 }
 export interface IPersonaCoinProps extends IViewProps, IPersonaConfigurableProps {
-  imageUrl?: string;
-  imageDescription?: string;
-  initials?: string;
-  presence?: PersonaPresence;
-  isOutOfOffice?: boolean;
+    imageUrl?: string;
+    imageDescription?: string;
+    initials?: string;
+    presence?: PersonaPresence;
+    isOutOfOffice?: boolean;
 }
 export interface IPersonaCoinSlotProps {
-  root: ViewProps;
-  photo: ImageProps;
-  initials: TextProps;
-  initialsBackground: ViewProps;
-  icon: ImageProps;
-  ring: ViewProps;
-  glow: ViewProps;
+    root: ViewProps;
+    photo: ImageProps;
+    initials: TextProps;
+    initialsBackground: ViewProps;
+    icon: ImageProps;
+    ring: ViewProps;
+    glow: ViewProps;
 }
 export type IconAlignment = 'start' | 'center' | 'end';
 export interface IPersonaCoinTokens extends IBackgroundColorTokens, IForegroundColorTokens, IPersonaConfigurableProps {
-  coinSize?: number;
-  iconSize?: number;
-  iconStrokeWidth?: number;
-  iconStrokeColor?: string;
-  initialsSize?: number;
-  horizontalIconAlignment?: IconAlignment;
-  verticalIconAlignment?: IconAlignment;
+    coinSize?: number;
+    iconSize?: number;
+    iconStrokeWidth?: number;
+    iconStrokeColor?: string;
+    initialsSize?: number;
+    horizontalIconAlignment?: IconAlignment;
+    verticalIconAlignment?: IconAlignment;
 }
 export interface IPersonaCoinState {
-  personaPhotoSource: ImageURISource | undefined;
-  iconSource: ImageURISource | undefined;
-  showRing: boolean;
-  transparentRing: boolean;
+    personaPhotoSource: ImageURISource | undefined;
+    iconSource: ImageURISource | undefined;
+    showRing: boolean;
+    transparentRing: boolean;
 }
 export interface IPersonaCoinType {
-  props: IPersonaCoinProps;
-  slotProps: IPersonaCoinSlotProps;
-  tokens: IPersonaCoinTokens;
-  state: IPersonaCoinState;
+    props: IPersonaCoinProps;
+    slotProps: IPersonaCoinSlotProps;
+    tokens: IPersonaCoinTokens;
+    state: IPersonaCoinState;
 }
 export type IPersonaCoinRenderData = IRenderData<IPersonaCoinSlotProps, IPersonaCoinState>;
-//# sourceMappingURL=PersonaCoin.types.d.ts.map
+//# sourceMappingURL=PersonaCoin.types.d.ts.map

package/lib/PersonaCoin.types.js

@@ -1,2 +1,2 @@
 export const personaCoinName = 'RNFPersonaCoin';
-//# sourceMappingURL=PersonaCoin.types.js.map
+//# sourceMappingURL=PersonaCoin.types.js.map

package/lib/index.d.ts

@@ -1,20 +1,5 @@
 export { PersonaCoin } from './PersonaCoin';
 export { personaCoinName } from './PersonaCoin.types';
-export type {
-  IPersonaCoinProps,
-  IPersonaCoinRenderData,
-  IPersonaCoinSlotProps,
-  IPersonaCoinState,
-  IPersonaCoinTokens,
-  IPersonaCoinType,
-  IPersonaConfigurableProps,
-  IconAlignment,
-  PersonaCoinColor,
-  PersonaCoinFluentColor,
-  PersonaPresence,
-  PersonaSize,
-  RingConfig,
-  RingThickness,
-} from './PersonaCoin.types';
+export type { IPersonaCoinProps, IPersonaCoinRenderData, IPersonaCoinSlotProps, IPersonaCoinState, IPersonaCoinTokens, IPersonaCoinType, IPersonaConfigurableProps, IconAlignment, PersonaCoinColor, PersonaCoinFluentColor, PersonaPresence, PersonaSize, RingConfig, RingThickness, } from './PersonaCoin.types';
 export { buildRootStyles } from './PersonaCoin.tokens.root';
-//# sourceMappingURL=index.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/index.js

@@ -1,4 +1,4 @@
 export { PersonaCoin } from './PersonaCoin';
 export { personaCoinName } from './PersonaCoin.types';
 export { buildRootStyles } from './PersonaCoin.tokens.root';
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/lib-commonjs/PersonaCoin.d.ts

@@ -1,9 +1,3 @@
 import type { IPersonaCoinProps, IPersonaCoinSlotProps, IPersonaCoinState } from './PersonaCoin.types';
-export declare const PersonaCoin: import('@uifabricshared/foundation-compose').IComposeReturnType<
-  IPersonaCoinProps,
-  IPersonaCoinSlotProps,
-  import('./PersonaCoin.types').IPersonaCoinTokens,
-  IPersonaCoinState,
-  object
->;
-//# sourceMappingURL=PersonaCoin.d.ts.map
+export declare const PersonaCoin: import("@uifabricshared/foundation-compose").IComposeReturnType<IPersonaCoinProps, IPersonaCoinSlotProps, import("./PersonaCoin.types").IPersonaCoinTokens, IPersonaCoinState, object>;
+//# sourceMappingURL=PersonaCoin.d.ts.map

package/lib-commonjs/PersonaCoin.helpers.d.ts

@@ -1,18 +1,11 @@
 import type { ImageURISource } from 'react-native';
-import type {
-  PersonaSize,
-  PersonaCoinColor,
-  PersonaCoinFluentColor,
-  PersonaPresence,
-  IPersonaCoinTokens,
-  RingThickness,
-} from './PersonaCoin.types';
+import type { PersonaSize, PersonaCoinColor, PersonaCoinFluentColor, PersonaPresence, IPersonaCoinTokens, RingThickness } from './PersonaCoin.types';
 export declare function getPresenceIconSource(presence: PersonaPresence, isOutOfOffice: boolean): ImageURISource;
 export type PersonaSizeConfig = {
-  physicalSize: number;
-  iconSize: number;
-  iconStrokeWidth: number;
-  initialsSize: number;
+    physicalSize: number;
+    iconSize: number;
+    iconStrokeWidth: number;
+    initialsSize: number;
 };
 export declare function getSizeConfig(size: PersonaSize): PersonaSizeConfig;
 /**
@@ -26,4 +19,4 @@ export declare function convertCoinColor(coinColor: PersonaCoinColor): string;
 export declare function convertCoinColorFluent(coinColor: PersonaCoinFluentColor): string;
 export declare function calculateEffectiveSizes(tokens: IPersonaCoinTokens): PersonaSizeConfig;
 export declare function getRingThickness(thickness: RingThickness): number;
-//# sourceMappingURL=PersonaCoin.helpers.d.ts.map
+//# sourceMappingURL=PersonaCoin.helpers.d.ts.map