@fluentui/react-checkbox 9.0.0-alpha.7 → 9.0.0-beta.2

package/lib-commonjs/components/Checkbox/useCheckboxStyles.js

@@ -2,22 +2,174 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useCheckboxStyles = void 0;
 var react_make_styles_1 = require("@fluentui/react-make-styles");
+var react_tabster_1 = require("@fluentui/react-tabster");
 /**
  * Styles for the root slot
  */
 var useStyles = react_make_styles_1.makeStyles({
     root: function (theme) { return ({
-    // TODO Add default styles for the root element
+        display: 'inline-flex',
+        position: 'relative',
+        alignSelf: 'flex-start',
+        alignItems: 'center',
+        padding: '4px',
+        userSelect: 'none',
+        cursor: 'pointer',
+    }); },
+    disabled: function (theme) { return ({
+        color: theme.colorNeutralForegroundDisabled,
+        cursor: 'default',
+        '& .ms-checkbox-indicator': {
+            borderColor: theme.colorNeutralStrokeDisabled,
+            color: theme.colorNeutralForegroundDisabled,
+            backgroundColor: theme.colorNeutralBackground1,
+        },
+        ':hover': {
+            '& .ms-checkbox-indicator': {
+                borderColor: theme.colorNeutralStrokeDisabled,
+                color: theme.colorNeutralForegroundDisabled,
+                backgroundColor: theme.colorNeutralBackground1,
+            },
+        },
+        ':active': {
+            '& .ms-checkbox-indicator': {
+                borderColor: theme.colorNeutralStrokeDisabled,
+                color: theme.colorNeutralForegroundDisabled,
+                backgroundColor: theme.colorNeutralBackground1,
+            },
+        },
+    }); },
+    unchecked: function (theme) { return ({
+        color: theme.colorNeutralForeground3,
+        '& .ms-checkbox-indicator': {
+            borderColor: theme.colorNeutralStrokeAccessible,
+            '& > *': {
+                opacity: 0,
+            },
+        },
+        ':hover': {
+            color: theme.colorNeutralForeground2,
+            '& .ms-checkbox-indicator': {
+                borderColor: theme.colorNeutralStrokeAccessibleHover,
+            },
+        },
+        ':active': {
+            color: theme.colorNeutralForeground1,
+            '& .ms-checkbox-indicator': {
+                borderColor: theme.colorNeutralStrokeAccessiblePressed,
+            },
+        },
+    }); },
+    checked: function (theme) { return ({
+        color: theme.colorNeutralForeground1,
+        // TODO: neutralForegroundInverted change to NeutralForegroundOnBrand once it's added
+        '& .ms-checkbox-indicator': {
+            backgroundColor: theme.colorCompoundBrandBackground,
+            color: theme.colorNeutralForegroundInverted,
+            borderColor: theme.colorBrandBackground,
+        },
+        ':active': {
+            '& .ms-checkbox-indicator': {
+                backgroundColor: theme.colorCompoundBrandBackgroundPressed,
+            },
+        },
+        ':hover': {
+            '& .ms-checkbox-indicator': {
+                backgroundColor: theme.colorCompoundBrandBackgroundHover,
+            },
+        },
+    }); },
+    mixed: function (theme) { return ({
+        color: theme.colorNeutralForeground1,
+        '& .ms-checkbox-indicator': {
+            borderColor: theme.colorCompoundBrandStroke,
+            color: theme.colorCompoundBrandForeground1,
+        },
+        ':active': {
+            '& .ms-checkbox-indicator': {
+                borderColor: theme.colorCompoundBrandStrokePressed,
+                color: theme.colorCompoundBrandForeground1Pressed,
+            },
+        },
+        ':hover': {
+            '& .ms-checkbox-indicator': {
+                borderColor: theme.colorCompoundBrandStrokeHover,
+                color: theme.colorCompoundBrandForeground1Hover,
+            },
+        },
+    }); },
+    focusIndicator: function (theme) {
+        return react_tabster_1.createFocusOutlineStyle(theme, { style: { outlineOffset: '2px' }, selector: 'focus-within' });
+    },
+});
+var useContainerStyles = react_make_styles_1.makeStyles({
+    container: {
+        position: 'relative',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    medium: {
+        width: '16px',
+        height: '16px',
+    },
+    large: {
+        width: '20px',
+        height: '20px',
+    },
+    // TODO: change marginLeft to Spacing horizontal M once it's added
+    before: function (theme) { return ({
+        marginLeft: '12px',
+    }); },
+    // TODO: change marginRight to Spacing horizontal M once it's added
+    after: function (theme) { return ({
+        marginRight: '12px',
+    }); },
+});
+var useInputStyles = react_make_styles_1.makeStyles({
+    input: {
+        opacity: 0,
+        position: 'absolute',
+        margin: 0,
+        padding: 0,
+        cursor: 'pointer',
+    },
+    disabled: {
+        cursor: 'not-allowed',
+    },
+});
+var useIndicatorStyles = react_make_styles_1.makeStyles({
+    box: function (theme) { return ({
+        width: '100%',
+        height: '100%',
+        fill: 'currentColor',
+        overflow: 'hidden',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        position: 'absolute',
+        boxSizing: 'border-box',
+        borderStyle: 'solid',
+        borderRadius: theme.borderRadiusSmall,
+        borderWidth: theme.strokeWidthThin,
+    }); },
+    circular: function (theme) { return ({
+        borderRadius: theme.borderRadiusCircular,
     }); },
 });
 /**
  * Apply styling to the Checkbox slots based on the state
  */
 var useCheckboxStyles = function (state) {
+    var checkedState = state.checked === 'mixed' ? 'mixed' : state.checked ? 'checked' : 'unchecked';
+    var indicatorStyles = useIndicatorStyles();
+    var inputStyles = useInputStyles();
+    var containerStyles = useContainerStyles();
     var styles = useStyles();
-    state.className = react_make_styles_1.mergeClasses(styles.root, state.className);
-    // TODO Add class names to slots, for example:
-    // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);
+    state.root.className = react_make_styles_1.mergeClasses(styles.root, styles.focusIndicator, styles[checkedState], state.input.disabled && styles.disabled, state.root.className);
+    state.input.className = react_make_styles_1.mergeClasses(containerStyles[state.size], inputStyles.input, state.input.disabled && inputStyles.disabled, state.input.className);
+    state.containerClassName = react_make_styles_1.mergeClasses(containerStyles.container, containerStyles[state.size], !!state.root.children && containerStyles[state.labelPosition]);
+    state.indicator.className = react_make_styles_1.mergeClasses(indicatorStyles.box, containerStyles[state.size], state.circular && indicatorStyles.circular, 'ms-checkbox-indicator', state.indicator.className);
     return state;
 };
 exports.useCheckboxStyles = useCheckboxStyles;

package/lib-commonjs/components/Checkbox/useCheckboxStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCheckboxStyles.js","sourceRoot":"../src/","sources":["components/Checkbox/useCheckboxStyles.ts"],"names":[],"mappings":";;;AAAA,iEAAuE;AAGvE;;GAEG;AACH,IAAM,SAAS,GAAG,8BAAU,CAAC;IAC3B,IAAI,EAAE,UAAA,KAAK,IAAI,OAAA,CAAC;IACd,+CAA+C;KAChD,CAAC,EAFa,CAEb;CAGH,CAAC,CAAC;AAEH;;GAEG;AACI,IAAM,iBAAiB,GAAG,UAAC,KAAoB;IACpD,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,KAAK,CAAC,SAAS,GAAG,gCAAY,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAE7D,8CAA8C;IAC9C,gFAAgF;IAEhF,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AARW,QAAA,iBAAiB,qBAQ5B","sourcesContent":["import { makeStyles, mergeClasses } from '@fluentui/react-make-styles';\nimport { CheckboxState } from './Checkbox.types';\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: theme => ({\n    // TODO Add default styles for the root element\n  }),\n\n  // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the Checkbox slots based on the state\n */\nexport const useCheckboxStyles = (state: CheckboxState): CheckboxState => {\n  const styles = useStyles();\n  state.className = mergeClasses(styles.root, state.className);\n\n  // TODO Add class names to slots, for example:\n  // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);\n\n  return state;\n};\n"]}
+{"version":3,"file":"useCheckboxStyles.js","sourceRoot":"","sources":["../../../src/components/Checkbox/useCheckboxStyles.ts"],"names":[],"mappings":"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"}

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":";;;AAAA,qDAA2B","sourcesContent":["export * from './Checkbox';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,qDAA2B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-checkbox",
-  "version": "9.0.0-alpha.7",
+  "version": "9.0.0-beta.2",
   "description": "Fluent UI checkbox component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -17,15 +17,17 @@
     "code-style": "just-scripts code-style",
     "just": "just-scripts",
     "lint": "just-scripts lint",
-    "start": "just-scripts dev:storybook",
-    "start-test": "just-scripts jest-watch",
-    "test": "just-scripts test",
-    "update-snapshots": "just-scripts jest -u"
+    "start": "yarn storybook",
+    "test": "jest",
+    "docs": "api-extractor run --config=config/api-extractor.local.json --local",
+    "build:local": "tsc -p . --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output dist/react-checkbox/src && yarn docs",
+    "storybook": "start-storybook"
   },
   "devDependencies": {
-    "@fluentui/eslint-plugin": "^1.3.1",
-    "@fluentui/jest-serializer-make-styles": "^9.0.0-alpha.22",
-    "@fluentui/react-conformance": "^0.4.1",
+    "@fluentui/eslint-plugin": "*",
+    "@fluentui/jest-serializer-make-styles": "9.0.0-beta.1",
+    "@fluentui/react-conformance": "*",
+    "@fluentui/react-conformance-make-styles": "9.0.0-beta.1",
     "@fluentui/scripts": "^1.0.0",
     "@types/enzyme": "3.10.3",
     "@types/enzyme-adapter-react-16": "1.0.3",
@@ -39,8 +41,10 @@
     "react-test-renderer": "^16.3.0"
   },
   "dependencies": {
-    "@fluentui/react-make-styles": "^9.0.0-alpha.46",
-    "@fluentui/react-utilities": "^9.0.0-alpha.31",
+    "@fluentui/react-make-styles": "9.0.0-beta.1",
+    "@fluentui/react-utilities": "9.0.0-beta.1",
+    "@fluentui/react-label": "9.0.0-beta.1",
+    "@fluentui/react-tabster": "9.0.0-beta.2",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {
@@ -50,7 +54,7 @@
     "react-dom": ">=16.8.0 <18.0.0"
   },
   "beachball": {
-    "tag": "alpha",
+    "tag": "beta",
     "disallowedChangeTypes": [
       "major",
       "minor",

package/config/api-extractor.json

@@ -1,3 +0,0 @@
-{
-  "extends": "@fluentui/scripts/api-extractor/api-extractor.common.json"
-}

package/config/tests.js

@@ -1,7 +0,0 @@
-/** Jest test setup file. */
-
-const { configure } = require('enzyme');
-const Adapter = require('enzyme-adapter-react-16');
-
-// Configure enzyme.
-configure({ adapter: new Adapter() });

package/etc/react-checkbox.api.md

@@ -1,44 +0,0 @@
-## API Report File for "@fluentui/react-checkbox"
-
-> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
-
-```ts
-
-import { ComponentPropsCompat } from '@fluentui/react-utilities';
-import { ComponentStateCompat } from '@fluentui/react-utilities';
-import * as React_2 from 'react';
-
-// @public
-export const Checkbox: React_2.ForwardRefExoticComponent<CheckboxProps & React_2.RefAttributes<HTMLElement>>;
-
-// @public
-export type CheckboxDefaultedProps = never;
-
-// @public
-export interface CheckboxProps extends ComponentPropsCompat, React_2.HTMLAttributes<HTMLElement> {
-}
-
-// @public
-export type CheckboxShorthandProps = never;
-
-// @public
-export const checkboxShorthandProps: CheckboxShorthandProps[];
-
-// @public
-export interface CheckboxState extends ComponentStateCompat<CheckboxProps, CheckboxShorthandProps, CheckboxDefaultedProps> {
-    ref: React_2.Ref<HTMLElement>;
-}
-
-// @public
-export const renderCheckbox: (state: CheckboxState) => JSX.Element;
-
-// @public
-export const useCheckbox: (props: CheckboxProps, ref: React_2.Ref<HTMLElement>, defaultProps?: CheckboxProps | undefined) => CheckboxState;
-
-// @public
-export const useCheckboxStyles: (state: CheckboxState) => CheckboxState;
-
-
-// (No @packageDocumentation comment for this package)
-
-```

package/just.config.ts

@@ -1,3 +0,0 @@
-import { preset } from '@fluentui/scripts';
-
-preset();

package/lib-amd/Checkbox.d.ts

@@ -1 +0,0 @@
-export * from './components/Checkbox/index';

package/lib-amd/Checkbox.js

@@ -1,6 +0,0 @@
-define(["require", "exports", "tslib", "./components/Checkbox/index"], function (require, exports, tslib_1, index_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    tslib_1.__exportStar(index_1, exports);
-});
-//# sourceMappingURL=Checkbox.js.map

package/lib-amd/Checkbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"../src/","sources":["Checkbox.ts"],"names":[],"mappings":";;;IAAA,uCAA4C","sourcesContent":["export * from './components/Checkbox/index';\n"]}

package/lib-amd/common/isConformant.d.ts

@@ -1,4 +0,0 @@
-import { IsConformantOptions } from '@fluentui/react-conformance';
-export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
-    componentPath?: string;
-}): void;

package/lib-amd/common/isConformant.js

@@ -1,14 +0,0 @@
-define(["require", "exports", "@fluentui/react-conformance"], function (require, exports, react_conformance_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.isConformant = void 0;
-    function isConformant(testInfo) {
-        var defaultOptions = {
-            asPropHandlesRef: true,
-            componentPath: module.parent.filename.replace('.test', ''),
-        };
-        react_conformance_1.isConformant(defaultOptions, testInfo);
-    }
-    exports.isConformant = isConformant;
-});
-//# sourceMappingURL=isConformant.js.map

package/lib-amd/common/isConformant.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"isConformant.js","sourceRoot":"../src/","sources":["common/isConformant.ts"],"names":[],"mappings":";;;;IAEA,SAAgB,YAAY,CAC1B,QAAyF;QAEzF,IAAM,cAAc,GAAyC;YAC3D,gBAAgB,EAAE,IAAI;YACtB,aAAa,EAAE,MAAO,CAAC,MAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC;SAC7D,CAAC;QAEF,gCAAgB,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;IAC7C,CAAC;IATD,oCASC","sourcesContent":["import { isConformant as baseIsConformant, IsConformantOptions } from '@fluentui/react-conformance';\n\nexport function isConformant<TProps = {}>(\n  testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & { componentPath?: string },\n) {\n  const defaultOptions: Partial<IsConformantOptions<TProps>> = {\n    asPropHandlesRef: true,\n    componentPath: module!.parent!.filename.replace('.test', ''),\n  };\n\n  baseIsConformant(defaultOptions, testInfo);\n}\n"]}

package/lib-amd/components/Checkbox/Checkbox.d.ts

@@ -1,6 +0,0 @@
-import * as React from 'react';
-import { CheckboxProps } from './Checkbox.types';
-/**
- * A Checkbox component provides a way to represent options that can be selected
- */
-export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLElement>>;

package/lib-amd/components/Checkbox/Checkbox.js

@@ -1,15 +0,0 @@
-define(["require", "exports", "react", "./useCheckbox", "./renderCheckbox", "./useCheckboxStyles"], function (require, exports, React, useCheckbox_1, renderCheckbox_1, useCheckboxStyles_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.Checkbox = void 0;
-    /**
-     * A Checkbox component provides a way to represent options that can be selected
-     */
-    exports.Checkbox = React.forwardRef(function (props, ref) {
-        var state = useCheckbox_1.useCheckbox(props, ref);
-        useCheckboxStyles_1.useCheckboxStyles(state);
-        return renderCheckbox_1.renderCheckbox(state);
-    });
-    exports.Checkbox.displayName = 'Checkbox';
-});
-//# sourceMappingURL=Checkbox.js.map

package/lib-amd/components/Checkbox/Checkbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"../src/","sources":["components/Checkbox/Checkbox.tsx"],"names":[],"mappings":";;;;IAMA;;OAEG;IACU,QAAA,QAAQ,GAAG,KAAK,CAAC,UAAU,CAA6B,UAAC,KAAK,EAAE,GAAG;QAC9E,IAAM,KAAK,GAAG,yBAAW,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEtC,qCAAiB,CAAC,KAAK,CAAC,CAAC;QACzB,OAAO,+BAAc,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC,CAAC,CAAC;IAEH,gBAAQ,CAAC,WAAW,GAAG,UAAU,CAAC","sourcesContent":["import * as React from 'react';\nimport { useCheckbox } from './useCheckbox';\nimport { CheckboxProps } from './Checkbox.types';\nimport { renderCheckbox } from './renderCheckbox';\nimport { useCheckboxStyles } from './useCheckboxStyles';\n\n/**\n * A Checkbox component provides a way to represent options that can be selected\n */\nexport const Checkbox = React.forwardRef<HTMLElement, CheckboxProps>((props, ref) => {\n  const state = useCheckbox(props, ref);\n\n  useCheckboxStyles(state);\n  return renderCheckbox(state);\n});\n\nCheckbox.displayName = 'Checkbox';\n"]}

package/lib-amd/components/Checkbox/Checkbox.types.d.ts

@@ -1,24 +0,0 @@
-import * as React from 'react';
-import { ComponentPropsCompat, ComponentStateCompat } from '@fluentui/react-utilities';
-/**
- * Checkbox Props
- */
-export interface CheckboxProps extends ComponentPropsCompat, React.HTMLAttributes<HTMLElement> {
-}
-/**
- * Names of the shorthand properties in CheckboxProps
- */
-export declare type CheckboxShorthandProps = never;
-/**
- * Names of CheckboxProps that have a default value in useCheckbox
- */
-export declare type CheckboxDefaultedProps = never;
-/**
- * State used in rendering Checkbox
- */
-export interface CheckboxState extends ComponentStateCompat<CheckboxProps, CheckboxShorthandProps, CheckboxDefaultedProps> {
-    /**
-     * Ref to the root element
-     */
-    ref: React.Ref<HTMLElement>;
-}

package/lib-amd/components/Checkbox/Checkbox.types.js

@@ -1,5 +0,0 @@
-define(["require", "exports"], function (require, exports) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-});
-//# sourceMappingURL=Checkbox.types.js.map

package/lib-amd/components/Checkbox/Checkbox.types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Checkbox.types.js","sourceRoot":"../src/","sources":["components/Checkbox/Checkbox.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { ComponentPropsCompat, ComponentStateCompat } from '@fluentui/react-utilities';\n\n/**\n * Checkbox Props\n */\nexport interface CheckboxProps extends ComponentPropsCompat, React.HTMLAttributes<HTMLElement> {\n  /*\n   * TODO Add props and slots here\n   * Any slot property should be listed in the checkboxShorthandProps array below\n   * Any property that has a default value should be listed in CheckboxDefaultedProps as e.g. 'size' | 'icon'\n   */\n}\n\n/**\n * Names of the shorthand properties in CheckboxProps\n */\nexport type CheckboxShorthandProps = never; // TODO add shorthand property names\n\n/**\n * Names of CheckboxProps that have a default value in useCheckbox\n */\nexport type CheckboxDefaultedProps = never; // TODO add names of properties with default values\n\n/**\n * State used in rendering Checkbox\n */\nexport interface CheckboxState\n  extends ComponentStateCompat<CheckboxProps, CheckboxShorthandProps, CheckboxDefaultedProps> {\n  /**\n   * Ref to the root element\n   */\n  ref: React.Ref<HTMLElement>;\n}\n"]}

package/lib-amd/components/Checkbox/index.d.ts

@@ -1,5 +0,0 @@
-export * from './Checkbox';
-export * from './Checkbox.types';
-export * from './renderCheckbox';
-export * from './useCheckbox';
-export * from './useCheckboxStyles';

package/lib-amd/components/Checkbox/index.js

@@ -1,10 +0,0 @@
-define(["require", "exports", "tslib", "./Checkbox", "./Checkbox.types", "./renderCheckbox", "./useCheckbox", "./useCheckboxStyles"], function (require, exports, tslib_1, Checkbox_1, Checkbox_types_1, renderCheckbox_1, useCheckbox_1, useCheckboxStyles_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    tslib_1.__exportStar(Checkbox_1, exports);
-    tslib_1.__exportStar(Checkbox_types_1, exports);
-    tslib_1.__exportStar(renderCheckbox_1, exports);
-    tslib_1.__exportStar(useCheckbox_1, exports);
-    tslib_1.__exportStar(useCheckboxStyles_1, exports);
-});
-//# sourceMappingURL=index.js.map

package/lib-amd/components/Checkbox/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Checkbox/index.ts"],"names":[],"mappings":";;;IAAA,0CAA2B;IAC3B,gDAAiC;IACjC,gDAAiC;IACjC,6CAA8B;IAC9B,mDAAoC","sourcesContent":["export * from './Checkbox';\nexport * from './Checkbox.types';\nexport * from './renderCheckbox';\nexport * from './useCheckbox';\nexport * from './useCheckboxStyles';\n"]}

package/lib-amd/components/Checkbox/renderCheckbox.d.ts

@@ -1,5 +0,0 @@
-import { CheckboxState } from './Checkbox.types';
-/**
- * Render the final JSX of Checkbox
- */
-export declare const renderCheckbox: (state: CheckboxState) => JSX.Element;

package/lib-amd/components/Checkbox/renderCheckbox.js

@@ -1,14 +0,0 @@
-define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "./useCheckbox"], function (require, exports, tslib_1, React, react_utilities_1, useCheckbox_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.renderCheckbox = void 0;
-    /**
-     * Render the final JSX of Checkbox
-     */
-    var renderCheckbox = function (state) {
-        var _a = react_utilities_1.getSlotsCompat(state, useCheckbox_1.checkboxShorthandProps), slots = _a.slots, slotProps = _a.slotProps;
-        return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root), state.children));
-    };
-    exports.renderCheckbox = renderCheckbox;
-});
-//# sourceMappingURL=renderCheckbox.js.map

package/lib-amd/components/Checkbox/renderCheckbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderCheckbox.js","sourceRoot":"../src/","sources":["components/Checkbox/renderCheckbox.tsx"],"names":[],"mappings":";;;;IAKA;;OAEG;IACI,IAAM,cAAc,GAAG,UAAC,KAAoB;QAC3C,IAAA,KAAuB,gCAAc,CAAC,KAAK,EAAE,oCAAsB,CAAC,EAAlE,KAAK,WAAA,EAAE,SAAS,eAAkD,CAAC;QAE3E,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI,GAE3B,KAAK,CAAC,QAAQ,CACJ,CACd,CAAC;IACJ,CAAC,CAAC;IATW,QAAA,cAAc,kBASzB","sourcesContent":["import * as React from 'react';\nimport { getSlotsCompat } from '@fluentui/react-utilities';\nimport { CheckboxState } from './Checkbox.types';\nimport { checkboxShorthandProps } from './useCheckbox';\n\n/**\n * Render the final JSX of Checkbox\n */\nexport const renderCheckbox = (state: CheckboxState) => {\n  const { slots, slotProps } = getSlotsCompat(state, checkboxShorthandProps);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {/* TODO Add additional slots in the appropriate place */}\n      {state.children}\n    </slots.root>\n  );\n};\n"]}

package/lib-amd/components/Checkbox/useCheckbox.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-import { CheckboxProps, CheckboxShorthandProps, CheckboxState } from './Checkbox.types';
-/**
- * Array of all shorthand properties listed in CheckboxShorthandProps
- */
-export declare const checkboxShorthandProps: CheckboxShorthandProps[];
-/**
- * Create the state required to render Checkbox.
- *
- * The returned state can be modified with hooks such as useCheckboxStyles,
- * before being passed to renderCheckbox.
- *
- * @param props - props from this instance of Checkbox
- * @param ref - reference to root HTMLElement of Checkbox
- * @param defaultProps - (optional) default prop values provided by the implementing type
- */
-export declare const useCheckbox: (props: CheckboxProps, ref: React.Ref<HTMLElement>, defaultProps?: CheckboxProps | undefined) => CheckboxState;

package/lib-amd/components/Checkbox/useCheckbox.js

@@ -1,30 +0,0 @@
-define(["require", "exports", "@fluentui/react-utilities"], function (require, exports, react_utilities_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.useCheckbox = exports.checkboxShorthandProps = void 0;
-    /**
-     * Array of all shorthand properties listed in CheckboxShorthandProps
-     */
-    exports.checkboxShorthandProps = [
-    /* TODO add shorthand property names */
-    ];
-    var mergeProps = react_utilities_1.makeMergeProps({ deepMerge: exports.checkboxShorthandProps });
-    /**
-     * Create the state required to render Checkbox.
-     *
-     * The returned state can be modified with hooks such as useCheckboxStyles,
-     * before being passed to renderCheckbox.
-     *
-     * @param props - props from this instance of Checkbox
-     * @param ref - reference to root HTMLElement of Checkbox
-     * @param defaultProps - (optional) default prop values provided by the implementing type
-     */
-    var useCheckbox = function (props, ref, defaultProps) {
-        var state = mergeProps({
-            ref: ref,
-        }, defaultProps && react_utilities_1.resolveShorthandProps(defaultProps, exports.checkboxShorthandProps), react_utilities_1.resolveShorthandProps(props, exports.checkboxShorthandProps));
-        return state;
-    };
-    exports.useCheckbox = useCheckbox;
-});
-//# sourceMappingURL=useCheckbox.js.map

package/lib-amd/components/Checkbox/useCheckbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useCheckbox.js","sourceRoot":"../src/","sources":["components/Checkbox/useCheckbox.ts"],"names":[],"mappings":";;;;IAIA;;OAEG;IACU,QAAA,sBAAsB,GAA6B;IAC9D,uCAAuC;KACxC,CAAC;IAEF,IAAM,UAAU,GAAG,gCAAc,CAAgB,EAAE,SAAS,EAAE,8BAAsB,EAAE,CAAC,CAAC;IAExF;;;;;;;;;OASG;IACI,IAAM,WAAW,GAAG,UACzB,KAAoB,EACpB,GAA2B,EAC3B,YAA4B;QAE5B,IAAM,KAAK,GAAG,UAAU,CACtB;YACE,GAAG,KAAA;SACJ,EACD,YAAY,IAAI,uCAAqB,CAAC,YAAY,EAAE,8BAAsB,CAAC,EAC3E,uCAAqB,CAAC,KAAK,EAAE,8BAAsB,CAAC,CACrD,CAAC;QAEF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAdW,QAAA,WAAW,eActB","sourcesContent":["import * as React from 'react';\nimport { makeMergeProps, resolveShorthandProps } from '@fluentui/react-utilities';\nimport { CheckboxProps, CheckboxShorthandProps, CheckboxState } from './Checkbox.types';\n\n/**\n * Array of all shorthand properties listed in CheckboxShorthandProps\n */\nexport const checkboxShorthandProps: CheckboxShorthandProps[] = [\n  /* TODO add shorthand property names */\n];\n\nconst mergeProps = makeMergeProps<CheckboxState>({ deepMerge: checkboxShorthandProps });\n\n/**\n * Create the state required to render Checkbox.\n *\n * The returned state can be modified with hooks such as useCheckboxStyles,\n * before being passed to renderCheckbox.\n *\n * @param props - props from this instance of Checkbox\n * @param ref - reference to root HTMLElement of Checkbox\n * @param defaultProps - (optional) default prop values provided by the implementing type\n */\nexport const useCheckbox = (\n  props: CheckboxProps,\n  ref: React.Ref<HTMLElement>,\n  defaultProps?: CheckboxProps,\n): CheckboxState => {\n  const state = mergeProps(\n    {\n      ref,\n    },\n    defaultProps && resolveShorthandProps(defaultProps, checkboxShorthandProps),\n    resolveShorthandProps(props, checkboxShorthandProps),\n  );\n\n  return state;\n};\n"]}

package/lib-amd/components/Checkbox/useCheckboxStyles.d.ts

@@ -1,5 +0,0 @@
-import { CheckboxState } from './Checkbox.types';
-/**
- * Apply styling to the Checkbox slots based on the state
- */
-export declare const useCheckboxStyles: (state: CheckboxState) => CheckboxState;

package/lib-amd/components/Checkbox/useCheckboxStyles.js

@@ -1,25 +0,0 @@
-define(["require", "exports", "@fluentui/react-make-styles"], function (require, exports, react_make_styles_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.useCheckboxStyles = void 0;
-    /**
-     * Styles for the root slot
-     */
-    var useStyles = react_make_styles_1.makeStyles({
-        root: function (theme) { return ({
-        // TODO Add default styles for the root element
-        }); },
-    });
-    /**
-     * Apply styling to the Checkbox slots based on the state
-     */
-    var useCheckboxStyles = function (state) {
-        var styles = useStyles();
-        state.className = react_make_styles_1.mergeClasses(styles.root, state.className);
-        // TODO Add class names to slots, for example:
-        // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);
-        return state;
-    };
-    exports.useCheckboxStyles = useCheckboxStyles;
-});
-//# sourceMappingURL=useCheckboxStyles.js.map

package/lib-amd/components/Checkbox/useCheckboxStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useCheckboxStyles.js","sourceRoot":"../src/","sources":["components/Checkbox/useCheckboxStyles.ts"],"names":[],"mappings":";;;;IAGA;;OAEG;IACH,IAAM,SAAS,GAAG,8BAAU,CAAC;QAC3B,IAAI,EAAE,UAAA,KAAK,IAAI,OAAA,CAAC;QACd,+CAA+C;SAChD,CAAC,EAFa,CAEb;KAGH,CAAC,CAAC;IAEH;;OAEG;IACI,IAAM,iBAAiB,GAAG,UAAC,KAAoB;QACpD,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;QAC3B,KAAK,CAAC,SAAS,GAAG,gCAAY,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;QAE7D,8CAA8C;QAC9C,gFAAgF;QAEhF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IARW,QAAA,iBAAiB,qBAQ5B","sourcesContent":["import { makeStyles, mergeClasses } from '@fluentui/react-make-styles';\nimport { CheckboxState } from './Checkbox.types';\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: theme => ({\n    // TODO Add default styles for the root element\n  }),\n\n  // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the Checkbox slots based on the state\n */\nexport const useCheckboxStyles = (state: CheckboxState): CheckboxState => {\n  const styles = useStyles();\n  state.className = mergeClasses(styles.root, state.className);\n\n  // TODO Add class names to slots, for example:\n  // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);\n\n  return state;\n};\n"]}

package/lib-amd/index.d.ts

@@ -1 +0,0 @@
-export * from './Checkbox';

package/lib-amd/index.js

@@ -1,6 +0,0 @@
-define(["require", "exports", "tslib", "./Checkbox"], function (require, exports, tslib_1, Checkbox_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    tslib_1.__exportStar(Checkbox_1, exports);
-});
-//# sourceMappingURL=index.js.map

package/lib-amd/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":";;;IAAA,0CAA2B","sourcesContent":["export * from './Checkbox';\n"]}

package/src/components/Checkbox/Checkbox.types.ts

@@ -1,34 +0,0 @@
-import * as React from 'react';
-import { ComponentPropsCompat, ComponentStateCompat } from '@fluentui/react-utilities';
-
-/**
- * Checkbox Props
- */
-export interface CheckboxProps extends ComponentPropsCompat, React.HTMLAttributes<HTMLElement> {
-  /*
-   * TODO Add props and slots here
-   * Any slot property should be listed in the checkboxShorthandProps array below
-   * Any property that has a default value should be listed in CheckboxDefaultedProps as e.g. 'size' | 'icon'
-   */
-}
-
-/**
- * Names of the shorthand properties in CheckboxProps
- */
-export type CheckboxShorthandProps = never; // TODO add shorthand property names
-
-/**
- * Names of CheckboxProps that have a default value in useCheckbox
- */
-export type CheckboxDefaultedProps = never; // TODO add names of properties with default values
-
-/**
- * State used in rendering Checkbox
- */
-export interface CheckboxState
-  extends ComponentStateCompat<CheckboxProps, CheckboxShorthandProps, CheckboxDefaultedProps> {
-  /**
-   * Ref to the root element
-   */
-  ref: React.Ref<HTMLElement>;
-}