@fluentui-react-native/drawer 0.1.0

package/lib-commonjs/Drawer.js

@@ -0,0 +1,55 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Drawer = exports.drawerLookup = void 0;
+/** @jsx withSlots */
+var react_native_1 = require("react-native");
+var framework_1 = require("@fluentui-react-native/framework");
+var Drawer_styling_1 = require("./Drawer.styling");
+var Drawer_types_1 = require("./Drawer.types");
+var useDrawer_1 = require("./useDrawer");
+var drawerLookup = function (layer, userProps) {
+    return userProps[layer] || layer === userProps['drawerPosition'];
+};
+exports.drawerLookup = drawerLookup;
+exports.Drawer = (0, framework_1.compose)(__assign(__assign({ displayName: Drawer_types_1.DrawerName }, Drawer_styling_1.stylingSettings), { slots: {
+        modal: react_native_1.Modal,
+        scrim: react_native_1.TouchableWithoutFeedback,
+        scrimContent: react_native_1.Animated.View,
+        content: react_native_1.Animated.View,
+        handle: react_native_1.View,
+    }, useRender: function (userProps, useSlots) {
+        var drawerProps = (0, useDrawer_1.useDrawer)(userProps).props;
+        var Slots = useSlots(userProps, function (layer) { return (0, exports.drawerLookup)(layer, drawerProps); });
+        return function (final, children) {
+            var _a = (0, framework_1.mergeProps)(drawerProps, final), open = _a.open, onClose = _a.onClose, onScrimClick = _a.onScrimClick, animationConfig = _a.animationConfig, drawerPosition = _a.drawerPosition, showHandle = _a.showHandle, rest = __rest(_a, ["open", "onClose", "onScrimClick", "animationConfig", "drawerPosition", "showHandle"]);
+            return ((0, framework_1.withSlots)(Slots.modal, __assign({}, rest, { visible: open, onRequestClose: onClose, supportedOrientations: ['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right'], animationType: "none", transparent: true }),
+                (0, framework_1.withSlots)(Slots.scrim, { onPress: onScrimClick },
+                    (0, framework_1.withSlots)(Slots.scrimContent, { style: [{ opacity: animationConfig.animatedOpacity }] })),
+                (0, framework_1.withSlots)(Slots.content, { style: animationConfig.animatedStyle },
+                    drawerPosition === 'bottom' && showHandle && (0, framework_1.withSlots)(Slots.handle, null),
+                    children)));
+        };
+    } }));
+//# sourceMappingURL=Drawer.js.map

package/lib-commonjs/Drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../src/Drawer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qBAAqB;AACrB,6CAA+E;AAG/E,8DAAkF;AAElF,mDAAmD;AAEnD,+CAA4C;AAC5C,yCAAwC;AAEjC,IAAM,YAAY,GAAG,UAAC,KAAa,EAAE,SAAsB;IAChE,OAAO,SAAS,CAAC,KAAK,CAAC,IAAI,KAAK,KAAK,SAAS,CAAC,gBAAgB,CAAC,CAAC;AACnE,CAAC,CAAC;AAFW,QAAA,YAAY,gBAEvB;AAEW,QAAA,MAAM,GAAG,IAAA,mBAAO,sBAC3B,WAAW,EAAE,yBAAU,IACpB,gCAAe,KAClB,KAAK,EAAE;QACL,KAAK,EAAE,oBAAK;QACZ,KAAK,EAAE,uCAAwB;QAC/B,YAAY,EAAE,uBAAQ,CAAC,IAAI;QAC3B,OAAO,EAAE,uBAAQ,CAAC,IAAI;QACtB,MAAM,EAAE,mBAAI;KACb,EACD,SAAS,EAAE,UAAC,SAAsB,EAAE,QAA8B;QAChE,IAAM,WAAW,GAAG,IAAA,qBAAS,EAAC,SAAS,CAAC,CAAC,KAAK,CAAC;QAC/C,IAAM,KAAK,GAAG,QAAQ,CAAC,SAAS,EAAE,UAAC,KAAK,IAAK,OAAA,IAAA,oBAAY,EAAC,KAAK,EAAE,WAAW,CAAC,EAAhC,CAAgC,CAAC,CAAC;QAC/E,OAAO,UAAC,KAAkB,EAAE,QAAyB;YACnD,IAAM,KAAwF,IAAA,sBAAU,EAAC,WAAW,EAAE,KAAK,CAAC,EAApH,IAAI,UAAA,EAAE,OAAO,aAAA,EAAE,YAAY,kBAAA,EAAE,eAAe,qBAAA,EAAE,cAAc,oBAAA,EAAE,UAAU,gBAAA,EAAK,IAAI,cAAnF,sFAAqF,CAAiC,CAAC;YAC7H,OAAO,CACL,2BAAC,KAAK,CAAC,KAAK,eACN,IAAI,IACR,OAAO,EAAE,IAAI,EACb,cAAc,EAAE,OAAO,EACvB,qBAAqB,EAAE,CAAC,UAAU,EAAE,sBAAsB,EAAE,WAAW,EAAE,gBAAgB,EAAE,iBAAiB,CAAC,EAC7G,aAAa,EAAC,MAAM,EACpB,WAAW;gBAEX,2BAAC,KAAK,CAAC,KAAK,IAAC,OAAO,EAAE,YAAY;oBAChC,2BAAC,KAAK,CAAC,YAAY,IAAC,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,eAAe,CAAC,eAAe,EAAE,CAAC,GAAI,CACjE;gBACd,2BAAC,KAAK,CAAC,OAAO,IAAC,KAAK,EAAE,eAAe,CAAC,aAAa;oBAChD,cAAc,KAAK,QAAQ,IAAI,UAAU,IAAI,2BAAC,KAAK,CAAC,MAAM,OAAG;oBAC7D,QAAQ,CACK,CACJ,CACf,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,IACD,CAAC"}

package/lib-commonjs/Drawer.styling.d.ts

@@ -0,0 +1,4 @@
+import type { UseStylingOptions } from '@fluentui-react-native/framework';
+import type { DrawerTokens, DrawerSlotProps, DrawerProps } from './Drawer.types';
+export declare const stylingSettings: UseStylingOptions<DrawerProps, DrawerSlotProps, DrawerTokens>;
+//# sourceMappingURL=Drawer.styling.d.ts.map

package/lib-commonjs/Drawer.styling.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.styling.d.ts","sourceRoot":"","sources":["../src/Drawer.styling.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAS,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AAIjF,OAAO,KAAK,EAAE,YAAY,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAGjF,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,WAAW,EAAE,eAAe,EAAE,YAAY,CAmDzF,CAAC"}

package/lib-commonjs/Drawer.styling.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.stylingSettings = void 0;
+var framework_1 = require("@fluentui-react-native/framework");
+var Drawer_types_1 = require("./Drawer.types");
+var DrawerTokens_1 = require("./DrawerTokens");
+exports.stylingSettings = {
+    tokens: [DrawerTokens_1.defaultDrawerTokens, Drawer_types_1.DrawerName],
+    tokensThatAreAlsoProps: 'all',
+    states: ['left', 'right', 'bottom'],
+    slotProps: {
+        scrimContent: (0, framework_1.buildProps)(function (tokens, _theme) { return ({
+            style: {
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                width: '100%',
+                height: '100%',
+                backgroundColor: tokens.scrimColor,
+                opacity: tokens.scrimOpacity,
+            },
+        }); }, ['scrimColor']),
+        content: (0, framework_1.buildProps)(function (tokens, _theme) { return ({
+            style: {
+                position: 'absolute',
+                height: tokens.height,
+                width: tokens.width,
+                elevation: tokens.drawerElevation,
+                borderTopEndRadius: tokens.drawerCornerRadius,
+                borderTopStartRadius: tokens.drawerCornerRadius,
+                right: tokens.rightPosition,
+                left: tokens.leftPosition,
+                bottom: tokens.bottomPosition,
+                top: tokens.topPosition,
+                backgroundColor: tokens.drawerBackgroundColor,
+            },
+        }); }, ['drawerBackgroundColor', 'drawerElevation', 'height', 'width']),
+        handle: (0, framework_1.buildProps)(function (tokens, _theme) { return ({
+            style: {
+                width: tokens.handleWidth,
+                height: tokens.handleHeight,
+                borderRadius: tokens.handleCornerRadius,
+                backgroundColor: tokens.handleBackgroundColor,
+                alignSelf: tokens.handleAlignment,
+                marginTop: tokens.handleMarginTop,
+            },
+        }); }, ['handleWidth', 'handleHeight', 'handleCornerRadius', 'handleBackgroundColor', 'handleAlignment', 'handleMarginTop']),
+    },
+};
+//# sourceMappingURL=Drawer.styling.js.map

package/lib-commonjs/Drawer.styling.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.styling.js","sourceRoot":"","sources":["../src/Drawer.styling.ts"],"names":[],"mappings":";;;AACA,8DAA8D;AAE9D,+CAA4C;AAE5C,+CAAqD;AAExC,QAAA,eAAe,GAAkE;IAC5F,MAAM,EAAE,CAAC,kCAAmB,EAAE,yBAAU,CAAC;IACzC,sBAAsB,EAAE,KAAK;IAC7B,MAAM,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,CAAC;IACnC,SAAS,EAAE;QACT,YAAY,EAAE,IAAA,sBAAU,EACtB,UAAC,MAAoB,EAAE,MAAa,IAAK,OAAA,CAAC;YACxC,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,eAAe,EAAE,MAAM,CAAC,UAAU;gBAClC,OAAO,EAAE,MAAM,CAAC,YAAY;aAC7B;SACF,CAAC,EAVuC,CAUvC,EACF,CAAC,YAAY,CAAC,CACf;QACD,OAAO,EAAE,IAAA,sBAAU,EACjB,UAAC,MAAoB,EAAE,MAAa,IAAK,OAAA,CAAC;YACxC,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,MAAM,EAAE,MAAM,CAAC,MAAM;gBACrB,KAAK,EAAE,MAAM,CAAC,KAAK;gBACnB,SAAS,EAAE,MAAM,CAAC,eAAe;gBACjC,kBAAkB,EAAE,MAAM,CAAC,kBAAkB;gBAC7C,oBAAoB,EAAE,MAAM,CAAC,kBAAkB;gBAC/C,KAAK,EAAE,MAAM,CAAC,aAAa;gBAC3B,IAAI,EAAE,MAAM,CAAC,YAAY;gBACzB,MAAM,EAAE,MAAM,CAAC,cAAc;gBAC7B,GAAG,EAAE,MAAM,CAAC,WAAW;gBACvB,eAAe,EAAE,MAAM,CAAC,qBAAqB;aAC9C;SACF,CAAC,EAduC,CAcvC,EACF,CAAC,uBAAuB,EAAE,iBAAiB,EAAE,QAAQ,EAAE,OAAO,CAAC,CAChE;QACD,MAAM,EAAE,IAAA,sBAAU,EAChB,UAAC,MAAoB,EAAE,MAAa,IAAK,OAAA,CAAC;YACxC,KAAK,EAAE;gBACL,KAAK,EAAE,MAAM,CAAC,WAAW;gBACzB,MAAM,EAAE,MAAM,CAAC,YAAY;gBAC3B,YAAY,EAAE,MAAM,CAAC,kBAAkB;gBACvC,eAAe,EAAE,MAAM,CAAC,qBAAqB;gBAC7C,SAAS,EAAE,MAAM,CAAC,eAAe;gBACjC,SAAS,EAAE,MAAM,CAAC,eAAe;aAClC;SACF,CAAC,EATuC,CASvC,EACF,CAAC,aAAa,EAAE,cAAc,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC,CACrH;KACF;CACF,CAAC"}

package/lib-commonjs/Drawer.types.d.ts

@@ -0,0 +1,184 @@
+import type { Animated, ColorValue, FlexAlignType, ModalProps, TouchableWithoutFeedbackProps, ViewProps } from 'react-native';
+import type { InteractionEvent, PressableFocusProps } from '@fluentui-react-native/interactive-hooks';
+export declare const DrawerName = "Drawer";
+/**
+ * Specifies the possible position of the Drawer.
+ */
+export type DrawerPositionType = 'bottom' | 'left' | 'right';
+export interface DrawerTokens {
+    /**
+     * The color of the scrim.
+     * */
+    scrimColor?: ColorValue;
+    /**
+     * The opacity of the scrim.
+     * */
+    scrimOpacity?: number;
+    /**
+     * Width of the handle.
+     */
+    handleWidth?: number;
+    /**
+     * Height of the handle.
+     */
+    handleHeight?: number;
+    /**
+     * The background color of the handle.
+     * */
+    handleBackgroundColor?: ColorValue;
+    /**
+     * The corner radius of the handle.
+     * */
+    handleCornerRadius?: number;
+    /**
+     * The top margin of the handle.
+     *  */
+    handleMarginTop?: number;
+    /**
+     * The bottom margin of the handle.
+     * */
+    handleMarginBottom?: number;
+    /**
+     * The start margin of the handle.
+     * */
+    handleMarginStart?: number;
+    /**
+     * The end margin of the handle.
+     * */
+    handleMarginEnd?: number;
+    /**
+     * The flex alignment of the handle.
+     * */
+    handleAlignment?: FlexAlignType;
+    /**
+     * The background for drawer
+     * */
+    drawerBackgroundColor?: ColorValue;
+    /**
+     * The corner radius of the Drawer
+     * @default 0
+     * */
+    drawerCornerRadius?: number;
+    /**
+     * The elevation of the Drawer
+     * @default 5
+     * @platform android
+     * */
+    drawerElevation?: number;
+    /**
+     * The width of the Drawer
+     * Note: Only applicable when position is 'left' or 'right'
+     * @default '100%'
+     * */
+    width?: number | string;
+    /**
+     * The height of the Drawer
+     * Note: Only applicable when position is 'bottom'
+     * @default '40%'
+     * */
+    height?: number | string;
+    /**
+     * The shadow color of the Drawer
+     * @platform iOS
+     * */
+    shadowColor?: ColorValue;
+    /**
+     * The shadow offset of the Drawer
+     * @platform iOS
+     * */
+    shadowOffset?: {
+        width: number;
+        height: number;
+    };
+    /**
+     * The shadow opacity of the Drawer
+     * @platform iOS
+     * */
+    shadowOpacity?: number;
+    /**
+     * The shadow radius of the Drawer
+     * @platform iOS
+     * */
+    shadowRadius?: number;
+    /**
+     * Positions/Behaviours of the Drawer, This is used to apply different tokens for different positions.
+     */
+    left?: DrawerTokens;
+    right?: DrawerTokens;
+    bottom?: DrawerTokens;
+    /**
+     * Coordinate position of the Drawer, This is used to position the Drawer at a particular coordinate.
+     */
+    leftPosition?: number;
+    rightPosition?: number;
+    bottomPosition?: number;
+    topPosition?: number;
+}
+export interface DrawerProps extends PressableFocusProps {
+    accessibilityLabel?: string;
+    /**
+     * Visibility of the Drawer
+     */
+    open?: boolean;
+    /**
+     * Callback when the Drawer is closed
+     * */
+    onClose?: (e: InteractionEvent) => void;
+    /**
+     * Callback when the Drawer is opened
+     * */
+    onOpen?: (e: InteractionEvent) => void;
+    /**
+     * Callback when the scrim is clicked
+     * */
+    onScrimClick?: (e: InteractionEvent) => void;
+    /**
+     * The content of the Drawer
+     * */
+    children?: React.ReactNode;
+    /**
+     * The behavior of the Drawer
+     * @default 'left'
+     * */
+    drawerPosition?: DrawerPositionType;
+    /**
+     * The behavior is for only bottom drawer in which content is scrollable without expanding the bottom drawer
+     * @default false
+     * */
+    isContentScrollableUnexpanded?: boolean;
+    /**
+     * The behavior is for only bottom drawer in which handle can be hidden for some usecases
+     * @default true
+     * */
+    showHandle?: boolean;
+    /**
+     * The width of the Drawer
+     * Animation configuration for the Drawer
+     * */
+    animationConfig?: {
+        animatedOpacity: Animated.AnimatedInterpolation;
+        animatedStyle: {
+            transform: {
+                translateX: Animated.AnimatedInterpolation;
+            }[] | {
+                translateY: Animated.AnimatedInterpolation;
+            }[];
+        };
+    };
+}
+export interface DrawerInfo {
+    props: DrawerProps;
+}
+export interface DrawerSlotProps {
+    modal: ModalProps;
+    scrim: TouchableWithoutFeedbackProps;
+    scrimContent: Animated.AnimatedProps<ViewProps>;
+    content: Animated.AnimatedProps<ViewProps>;
+    handle: ViewProps;
+}
+export interface DrawerType {
+    props: DrawerProps;
+    tokens: DrawerTokens;
+    slotProps: DrawerSlotProps;
+}
+//# sourceMappingURL=Drawer.types.d.ts.map

package/lib-commonjs/Drawer.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.types.d.ts","sourceRoot":"","sources":["../src/Drawer.types.ts"],"names":[],"mappings":"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"}

package/lib-commonjs/Drawer.types.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DrawerName = void 0;
+exports.DrawerName = 'Drawer';
+//# sourceMappingURL=Drawer.types.js.map

package/lib-commonjs/Drawer.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.types.js","sourceRoot":"","sources":["../src/Drawer.types.ts"],"names":[],"mappings":";;;AAIa,QAAA,UAAU,GAAG,QAAQ,CAAC"}

package/lib-commonjs/DrawerTokens.d.ts

@@ -0,0 +1,5 @@
+import type { Theme } from '@fluentui-react-native/framework';
+import type { TokenSettings } from '@fluentui-react-native/use-styling';
+import type { DrawerTokens } from './Drawer.types';
+export declare const defaultDrawerTokens: TokenSettings<DrawerTokens, Theme>;
+//# sourceMappingURL=DrawerTokens.d.ts.map

package/lib-commonjs/DrawerTokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerTokens.d.ts","sourceRoot":"","sources":["../src/DrawerTokens.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAC;AAE9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAExE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD,eAAO,MAAM,mBAAmB,EAAE,aAAa,CAAC,YAAY,EAAE,KAAK,CAiC/C,CAAC"}

package/lib-commonjs/DrawerTokens.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultDrawerTokens = void 0;
+var theme_tokens_1 = require("@fluentui-react-native/theme-tokens");
+var defaultDrawerTokens = function (t) {
+    return ({
+        scrimColor: '#00000080',
+        drawerBackgroundColor: t.colors.neutralBackground2,
+        handleBackgroundColor: t.colors.neutralStroke1,
+        handleWidth: theme_tokens_1.globalTokens.size360,
+        handleHeight: theme_tokens_1.globalTokens.size40,
+        handleCornerRadius: theme_tokens_1.globalTokens.size20,
+        handleAlignment: 'center',
+        handleMarginTop: theme_tokens_1.globalTokens.size80,
+        handleMarginBottom: theme_tokens_1.globalTokens.sizeNone,
+        handleMarginEnd: theme_tokens_1.globalTokens.sizeNone,
+        handleMarginStart: theme_tokens_1.globalTokens.sizeNone,
+        drawerElevation: theme_tokens_1.globalTokens.size100,
+        topPosition: 0,
+        left: {
+            height: '100%',
+            width: '80%',
+            leftPosition: 0,
+            drawerCornerRadius: 0,
+        },
+        right: {
+            height: '100%',
+            width: '80%',
+            rightPosition: 0,
+            drawerCornerRadius: 0,
+        },
+        bottom: {
+            bottomPosition: 0,
+            width: '100%',
+            drawerCornerRadius: theme_tokens_1.globalTokens.corner.radius120,
+            height: '50%',
+        },
+    });
+};
+exports.defaultDrawerTokens = defaultDrawerTokens;
+//# sourceMappingURL=DrawerTokens.js.map

package/lib-commonjs/DrawerTokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerTokens.js","sourceRoot":"","sources":["../src/DrawerTokens.ts"],"names":[],"mappings":";;;AACA,oEAAmE;AAK5D,IAAM,mBAAmB,GAAuC,UAAC,CAAQ;IAC9E,OAAA,CAAC;QACC,UAAU,EAAE,WAAW;QACvB,qBAAqB,EAAE,CAAC,CAAC,MAAM,CAAC,kBAAkB;QAClD,qBAAqB,EAAE,CAAC,CAAC,MAAM,CAAC,cAAc;QAC9C,WAAW,EAAE,2BAAY,CAAC,OAAO;QACjC,YAAY,EAAE,2BAAY,CAAC,MAAM;QACjC,kBAAkB,EAAE,2BAAY,CAAC,MAAM;QACvC,eAAe,EAAE,QAAQ;QACzB,eAAe,EAAE,2BAAY,CAAC,MAAM;QACpC,kBAAkB,EAAE,2BAAY,CAAC,QAAQ;QACzC,eAAe,EAAE,2BAAY,CAAC,QAAQ;QACtC,iBAAiB,EAAE,2BAAY,CAAC,QAAQ;QACxC,eAAe,EAAE,2BAAY,CAAC,OAAO;QACrC,WAAW,EAAE,CAAC;QACd,IAAI,EAAE;YACJ,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,KAAK;YACZ,YAAY,EAAE,CAAC;YACf,kBAAkB,EAAE,CAAC;SACtB;QACD,KAAK,EAAE;YACL,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,KAAK;YACZ,aAAa,EAAE,CAAC;YAChB,kBAAkB,EAAE,CAAC;SACtB;QACD,MAAM,EAAE;YACN,cAAc,EAAE,CAAC;YACjB,KAAK,EAAE,MAAM;YACb,kBAAkB,EAAE,2BAAY,CAAC,MAAM,CAAC,SAAS;YACjD,MAAM,EAAE,KAAK;SACd;KACe,CAAA;AAhClB,CAgCkB,CAAC;AAjCR,QAAA,mBAAmB,uBAiCX"}

package/lib-commonjs/__tests__/Drawer.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Drawer.test.d.ts.map

package/lib-commonjs/__tests__/Drawer.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.test.d.ts","sourceRoot":"","sources":["../../src/__tests__/Drawer.test.tsx"],"names":[],"mappings":""}

package/lib-commonjs/__tests__/Drawer.test.js

@@ -0,0 +1,41 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var React = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var renderer = __importStar(require("react-test-renderer"));
+var Drawer_1 = require("../Drawer");
+// mocks out setTimeout and other timer functions with mock functions , test will fail without this as we're using Animated API
+jest.useFakeTimers();
+describe('Drawer component tests', function () {
+    it('Drawer default', function () {
+        var tree = renderer
+            .create(React.createElement(Drawer_1.Drawer, { open: false, drawerPosition: "left" },
+            React.createElement(react_native_1.Text, null, "Hello")))
+            .toJSON();
+        expect(tree).toMatchSnapshot();
+    });
+});
+//# sourceMappingURL=Drawer.test.js.map

package/lib-commonjs/__tests__/Drawer.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.test.js","sourceRoot":"","sources":["../../src/__tests__/Drawer.test.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,6CAAoC;AAEpC,4DAAgD;AAEhD,oCAAmC;AAEnC,+HAA+H;AAC/H,IAAI,CAAC,aAAa,EAAE,CAAC;AAErB,QAAQ,CAAC,wBAAwB,EAAE;IACjC,EAAE,CAAC,gBAAgB,EAAE;QACnB,IAAM,IAAI,GAAG,QAAQ;aAClB,MAAM,CACL,oBAAC,eAAM,IAAC,IAAI,EAAE,KAAK,EAAE,cAAc,EAAC,MAAM;YACxC,oBAAC,mBAAI,gBAAa,CACX,CACV;aACA,MAAM,EAAE,CAAC;QACZ,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/lib-commonjs/index.d.ts

@@ -0,0 +1,4 @@
+export { Drawer } from './Drawer';
+export type { DrawerProps, DrawerSlotProps, DrawerTokens, DrawerType, DrawerPositionType } from './Drawer.types';
+export { DrawerName } from './Drawer.types';
+//# sourceMappingURL=index.d.ts.map

package/lib-commonjs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACjH,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC"}

package/lib-commonjs/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DrawerName = exports.Drawer = void 0;
+var Drawer_1 = require("./Drawer");
+Object.defineProperty(exports, "Drawer", { enumerable: true, get: function () { return Drawer_1.Drawer; } });
+var Drawer_types_1 = require("./Drawer.types");
+Object.defineProperty(exports, "DrawerName", { enumerable: true, get: function () { return Drawer_types_1.DrawerName; } });
+//# sourceMappingURL=index.js.map

package/lib-commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,mCAAkC;AAAzB,gGAAA,MAAM,OAAA;AAEf,+CAA4C;AAAnC,0GAAA,UAAU,OAAA"}

package/lib-commonjs/useDrawer.d.ts

@@ -0,0 +1,3 @@
+import type { DrawerProps, DrawerInfo } from './Drawer.types';
+export declare const useDrawer: (props: DrawerProps) => DrawerInfo;
+//# sourceMappingURL=useDrawer.d.ts.map

package/lib-commonjs/useDrawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDrawer.d.ts","sourceRoot":"","sources":["../src/useDrawer.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAI9D,eAAO,MAAM,SAAS,UAAW,WAAW,KAAG,UAgF9C,CAAC"}

package/lib-commonjs/useDrawer.js

@@ -0,0 +1,89 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDrawer = void 0;
+var react_1 = require("react");
+var react_native_1 = require("react-native");
+var _a = react_native_1.Dimensions.get('window'), height = _a.height, width = _a.width;
+var useDrawer = function (props) {
+    var onBlur = props.onBlur, onFocus = props.onFocus, accessibilityLabel = props.accessibilityLabel, open = props.open, _a = props.drawerPosition, drawerPosition = _a === void 0 ? 'left' : _a, _b = props.showHandle, showHandle = _b === void 0 ? true : _b, children = props.children, rest = __rest(props, ["onBlur", "onFocus", "accessibilityLabel", "open", "drawerPosition", "showHandle", "children"]);
+    var animatedValue = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
+    var _c = (0, react_1.useState)(open), internalOpen = _c[0], setInternalOpen = _c[1];
+    var _d = (0, react_1.useState)(true), isFirstOpen = _d[0], setIsFirstOpen = _d[1];
+    (0, react_1.useEffect)(function () {
+        if (open) {
+            setInternalOpen(true);
+            react_native_1.Animated.timing(animatedValue, {
+                toValue: 1,
+                duration: 300,
+                useNativeDriver: true,
+            }).start();
+        }
+        else {
+            if (isFirstOpen) {
+                setIsFirstOpen(false);
+            }
+            else {
+                react_native_1.Animated.parallel([
+                    react_native_1.Animated.timing(animatedValue, {
+                        toValue: 0,
+                        duration: 300,
+                        useNativeDriver: true,
+                    }),
+                ]).start(function () {
+                    setInternalOpen(false);
+                });
+            }
+        }
+    }, [animatedValue, open]);
+    var onClose = (0, react_1.useCallback)(function (e) {
+        (props === null || props === void 0 ? void 0 : props.onClose) && props.onClose(e);
+    }, [props === null || props === void 0 ? void 0 : props.onClose]);
+    var onScrimClick = (0, react_1.useCallback)(function (e) {
+        (props === null || props === void 0 ? void 0 : props.onScrimClick) && props.onScrimClick(e);
+    }, [props === null || props === void 0 ? void 0 : props.onScrimClick]);
+    var animatedTranslateX = animatedValue.interpolate({
+        inputRange: [0, 1],
+        outputRange: drawerPosition === 'left' ? [-width * 0.8, 0] : drawerPosition === 'right' ? [width * 0.8, 0] : [0, 0],
+    });
+    var animatedTranslateY = animatedValue.interpolate({
+        inputRange: [0, 1],
+        outputRange: [height, height * 0.5],
+    });
+    var animatedOpacity = animatedValue.interpolate({
+        inputRange: [0, 1],
+        outputRange: [0, 0.5],
+    });
+    var animatedStyle = {
+        transform: drawerPosition === 'left' || drawerPosition === 'right' ? [{ translateX: animatedTranslateX }] : [{ translateY: animatedTranslateY }],
+    };
+    return {
+        props: __assign(__assign({}, rest), { onClose: onClose, onScrimClick: onScrimClick, animationConfig: {
+                animatedOpacity: animatedOpacity,
+                animatedStyle: animatedStyle,
+            }, drawerPosition: drawerPosition !== null && drawerPosition !== void 0 ? drawerPosition : 'left', children: children, showHandle: showHandle, open: internalOpen }),
+    };
+};
+exports.useDrawer = useDrawer;
+//# sourceMappingURL=useDrawer.js.map

package/lib-commonjs/useDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDrawer.js","sourceRoot":"","sources":["../src/useDrawer.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@fluentui-react-native/drawer",
+  "version": "0.1.0",
+  "description": "A cross-platform Drawer component using the Fluent Design System",
+  "main": "lib-commonjs/index.js",
+  "module": "lib/index.js",
+  "typings": "lib/index.d.ts",
+  "scripts": {
+    "build": "fluentui-scripts build",
+    "clean": "fluentui-scripts clean",
+    "depcheck": "fluentui-scripts depcheck",
+    "just": "fluentui-scripts",
+    "lint": "fluentui-scripts eslint",
+    "test": "fluentui-scripts jest",
+    "update-snapshots": "fluentui-scripts jest -u",
+    "prettier": "fluentui-scripts prettier",
+    "prettier-fix": "fluentui-scripts prettier --fix true"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/microsoft/fluentui-react-native.git",
+    "directory": "packages/components/Drawer"
+  },
+  "dependencies": {
+    "@fluentui-react-native/framework": "0.9.9",
+    "@fluentui-react-native/interactive-hooks": ">=0.22.30 <1.0.0",
+    "@fluentui-react-native/theme-tokens": "^0.24.6",
+    "@fluentui-react-native/use-styling": ">=0.9.4 <1.0.0"
+  },
+  "devDependencies": {
+    "@fluentui-react-native/eslint-config-rules": "^0.1.1",
+    "@fluentui-react-native/scripts": "^0.1.1",
+    "react": "17.0.2",
+    "react-native": "^0.68.0"
+  },
+  "peerDependencies": {
+    "react": "17.0.2",
+    "react-native": "^0.68.0"
+  },
+  "author": "",
+  "license": "MIT",
+  "rnx-kit": {
+    "kitType": "library",
+    "alignDeps": {
+      "presets": [
+        "microsoft/react-native"
+      ],
+      "requirements": [
+        "react-native@0.68"
+      ],
+      "capabilities": [
+        "core",
+        "core-android",
+        "core-ios",
+        "react"
+      ]
+    }
+  }
+}