@fluentui/react-utilities - npm Package Compare versions

Comparing version 9.0.0-alpha.3 to 9.0.0-alpha.4

CHANGELOG.json

@@ -5,3 +5,18 @@ {
     {
-      "date": "Fri, 26 Feb 2021 01:10:33 GMT",
+      "date": "Tue, 02 Mar 2021 07:21:38 GMT",
+      "tag": "@fluentui/react-utilities_v9.0.0-alpha.4",
+      "version": "9.0.0-alpha.4",
+      "comments": {
+        "prerelease": [
+          {
+            "comment": "remove dependency on @fluentui/utilities",
+            "author": "[e-mail]",
+            "commit": "529d34473f30680fa35928e0d977434ab2ed2173",
+            "package": "@fluentui/react-utilities"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Fri, 26 Feb 2021 01:16:27 GMT",
       "tag": "@fluentui/react-utilities_v9.0.0-alpha.3",
@@ -8,0 +23,0 @@ "version": "9.0.0-alpha.3",

CHANGELOG.md

 # Change Log - @fluentui/react-utilities
 
-This log was last generated on Fri, 26 Feb 2021 01:10:33 GMT and should not be manually modified.
+This log was last generated on Tue, 02 Mar 2021 07:21:38 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.0.0-alpha.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.0.0-alpha.4)
+
+Tue, 02 Mar 2021 07:21:38 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-alpha.3..@fluentui/react-utilities_v9.0.0-alpha.4)
+
+### Changes
+
+- remove dependency on @fluentui/utilities ([PR #17197](https://github.com/microsoft/fluentui/pull/17197) by [e-mail])
+
 ## [9.0.0-alpha.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.0.0-alpha.3)
 
-Fri, 26 Feb 2021 01:10:33 GMT 
+Fri, 26 Feb 2021 01:16:27 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-alpha.2..@fluentui/react-utilities_v9.0.0-alpha.3)
@@ -11,0 +20,0 @@

dist/react-utilities.d.ts

 import * as React from 'react';
 
+/**
+ * An array of A tag properties and events.
+ *
+ * @public
+ */
+export declare const anchorProperties: Record<string, number>;
+
+/**
+ * An array of AUDIO tag properties and events.
+
+ * @public
+ */
+export declare const audioProperties: Record<string, number>;
+
+/**
+ * An array of events that are allowed on every html element type.
+ *
+ * @public
+ */
+export declare const baseElementEvents: Record<string, number>;
+
+/**
+ * An array of element attributes which are allowed on every html element type.
+ *
+ * @public
+ */
+export declare const baseElementProperties: Record<string, number>;
+
 export declare interface BaseSlots {
@@ -7,2 +35,9 @@ root: React.ElementType;
 
+/**
+ * An array of BUTTON tag properties and events.
+ *
+ * @public
+ */
+export declare const buttonProperties: Record<string, number>;
+
 export declare type ChangeCallback<TElement extends HTMLElement, TValue, TEvent extends React.SyntheticEvent<TElement> | undefined> = (ev: TEvent, newValue: TValue | undefined) => void;
@@ -15,2 +50,6 @@
 
+export declare const colGroupProperties: Record<string, number>;
+
+export declare const colProperties: Record<string, number>;
+
 export declare interface ComponentProps {
@@ -23,2 +62,16 @@ as?: React.ElementType;
 /**
+ * An array of DIV tag properties and events.
+ *
+ * @public
+ */
+export declare const divProperties: Record<string, number>;
+
+/**
+ * An array of FORM tag properties and events.
+ *
+ * @public
+ */
+export declare const formProperties: Record<string, number>;
+
+/**
  * Generic name to any dictionary.
@@ -29,2 +82,27 @@ */
 /**
+ * Given an element tagname and user props, filters the props to only allowed props for the given
+ * element type.
+ * @param tagName - Tag name (e.g. "div")
+ * @param props - Props object
+ * @param excludedPropNames - List of props to disallow
+ */
+export declare function getNativeElementProps<TAttributes extends React.HTMLAttributes<any>>(tagName: string, props: {}, excludedPropNames?: string[]): TAttributes;
+
+/**
+ * Gets native supported props for an html element provided the allowance set. Use one of the property
+ * sets defined (divProperties, buttonPropertes, etc) to filter out supported properties from a given
+ * props set. Note that all data- and aria- prefixed attributes will be allowed.
+ * NOTE: getNativeProps should always be applied first when adding props to a react component. The
+ * non-native props should be applied second. This will prevent getNativeProps from overriding your custom props.
+ * For example, if props passed to getNativeProps has an onClick function and getNativeProps is added to
+ * the component after an onClick function is added, then the getNativeProps onClick will override it.
+ *
+ * @public
+ * @param props - The unfiltered input props
+ * @param allowedPropsNames - The array or record of allowed prop names.
+ * @returns The filtered props
+ */
+export declare function getNativeProps<T extends Record<string, any>>(props: Record<string, any>, allowedPropNames: string[] | Record<string, number>, excludedPropNames?: string[]): T;
+
+/**
  * Given the state and an array of slot names, will break out `slots` and `slotProps`
@@ -50,5 +128,50 @@ * collections.
 
-export declare const makeClasses: (classes: Record<string, string>) => (state: Record<string, any>) => void;
+/**
+ * An array of HTML element properties and events.
+ *
+ * @public
+ */
+export declare const htmlElementProperties: Record<string, number>;
 
 /**
+ * An array of IFRAME tag properties and events.
+ *
+ * @public
+ */
+export declare const iframeProperties: Record<string, number>;
+
+/**
+ * @deprecated Use imgProperties for img elements.
+ */
+export declare const imageProperties: Record<string, number>;
+
+/**
+ * An array of IMAGE tag properties and events.
+ *
+ * @public
+ */
+export declare const imgProperties: Record<string, number>;
+
+/**
+ * An array of INPUT tag properties and events.
+ *
+ * @public
+ */
+export declare const inputProperties: Record<string, number>;
+
+/**
+ * An array of LABEL tag properties and events.
+ *
+ * @public
+ */
+export declare const labelProperties: Record<string, number>;
+
+/**
+ * An array of LI tag properties and events.
+ *
+ * @public
+ */
+export declare const liProperties: Record<string, number>;
+
+/**
  * Helper which deep clones props, but respectively assigns JSX, object refs, and class names
@@ -70,2 +193,7 @@ * appropriately.
 
+/**
+ * Simple constant function for returning null, used to render empty templates in JSX.
+ */
+export declare const nullRender: () => null;
+
 export declare type ObjectShorthandProps<TProps extends ComponentProps = {}> = TProps & {
@@ -76,2 +204,26 @@ children?: TProps['children'] | ShorthandRenderFunction<TProps>;
 /**
+ * An array of OL tag properties and events.
+ *
+ * @public
+ */
+export declare const olProperties: Record<string, number>;
+
+/**
+ * Tiny helper to do the minimal amount of work in duplicating an object but omitting some
+ * props. This ends up faster than using object ...rest or reduce to filter.
+ *
+ * This behaves very much like filteredAssign, but does not merge many objects together,
+ * uses an exclusion object map, and avoids spreads all for optimal performance.
+ *
+ * See perf test for background:
+ * https://jsperf.com/omit-vs-rest-vs-reduce/1
+ *
+ * @param obj - The object to clone
+ * @param exclusions - The array of keys to exclude
+ */
+export declare function omit<TObj extends Record<string, any>>(obj: TObj, exclusions: (keyof TObj)[]): TObj;
+
+export declare const optionProperties: Record<string, number>;
+
+/**
  * A Ref function which can be treated like a ref object in that it has an attached
@@ -90,2 +242,9 @@ * current property, which will be updated as the ref is evaluated.
 
+/**
+ * An array of SELECT tag properties and events.
+ *
+ * @public
+ */
+export declare const selectProperties: Record<string, number>;
+
 export declare type ShorthandProps<TProps extends ComponentProps = {}> = React.ReactChild | React.ReactNodeArray | React.ReactPortal | boolean | number | null | undefined | (TProps & ComponentProps & {
@@ -104,2 +263,37 @@ children?: TProps['children'] | ShorthandRenderFunction<TProps>;
 /**
+ * An array of TABLE tag properties and events.
+ *
+ * @public
+ */
+export declare const tableProperties: Record<string, number>;
+
+/**
+ * An array of TD tag properties and events.
+ *
+ * @public
+ */
+export declare const tdProperties: Record<string, number>;
+
+/**
+ * An array of TEXTAREA tag properties and events.
+ *
+ * @public
+ */
+export declare const textAreaProperties: Record<string, number>;
+
+/**
+ * An array of TH tag properties and events.
+ *
+ * @public
+ */
+export declare const thProperties: Record<string, number>;
+
+/**
+ * An array of TR tag properties and events.
+ *
+ * @public
+ */
+export declare const trProperties: Record<string, number>;
+
+/**
  * Hook to store a value and generate callbacks for setting the value to true or false.
@@ -184,2 +378,9 @@ * The identity of the callbacks will always stay the same.
 
+/**
+ * An array of VIDEO tag properties and events.
+ *
+ * @public
+ */
+export declare const videoProperties: Record<string, number>;
+
 export { }

etc/react-utilities.api.md

@@ -9,2 +9,14 @@ ## API Report File for "@fluentui/react-utilities"
 
+// @public
+export const anchorProperties: Record<string, number>;
+
+// @public
+export const audioProperties: Record<string, number>;
+
+// @public
+export const baseElementEvents: Record<string, number>;
+
+// @public
+export const baseElementProperties: Record<string, number>;
+
 // @public (undocumented)
@@ -16,2 +28,5 @@ export interface BaseSlots {
 
+// @public
+export const buttonProperties: Record<string, number>;
+
 // @public (undocumented)
@@ -24,2 +39,8 @@ export type ChangeCallback<TElement extends HTMLElement, TValue, TEvent extends React.SyntheticEvent<TElement> | undefined> = (ev: TEvent, newValue: TValue | undefined) => void;
 // @public (undocumented)
+export const colGroupProperties: Record<string, number>;
+
+// @public (undocumented)
+export const colProperties: Record<string, number>;
+
+// @public (undocumented)
 export interface ComponentProps {
@@ -35,5 +56,17 @@ // (undocumented)
 // @public
+export const divProperties: Record<string, number>;
+
+// @public
+export const formProperties: Record<string, number>;
+
+// @public
 export type GenericDictionary = Record<string, any>;
 
 // @public
+export function getNativeElementProps<TAttributes extends React.HTMLAttributes<any>>(tagName: string, props: {}, excludedPropNames?: string[]): TAttributes;
+
+// @public
+export function getNativeProps<T extends Record<string, any>>(props: Record<string, any>, allowedPropNames: string[] | Record<string, number>, excludedPropNames?: string[]): T;
+
+// @public
 export const getSlots: (state: Record<string, any>, slotNames?: string[] | undefined) => {
@@ -44,6 +77,24 @@ slots: Record<string, any>;
 
-// @public (undocumented)
-export const makeClasses: (classes: Record<string, string>) => (state: Record<string, any>) => void;
+// @public
+export const htmlElementProperties: Record<string, number>;
 
 // @public
+export const iframeProperties: Record<string, number>;
+
+// @public @deprecated (undocumented)
+export const imageProperties: Record<string, number>;
+
+// @public
+export const imgProperties: Record<string, number>;
+
+// @public
+export const inputProperties: Record<string, number>;
+
+// @public
+export const labelProperties: Record<string, number>;
+
+// @public
+export const liProperties: Record<string, number>;
+
+// @public
 export const makeMergeProps: <TState = Record<string, any>>(options?: MergePropsOptions) => (target: Record<string, any>, ...propSets: (Record<string, any> | undefined)[]) => TState;
@@ -56,2 +107,5 @@
 
+// @public
+export const nullRender: () => null;
+
 // @public (undocumented)
@@ -63,2 +117,11 @@ export type ObjectShorthandProps<TProps extends ComponentProps = {}> = TProps & {
 // @public
+export const olProperties: Record<string, number>;
+
+// @public
+export function omit<TObj extends Record<string, any>>(obj: TObj, exclusions: (keyof TObj)[]): TObj;
+
+// @public (undocumented)
+export const optionProperties: Record<string, number>;
+
+// @public
 export type RefObjectFunction<T> = React.RefObject<T> & ((value: T) => void);
@@ -69,2 +132,5 @@
 
+// @public
+export const selectProperties: Record<string, number>;
+
 // @public (undocumented)
@@ -86,2 +152,17 @@ export type ShorthandProps<TProps extends ComponentProps = {}> = React.ReactChild | React.ReactNodeArray | React.ReactPortal | boolean | number | null | undefined | (TProps & ComponentProps & {
 // @public
+export const tableProperties: Record<string, number>;
+
+// @public
+export const tdProperties: Record<string, number>;
+
+// @public
+export const textAreaProperties: Record<string, number>;
+
+// @public
+export const thProperties: Record<string, number>;
+
+// @public
+export const trProperties: Record<string, number>;
+
+// @public
 export function useBoolean(initialState: boolean): [boolean, UseBooleanCallbacks];
@@ -114,5 +195,8 @@
 
+// @public
+export const videoProperties: Record<string, number>;
 
+
 // (No @packageDocumentation comment for this package)
 
 ```

lib-amd/compose/getSlots.js

@@ -1,2 +0,2 @@
-define(["require", "exports", "react", "@fluentui/utilities", "./nullRender"], function (require, exports, React, utilities_1, nullRender_1) {
+define(["require", "exports", "react", "../utils/index", "./nullRender"], function (require, exports, React, index_1, nullRender_1) {
     "use strict";
@@ -25,3 +25,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
         var slotProps = {
-            root: typeof slots.root === 'string' ? utilities_1.getNativeElementProps(slots.root, state) : utilities_1.omit(state, ['as']),
+            root: typeof slots.root === 'string' ? index_1.getNativeElementProps(slots.root, state) : index_1.omit(state, ['as']),
         };
@@ -38,3 +38,3 @@ if (slotNames) {
                     slotProps[name_1] = {
-                        children: children(slots[name_1], utilities_1.omit(slotDefinition, ['as', 'children'])),
+                        children: children(slots[name_1], index_1.omit(slotDefinition, ['as', 'children'])),
                     };
@@ -45,4 +45,4 @@ slots[name_1] = React.Fragment;
                     slotProps[name_1] = isSlotPrimitive
-                        ? utilities_1.getNativeElementProps(slotAs, slotDefinition)
-                        : utilities_1.omit(slotDefinition, ['as']);
+                        ? index_1.getNativeElementProps(slotAs, slotDefinition)
+                        : index_1.omit(slotDefinition, ['as']);
                 }
@@ -49,0 +49,0 @@ }

lib-amd/compose/index.d.ts

@@ -1,5 +0,5 @@
-export * from './makeClasses/index';
-export * from './types';
 export * from './getSlots';
 export * from './makeMergeProps';
+export * from './nullRender';
 export * from './resolveShorthandProps';
+export * from './types';

lib-amd/compose/index.js

@@ -1,9 +0,9 @@
-define(["require", "exports", "tslib", "./makeClasses/index", "./getSlots", "./makeMergeProps", "./resolveShorthandProps"], function (require, exports, tslib_1, index_1, getSlots_1, makeMergeProps_1, resolveShorthandProps_1) {
+define(["require", "exports", "tslib", "./getSlots", "./makeMergeProps", "./nullRender", "./resolveShorthandProps"], function (require, exports, tslib_1, getSlots_1, makeMergeProps_1, nullRender_1, resolveShorthandProps_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    tslib_1.__exportStar(index_1, exports);
     tslib_1.__exportStar(getSlots_1, exports);
     tslib_1.__exportStar(makeMergeProps_1, exports);
+    tslib_1.__exportStar(nullRender_1, exports);
     tslib_1.__exportStar(resolveShorthandProps_1, exports);
 });
 //# sourceMappingURL=index.js.map

lib-amd/compose/makeMergeProps.js

@@ -1,5 +0,38 @@
-define(["require", "exports", "tslib", "react", "@fluentui/utilities"], function (require, exports, tslib_1, React, utilities_1) {
+define(["require", "exports", "tslib", "react"], function (require, exports, tslib_1, React) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     /**
+     * Concatination helper, which can merge class names together. Skips over falsey values.
+     *
+     * @public
+     */
+    function css() {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i] = arguments[_i];
+        }
+        var classes = [];
+        for (var _a = 0, args_1 = args; _a < args_1.length; _a++) {
+            var arg = args_1[_a];
+            if (arg) {
+                if (typeof arg === 'string') {
+                    classes.push(arg);
+                }
+                else if (arg.hasOwnProperty('toString') && typeof arg.toString === 'function') {
+                    classes.push(arg.toString());
+                }
+                else {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    for (var key in arg) {
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                        if (arg[key]) {
+                            classes.push(key);
+                        }
+                    }
+                }
+            }
+        }
+        return classes.join(' ');
+    }
+    /**
      * Helper which deep clones props, but respectively assigns JSX, object refs, and class names
@@ -50,3 +83,3 @@ * appropriately.
                                     // for classnames, append
-                                    target[propName] = utilities_1.css(target[propName], propValue);
+                                    target[propName] = css(target[propName], propValue);
                                 }
@@ -53,0 +86,0 @@ }

lib-amd/compose/nullRender.d.ts

@@ -0,1 +1,4 @@
+/**
+ * Simple constant function for returning null, used to render empty templates in JSX.
+ */
 export declare const nullRender: () => null;

lib-amd/compose/nullRender.js

 define(["require", "exports"], function (require, exports) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
+    /**
+     * Simple constant function for returning null, used to render empty templates in JSX.
+     */
     exports.nullRender = function () { return null; };
 });
 //# sourceMappingURL=nullRender.js.map

lib-amd/hooks/index.d.ts

@@ -5,3 +5,3 @@ export * from './useBoolean';
 export * from './useEventCallback';
-export * from './useId';
+export { useId } from './useId';
 export * from './useMergedRefs';

lib-amd/hooks/index.js

@@ -8,5 +8,5 @@ define(["require", "exports", "tslib", "./useBoolean", "./useConst", "./useControllableValue", "./useEventCallback", "./useId", "./useMergedRefs"], function (require, exports, tslib_1, useBoolean_1, useConst_1, useControllableValue_1, useEventCallback_1, useId_1, useMergedRefs_1) {
     tslib_1.__exportStar(useEventCallback_1, exports);
-    tslib_1.__exportStar(useId_1, exports);
+    exports.useId = useId_1.useId;
     tslib_1.__exportStar(useMergedRefs_1, exports);
 });
 //# sourceMappingURL=index.js.map

lib-amd/hooks/useId.d.ts

@@ -0,1 +1,3 @@
+export declare function getId(prefix?: string): string;
+export declare function resetIds(): void;
 /**
@@ -2,0 +4,0 @@ * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).

lib-amd/hooks/useId.js

@@ -1,4 +0,16 @@
-define(["require", "exports", "react", "@fluentui/utilities/lib/getId"], function (require, exports, React, getId_1) {
+define(["require", "exports", "react"], function (require, exports, React) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
+    // TODO
+    // getId() is a temporary approach, useId() should be reimplemented to properly support SSR & scenarios with
+    // different globals (document, window)
+    var id = 0;
+    function getId(prefix) {
+        return (prefix || '') + id++;
+    }
+    exports.getId = getId;
+    function resetIds() {
+        id = 0;
+    }
+    exports.resetIds = resetIds;
     /**
@@ -17,3 +29,3 @@ * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).
         if (!ref.current) {
-            ref.current = getId_1.getId(prefix);
+            ref.current = getId(prefix);
         }
@@ -20,0 +32,0 @@ return ref.current;

lib-amd/index.d.ts

 import './version';
 export * from './compose/index';
 export * from './hooks/index';
+export * from './utils/index';

lib-amd/index.js

@@ -1,2 +0,2 @@
-define(["require", "exports", "tslib", "./compose/index", "./hooks/index", "./version"], function (require, exports, tslib_1, index_1, index_2) {
+define(["require", "exports", "tslib", "./compose/index", "./hooks/index", "./utils/index", "./version"], function (require, exports, tslib_1, index_1, index_2, index_3) {
     "use strict";
@@ -6,3 +6,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
     tslib_1.__exportStar(index_2, exports);
+    tslib_1.__exportStar(index_3, exports);
 });
 //# sourceMappingURL=index.js.map

lib-amd/version.js

 define(["require", "exports", "@fluentui/set-version"], function (require, exports, set_version_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    set_version_1.setVersion('@fluentui/react-utilities', '9.0.0-alpha.3');
+    set_version_1.setVersion('@fluentui/react-utilities', '9.0.0-alpha.4');
 });
 //# sourceMappingURL=version.js.map

lib-commonjs/compose/getSlots.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = require("react");
-var utilities_1 = require("@fluentui/utilities");
+var index_1 = require("../utils/index");
 var nullRender_1 = require("./nullRender");
@@ -27,3 +27,3 @@ /**
     var slotProps = {
-        root: typeof slots.root === 'string' ? utilities_1.getNativeElementProps(slots.root, state) : utilities_1.omit(state, ['as']),
+        root: typeof slots.root === 'string' ? index_1.getNativeElementProps(slots.root, state) : index_1.omit(state, ['as']),
     };
@@ -40,3 +40,3 @@ if (slotNames) {
                 slotProps[name_1] = {
-                    children: children(slots[name_1], utilities_1.omit(slotDefinition, ['as', 'children'])),
+                    children: children(slots[name_1], index_1.omit(slotDefinition, ['as', 'children'])),
                 };
@@ -47,4 +47,4 @@ slots[name_1] = React.Fragment;
                 slotProps[name_1] = isSlotPrimitive
-                    ? utilities_1.getNativeElementProps(slotAs, slotDefinition)
-                    : utilities_1.omit(slotDefinition, ['as']);
+                    ? index_1.getNativeElementProps(slotAs, slotDefinition)
+                    : index_1.omit(slotDefinition, ['as']);
             }
@@ -51,0 +51,0 @@ }

lib-commonjs/compose/index.d.ts

@@ -1,5 +0,5 @@
-export * from './makeClasses/index';
-export * from './types';
 export * from './getSlots';
 export * from './makeMergeProps';
+export * from './nullRender';
 export * from './resolveShorthandProps';
+export * from './types';

lib-commonjs/compose/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./makeClasses/index"), exports);
 tslib_1.__exportStar(require("./getSlots"), exports);
 tslib_1.__exportStar(require("./makeMergeProps"), exports);
+tslib_1.__exportStar(require("./nullRender"), exports);
 tslib_1.__exportStar(require("./resolveShorthandProps"), exports);
 //# sourceMappingURL=index.js.map

lib-commonjs/compose/makeMergeProps.js

@@ -5,4 +5,36 @@ "use strict";
 var React = require("react");
-var utilities_1 = require("@fluentui/utilities");
 /**
+ * Concatination helper, which can merge class names together. Skips over falsey values.
+ *
+ * @public
+ */
+function css() {
+    var args = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+    }
+    var classes = [];
+    for (var _a = 0, args_1 = args; _a < args_1.length; _a++) {
+        var arg = args_1[_a];
+        if (arg) {
+            if (typeof arg === 'string') {
+                classes.push(arg);
+            }
+            else if (arg.hasOwnProperty('toString') && typeof arg.toString === 'function') {
+                classes.push(arg.toString());
+            }
+            else {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                for (var key in arg) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    if (arg[key]) {
+                        classes.push(key);
+                    }
+                }
+            }
+        }
+    }
+    return classes.join(' ');
+}
+/**
  * Helper which deep clones props, but respectively assigns JSX, object refs, and class names
@@ -53,3 +85,3 @@ * appropriately.
                                 // for classnames, append
-                                target[propName] = utilities_1.css(target[propName], propValue);
+                                target[propName] = css(target[propName], propValue);
                             }
@@ -56,0 +88,0 @@ }

lib-commonjs/compose/nullRender.d.ts

@@ -0,1 +1,4 @@
+/**
+ * Simple constant function for returning null, used to render empty templates in JSX.
+ */
 export declare const nullRender: () => null;

lib-commonjs/compose/nullRender.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * Simple constant function for returning null, used to render empty templates in JSX.
+ */
 exports.nullRender = function () { return null; };
 //# sourceMappingURL=nullRender.js.map

lib-commonjs/hooks/index.d.ts

@@ -5,3 +5,3 @@ export * from './useBoolean';
 export * from './useEventCallback';
-export * from './useId';
+export { useId } from './useId';
 export * from './useMergedRefs';

lib-commonjs/hooks/index.js

@@ -8,4 +8,5 @@ "use strict";
 tslib_1.__exportStar(require("./useEventCallback"), exports);
-tslib_1.__exportStar(require("./useId"), exports);
+var useId_1 = require("./useId");
+exports.useId = useId_1.useId;
 tslib_1.__exportStar(require("./useMergedRefs"), exports);
 //# sourceMappingURL=index.js.map

lib-commonjs/hooks/useId.d.ts

@@ -0,1 +1,3 @@
+export declare function getId(prefix?: string): string;
+export declare function resetIds(): void;
 /**
@@ -2,0 +4,0 @@ * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).

lib-commonjs/hooks/useId.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = require("react");
-var getId_1 = require("@fluentui/utilities/lib-commonjs/getId");
+// TODO
+// getId() is a temporary approach, useId() should be reimplemented to properly support SSR & scenarios with
+// different globals (document, window)
+var id = 0;
+function getId(prefix) {
+    return (prefix || '') + id++;
+}
+exports.getId = getId;
+function resetIds() {
+    id = 0;
+}
+exports.resetIds = resetIds;
 /**
@@ -18,3 +29,3 @@ * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).
     if (!ref.current) {
-        ref.current = getId_1.getId(prefix);
+        ref.current = getId(prefix);
     }
@@ -21,0 +32,0 @@ return ref.current;

lib-commonjs/index.d.ts

 import './version';
 export * from './compose/index';
 export * from './hooks/index';
+export * from './utils/index';

lib-commonjs/index.js

@@ -7,2 +7,3 @@ "use strict";
 tslib_1.__exportStar(require("./hooks/index"), exports);
+tslib_1.__exportStar(require("./utils/index"), exports);
 //# sourceMappingURL=index.js.map

lib-commonjs/version.js

@@ -6,3 +6,3 @@ "use strict";
 var set_version_1 = require("@fluentui/set-version");
-set_version_1.setVersion('@fluentui/react-utilities', '9.0.0-alpha.3');
+set_version_1.setVersion('@fluentui/react-utilities', '9.0.0-alpha.4');
 //# sourceMappingURL=version.js.map

lib/compose/getSlots.js

 import * as React from 'react';
-import { getNativeElementProps, omit } from '@fluentui/utilities';
+import { getNativeElementProps, omit } from '../utils/index';
 import { nullRender } from './nullRender';
@@ -4,0 +4,0 @@ /**

lib/compose/index.d.ts

@@ -1,5 +0,5 @@
-export * from './makeClasses/index';
-export * from './types';
 export * from './getSlots';
 export * from './makeMergeProps';
+export * from './nullRender';
 export * from './resolveShorthandProps';
+export * from './types';

lib/compose/index.js

@@ -1,5 +0,5 @@
-export * from './makeClasses/index';
 export * from './getSlots';
 export * from './makeMergeProps';
+export * from './nullRender';
 export * from './resolveShorthandProps';
 //# sourceMappingURL=index.js.map

lib/compose/makeMergeProps.js

 import { __spreadArrays } from "tslib";
 import * as React from 'react';
-import { css } from '@fluentui/utilities';
 /**
+ * Concatination helper, which can merge class names together. Skips over falsey values.
+ *
+ * @public
+ */
+function css() {
+    var args = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        args[_i] = arguments[_i];
+    }
+    var classes = [];
+    for (var _a = 0, args_1 = args; _a < args_1.length; _a++) {
+        var arg = args_1[_a];
+        if (arg) {
+            if (typeof arg === 'string') {
+                classes.push(arg);
+            }
+            else if (arg.hasOwnProperty('toString') && typeof arg.toString === 'function') {
+                classes.push(arg.toString());
+            }
+            else {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                for (var key in arg) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    if (arg[key]) {
+                        classes.push(key);
+                    }
+                }
+            }
+        }
+    }
+    return classes.join(' ');
+}
+/**
  * Helper which deep clones props, but respectively assigns JSX, object refs, and class names
@@ -6,0 +38,0 @@ * appropriately.

lib/compose/nullRender.d.ts

@@ -0,1 +1,4 @@
+/**
+ * Simple constant function for returning null, used to render empty templates in JSX.
+ */
 export declare const nullRender: () => null;

lib/compose/nullRender.js

@@ -0,2 +1,5 @@
+/**
+ * Simple constant function for returning null, used to render empty templates in JSX.
+ */
 export var nullRender = function () { return null; };
 //# sourceMappingURL=nullRender.js.map

lib/hooks/index.d.ts

@@ -5,3 +5,3 @@ export * from './useBoolean';
 export * from './useEventCallback';
-export * from './useId';
+export { useId } from './useId';
 export * from './useMergedRefs';

lib/hooks/index.js

@@ -5,4 +5,4 @@ export * from './useBoolean';
 export * from './useEventCallback';
-export * from './useId';
+export { useId } from './useId';
 export * from './useMergedRefs';
 //# sourceMappingURL=index.js.map

lib/hooks/useId.d.ts

@@ -0,1 +1,3 @@
+export declare function getId(prefix?: string): string;
+export declare function resetIds(): void;
 /**
@@ -2,0 +4,0 @@ * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).

lib/hooks/useId.js

 import * as React from 'react';
-import { getId } from '@fluentui/utilities/lib/getId';
+// TODO
+// getId() is a temporary approach, useId() should be reimplemented to properly support SSR & scenarios with
+// different globals (document, window)
+var id = 0;
+export function getId(prefix) {
+    return (prefix || '') + id++;
+}
+export function resetIds() {
+    id = 0;
+}
 /**
@@ -4,0 +13,0 @@ * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).

lib/index.d.ts

 import './version';
 export * from './compose/index';
 export * from './hooks/index';
+export * from './utils/index';

lib/index.js

 import './version';
 export * from './compose/index';
 export * from './hooks/index';
+export * from './utils/index';
 //# sourceMappingURL=index.js.map

lib/version.js

 // Do not modify this file; it is generated as part of publish.
 // The checked in version is a placeholder only and will not be updated.
 import { setVersion } from '@fluentui/set-version';
-setVersion('@fluentui/react-utilities', '9.0.0-alpha.3');
+setVersion('@fluentui/react-utilities', '9.0.0-alpha.4');
 //# sourceMappingURL=version.js.map

package.json

 {
   "name": "@fluentui/react-utilities",
-  "version": "9.0.0-alpha.3",
+  "version": "9.0.0-alpha.4",
   "description": "A set of general React-specific utilities.",
@@ -46,3 +46,2 @@ "main": "lib-commonjs/index.js",
     "@fluentui/set-version": "^8.0.1",
-    "@fluentui/utilities": "^8.0.1",
     "tslib": "^1.10.0"
@@ -49,0 +48,0 @@ },

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

331321

increased by34.97%

Dependency count

4

decreased by-20%

Lines of code

4389

increased by68.03%

Worsened metrics

Number of package files

182

decreased by-4.71%

Dependency changes

• - Removed@fluentui/utilities@^8.0.1

• - Removed@fluentui/dom-utilities@2.3.7(transitive)

• - Removed@fluentui/merge-styles@8.6.13(transitive)

• - Removed@fluentui/react-window-provider@2.2.28(transitive)

• - Removed@fluentui/utilities@8.15.15(transitive)