@expo/styleguide-native 4.1.1 → 4.1.2

package/dist/icons/VersionIcon.js

@@ -18,13 +18,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function VersionIcon(props) {
     const { size, color, width, height } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 21 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M11.893 8.959l-.232 2.083H9.588l.232-2.083h2.073z", fill: color || "#000" }),
-        React.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M4.074 0A3.333 3.333 0 00.74 3.333v13.334A3.333 3.333 0 004.074 20h13.333a3.333 3.333 0 003.334-3.333V3.333A3.333 3.333 0 0017.407 0H4.074zm6.245 4.467a.833.833 0 00-1.657-.184l-.334 3.009H5.741a.833.833 0 000 1.667h2.402l-.232 2.083h-2.17a.833.833 0 000 1.667h1.985l-.314 2.824a.833.833 0 001.657.184l.334-3.008h2.073l-.314 2.824a.833.833 0 001.657.184l.334-3.008h2.588a.833.833 0 000-1.667h-2.403l.232-2.083h2.17a.833.833 0 000-1.667h-1.985l.314-2.825a.833.833 0 00-1.657-.184l-.334 3.009h-2.073l.314-2.825z", fill: color || "#000" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 21 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M11.893 8.959l-.232 2.083H9.588l.232-2.083h2.073z", fill: color || "#000" }),
+        react_1.default.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M4.074 0A3.333 3.333 0 00.74 3.333v13.334A3.333 3.333 0 004.074 20h13.333a3.333 3.333 0 003.334-3.333V3.333A3.333 3.333 0 0017.407 0H4.074zm6.245 4.467a.833.833 0 00-1.657-.184l-.334 3.009H5.741a.833.833 0 000 1.667h2.402l-.232 2.083h-2.17a.833.833 0 000 1.667h1.985l-.314 2.824a.833.833 0 001.657.184l.334-3.008h2.073l-.314 2.824a.833.833 0 001.657.184l.334-3.008h2.588a.833.833 0 000-1.667h-2.403l.232-2.083h2.17a.833.833 0 000-1.667h-1.985l.314-2.825a.833.833 0 00-1.657-.184l-.334 3.009h-2.073l.314-2.825z", fill: color || "#000" })));
 }
 exports.default = VersionIcon;

package/dist/icons/WarningIcon.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function WarningIcon(props: SvgProps & IconProps): JSX.Element;
+export default function WarningIcon(props: IconProps): JSX.Element;

package/dist/icons/WarningIcon.js

@@ -18,12 +18,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function WarningIcon(props) {
     const { size, color, width, height } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M8.102 1.477c.778-1.561 3.005-1.562 3.784-.001l7.564 15.16c.7 1.406-.322 3.059-1.892 3.059H2.442c-1.57 0-2.592-1.652-1.892-3.057l7.552-15.16zm3.784 4.475c0-.408-.218-.846-.534-1.172-.323-.333-.788-.594-1.331-.594-.542 0-1.016.26-1.348.59-.325.323-.56.761-.56 1.176 0 .318.125 1.963.247 3.5a809.363 809.363 0 00.225 2.77l.015.188.004.05v.004a1.416 1.416 0 002.833-.001v-.006l.004-.05.014-.187.05-.677c.043-.562.1-1.318.155-2.093.112-1.538.226-3.181.226-3.498zm-1.885 12.199a1.961 1.961 0 100-3.923 1.961 1.961 0 000 3.923z", fill: color || "#000", stroke: color || "#000", strokeWidth: 0.65 })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M8.102 1.477c.778-1.561 3.005-1.562 3.784-.001l7.564 15.16c.7 1.406-.322 3.059-1.892 3.059H2.442c-1.57 0-2.592-1.652-1.892-3.057l7.552-15.16zm3.784 4.475c0-.408-.218-.846-.534-1.172-.323-.333-.788-.594-1.331-.594-.542 0-1.016.26-1.348.59-.325.323-.56.761-.56 1.176 0 .318.125 1.963.247 3.5a809.363 809.363 0 00.225 2.77l.015.188.004.05v.004a1.416 1.416 0 002.833-.001v-.006l.004-.05.014-.187.05-.677c.043-.562.1-1.318.155-2.093.112-1.538.226-3.181.226-3.498zm-1.885 12.199a1.961 1.961 0 100-3.923 1.961 1.961 0 000 3.923z", fill: color || "#000", stroke: color || "#000", strokeWidth: 0.65 })));
 }
 exports.default = WarningIcon;

package/dist/icons/XIcon.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function XIcon(props: SvgProps & IconProps): JSX.Element;
+export default function XIcon(props: IconProps): JSX.Element;

package/dist/icons/XIcon.js

@@ -18,12 +18,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function XIcon(props) {
     const { size, color, width, height } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M15 5L5 15M5 5l10 10", stroke: color || "#000", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M15 5L5 15M5 5l10 10", stroke: color || "#000", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })));
 }
 exports.default = XIcon;

package/dist/icons/YoutubeIcon.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function YoutubeIcon(props: SvgProps & IconProps): JSX.Element;
+export default function YoutubeIcon(props: IconProps): JSX.Element;

package/dist/icons/YoutubeIcon.js

@@ -18,12 +18,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function YoutubeIcon(props) {
     const { size, color, width, height } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 21 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M11.064 2.498h.111c1.028.004 6.234.042 7.638.42a2.51 2.51 0 011.768 1.774c.127.474.215 1.105.276 1.753l.012.13.027.325.01.13c.082 1.143.091 2.212.093 2.446v.094a39.206 39.206 0 01-.103 2.576l-.01.13-.011.13c-.062.716-.155 1.426-.294 1.948a2.509 2.509 0 01-1.768 1.774c-1.45.39-6.962.418-7.726.42h-.176c-.387-.001-1.985-.009-3.66-.066l-.213-.008-.108-.004-.214-.008-.214-.01c-1.387-.06-2.709-.16-3.317-.324a2.509 2.509 0 01-1.768-1.774c-.14-.522-.232-1.232-.294-1.948l-.011-.13-.01-.13A39.25 39.25 0 01.998 9.6v-.153c.002-.268.012-1.198.08-2.223l.008-.128.005-.065.01-.13.026-.325.012-.13c.062-.648.15-1.279.277-1.753a2.51 2.51 0 011.768-1.774c.608-.164 1.93-.264 3.317-.325l.214-.009.214-.008.108-.004.214-.008c1.567-.054 3.068-.064 3.57-.065h.242zM8.999 6.512v6.022l5.196-3.01-5.196-3.012z", fill: color || "#000" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 21 20", fill: "none", width: size || width || 20, height: size || height || 20 }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M11.064 2.498h.111c1.028.004 6.234.042 7.638.42a2.51 2.51 0 011.768 1.774c.127.474.215 1.105.276 1.753l.012.13.027.325.01.13c.082 1.143.091 2.212.093 2.446v.094a39.206 39.206 0 01-.103 2.576l-.01.13-.011.13c-.062.716-.155 1.426-.294 1.948a2.509 2.509 0 01-1.768 1.774c-1.45.39-6.962.418-7.726.42h-.176c-.387-.001-1.985-.009-3.66-.066l-.213-.008-.108-.004-.214-.008-.214-.01c-1.387-.06-2.709-.16-3.317-.324a2.509 2.509 0 01-1.768-1.774c-.14-.522-.232-1.232-.294-1.948l-.011-.13-.01-.13A39.25 39.25 0 01.998 9.6v-.153c.002-.268.012-1.198.08-2.223l.008-.128.005-.065.01-.13.026-.325.012-.13c.062-.648.15-1.279.277-1.753a2.51 2.51 0 011.768-1.774c.608-.164 1.93-.264 3.317-.325l.214-.009.214-.008.108-.004.214-.008c1.567-.054 3.068-.064 3.57-.065h.242zM8.999 6.512v6.022l5.196-3.01-5.196-3.012z", fill: color || "#000" })));
 }
 exports.default = YoutubeIcon;

package/dist/index.d.ts

@@ -5,6 +5,7 @@ import { iconSize, borderRadius } from './styles/sizing';
 import { spacing } from './styles/spacing';
 import { breakpoints } from './styles/breakpoints';
 import { typography } from './styles/typography';
+import { IconProps } from 'types';
 export * from './icons';
 export * from './logos';
-export { borderRadius, breakpoints, darkTheme, iconSize, lightTheme, palette, shadows, spacing, typography, };
+export { borderRadius, breakpoints, darkTheme, iconSize, lightTheme, palette, shadows, spacing, typography, IconProps, };

package/dist/logos/DocsLogo.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function DocsLogo(props: SvgProps & IconProps): JSX.Element;
+export default function DocsLogo(props: IconProps): JSX.Element;

package/dist/logos/DocsLogo.js

@@ -18,13 +18,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function DocsLogo(props) {
     const { color } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M12.07 8a.157.157 0 01.166.015l5.374 4.141a.16.16 0 01.055.168l-.37 1.298a.157.157 0 01-.234.09l-4.416-2.768-.846 5.47a.157.157 0 01-.219.12l-1.158-.518a.157.157 0 01-.093-.154l.477-7.132a.157.157 0 01.085-.129L12.069 8z", fill: color || "#000" }),
-        React.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M9.584.02a.157.157 0 00-.157.001L.708 5.071l-.003.001a.157.157 0 00-.079.135V15.31c0 .056.03.108.079.136l1.71.984.004.003a.157.157 0 00.157 0l1.054-.61v1.183c0 .056.03.108.078.136l1.715.987a.157.157 0 00.156 0l.003-.002 2.024-1.172.91 2.934a.157.157 0 00.198.102l1.815-.594a.156.156 0 00.03-.013l8.732-4.666a.157.157 0 00.075-.186L16.06 4.258a.157.157 0 00-.205-.098l-1.473.529v-1.85a.157.157 0 00-.079-.135l-.002-.001-1.713-.986a.157.157 0 00-.156 0l-1.054.61V1.144a.157.157 0 00-.078-.136L9.584.02zM5.33 9.56l-.003-1.578-1.383-.805v9.74l1.4.806-.014-8.119a.156.156 0 010-.045zM.94 5.48l1.384.805.017 9.741-1.4-.806V5.48zm9.968-4.336l-1.4-.806-8.412 4.87 1.385.806 8.427-4.87zM5.483 7.71l8.427-4.87-1.4-.806-8.411 4.87 1.384.806zm5.09 11.313l-3.21-9.971 8.455-4.519 3.21 9.97-8.456 4.52zM5.678 9.678l3.09 9.967 1.514-.496-3.21-9.972-1.394.501z", fill: color || "#000" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M12.07 8a.157.157 0 01.166.015l5.374 4.141a.16.16 0 01.055.168l-.37 1.298a.157.157 0 01-.234.09l-4.416-2.768-.846 5.47a.157.157 0 01-.219.12l-1.158-.518a.157.157 0 01-.093-.154l.477-7.132a.157.157 0 01.085-.129L12.069 8z", fill: color || "#000" }),
+        react_1.default.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M9.584.02a.157.157 0 00-.157.001L.708 5.071l-.003.001a.157.157 0 00-.079.135V15.31c0 .056.03.108.079.136l1.71.984.004.003a.157.157 0 00.157 0l1.054-.61v1.183c0 .056.03.108.078.136l1.715.987a.157.157 0 00.156 0l.003-.002 2.024-1.172.91 2.934a.157.157 0 00.198.102l1.815-.594a.156.156 0 00.03-.013l8.732-4.666a.157.157 0 00.075-.186L16.06 4.258a.157.157 0 00-.205-.098l-1.473.529v-1.85a.157.157 0 00-.079-.135l-.002-.001-1.713-.986a.157.157 0 00-.156 0l-1.054.61V1.144a.157.157 0 00-.078-.136L9.584.02zM5.33 9.56l-.003-1.578-1.383-.805v9.74l1.4.806-.014-8.119a.156.156 0 010-.045zM.94 5.48l1.384.805.017 9.741-1.4-.806V5.48zm9.968-4.336l-1.4-.806-8.412 4.87 1.385.806 8.427-4.87zM5.483 7.71l8.427-4.87-1.4-.806-8.411 4.87 1.384.806zm5.09 11.313l-3.21-9.971 8.455-4.519 3.21 9.97-8.456 4.52zM5.678 9.678l3.09 9.967 1.514-.496-3.21-9.972-1.394.501z", fill: color || "#000" })));
 }
 exports.default = DocsLogo;

package/dist/logos/ExpoGoLogo.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function ExpoGoLogo(props: SvgProps & IconProps): JSX.Element;
+export default function ExpoGoLogo(props: IconProps): JSX.Element;

package/dist/logos/ExpoGoLogo.js

@@ -18,12 +18,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function ExpoGoLogo(props) {
     const { color } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M18.072 7.75a1.749 1.749 0 00-1.56-.732 1.763 1.763 0 00-1.436.946 1.55 1.55 0 00.302 1.75 2.57 2.57 0 001.716-.484 2.53 2.53 0 00.978-1.48zM12.866 1L11.751.394 6.897 3.072l.387.207.736.383 1.332-.733L12.867.987 12.866 1zm.449-.184a.173.173 0 01.124.115l1.626 4.755a.158.158 0 01-.077.207 3.126 3.126 0 00-1.384 1.519 3.09 3.09 0 00-.134 2.042 3.29 3.29 0 001.35 1.793 3.343 3.343 0 002.195.524.208.208 0 01.202.123l1.68 4.88a.196.196 0 01-.078.215l-5.163 2.992a.195.195 0 01-.078.015.208.208 0 01-.14-.022l-1.81-1.129a.18.18 0 01-.078-.076l-3.538-8.065-5.388 3.039a.25.25 0 01-.21.008l-1.224-.69a.177.177 0 01-.077-.23l5.234-9.847c.02-.033.05-.06.085-.076L11.65.023a.2.2 0 01.186 0l1.479.793zM6.843 3.46l-.256-.13-5.044 9.523.92.514 4.352-5.643a.212.212 0 01.178-.077.217.217 0 01.155.115l4.738 10.82 1.266.775L8.066 4.62l-.216-.614-1.014-.552.007.007zm7.804 5.679a1.932 1.932 0 01.092-1.28c.176-.404.484-.737.875-.945a2.152 2.152 0 012.509.307 1.934 1.934 0 01.056 2.745l-.056.056a2.118 2.118 0 01-1.986.516 2.118 2.118 0 01-.928-.508 2.091 2.091 0 01-.562-.891z", fill: color || "#000" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M18.072 7.75a1.749 1.749 0 00-1.56-.732 1.763 1.763 0 00-1.436.946 1.55 1.55 0 00.302 1.75 2.57 2.57 0 001.716-.484 2.53 2.53 0 00.978-1.48zM12.866 1L11.751.394 6.897 3.072l.387.207.736.383 1.332-.733L12.867.987 12.866 1zm.449-.184a.173.173 0 01.124.115l1.626 4.755a.158.158 0 01-.077.207 3.126 3.126 0 00-1.384 1.519 3.09 3.09 0 00-.134 2.042 3.29 3.29 0 001.35 1.793 3.343 3.343 0 002.195.524.208.208 0 01.202.123l1.68 4.88a.196.196 0 01-.078.215l-5.163 2.992a.195.195 0 01-.078.015.208.208 0 01-.14-.022l-1.81-1.129a.18.18 0 01-.078-.076l-3.538-8.065-5.388 3.039a.25.25 0 01-.21.008l-1.224-.69a.177.177 0 01-.077-.23l5.234-9.847c.02-.033.05-.06.085-.076L11.65.023a.2.2 0 01.186 0l1.479.793zM6.843 3.46l-.256-.13-5.044 9.523.92.514 4.352-5.643a.212.212 0 01.178-.077.217.217 0 01.155.115l4.738 10.82 1.266.775L8.066 4.62l-.216-.614-1.014-.552.007.007zm7.804 5.679a1.932 1.932 0 01.092-1.28c.176-.404.484-.737.875-.945a2.152 2.152 0 012.509.307 1.934 1.934 0 01.056 2.745l-.056.056a2.118 2.118 0 01-1.986.516 2.118 2.118 0 01-.928-.508 2.091 2.091 0 01-.562-.891z", fill: color || "#000" })));
 }
 exports.default = ExpoGoLogo;

package/dist/logos/Logo.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function Logo(props: SvgProps & IconProps): JSX.Element;
+export default function Logo(props: IconProps): JSX.Element;

package/dist/logos/Logo.js

@@ -18,12 +18,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function Logo(props) {
     const { color } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M9.477 7.638c.164-.24.343-.27.488-.27.145 0 .387.03.551.27 2.13 2.901 6.55 10.56 6.959 10.976.605.618 1.436.233 1.918-.468.475-.69.607-1.174.607-1.69 0-.352-6.883-13.05-7.576-14.106-.667-1.017-.884-1.274-2.025-1.274h-.854c-1.138 0-1.302.257-1.969 1.274C6.883 3.406 0 16.104 0 16.456c0 .517.132 1 .607 1.69.482.7 1.313 1.086 1.918.468.41-.417 4.822-8.075 6.952-10.977z", fill: color || "#000" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M9.477 7.638c.164-.24.343-.27.488-.27.145 0 .387.03.551.27 2.13 2.901 6.55 10.56 6.959 10.976.605.618 1.436.233 1.918-.468.475-.69.607-1.174.607-1.69 0-.352-6.883-13.05-7.576-14.106-.667-1.017-.884-1.274-2.025-1.274h-.854c-1.138 0-1.302.257-1.969 1.274C6.883 3.406 0 16.104 0 16.456c0 .517.132 1 .607 1.69.482.7 1.313 1.086 1.918.468.41-.417 4.822-8.075 6.952-10.977z", fill: color || "#000" })));
 }
 exports.default = Logo;

package/dist/logos/SnackLogo.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function SnackLogo(props: SvgProps & IconProps): JSX.Element;
+export default function SnackLogo(props: IconProps): JSX.Element;

package/dist/logos/SnackLogo.js

@@ -18,13 +18,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function SnackLogo(props) {
     const { color } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
-        React.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M17.168 1.152a2.752 2.752 0 100 5.504 2.752 2.752 0 000-5.504zm-2.43 2.752a2.429 2.429 0 014.608-1.075 3.805 3.805 0 01-3.701 2.925h-.051a2.423 2.423 0 01-.855-1.85zm-1.755-1.422a.16.16 0 01.081.14v4.825L17.23 9.86c.05.029.081.082.082.14l.026 4.92a.16.16 0 01-.081.14l-8.52 4.92a.161.161 0 01-.242-.14V10c0-.057.03-.11.08-.14l4.006-2.319-4.005-2.32a.161.161 0 010-.28l4.246-2.458a.161.161 0 01.162 0zm3.845 7.517L13.064 7.82v4.36L16.828 10zM8.978 5.08l3.764 2.18V2.901l-3.763 2.18z", fill: color || "#000" }),
-        React.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M8.75.022a.161.161 0 00-.162 0l-4.242 2.46a.16.16 0 00-.019.01L.11 4.94l-.003.001a.161.161 0 00-.081.136v.004l-.013 4.994a.161.161 0 000 .125L0 14.92c0 .058.03.111.08.14l4.24 2.455.03.018 4.226 2.446a.161.161 0 00.242-.14v-9.746l4.166-2.412a.162.162 0 000-.28l-.081-.046V2.808l.08-.047a.162.162 0 000-.28L8.75.022zm3.828 2.597L8.67.35 4.74 2.626l3.917 2.267 3.922-2.275zM8.656 5.268L4.74 7.538l3.916 2.275L12.58 7.54 8.656 5.268zM4.419 7.352l3.915-2.27-3.916-2.268L.508 5.08 4.42 7.35zm-.165.277v4.692L.336 10.05l.012-4.69 3.906 2.268zm.323 4.879V7.817l3.918 2.275v4.685l-3.918-2.27zm-.323.186l-3.92-2.27-.01 4.403 3.93 2.276v-4.41zm.323 4.596v-4.41l3.918 2.27v4.408L4.577 17.29z", fill: color || "#000" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 20 20", fill: "none" }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M17.168 1.152a2.752 2.752 0 100 5.504 2.752 2.752 0 000-5.504zm-2.43 2.752a2.429 2.429 0 014.608-1.075 3.805 3.805 0 01-3.701 2.925h-.051a2.423 2.423 0 01-.855-1.85zm-1.755-1.422a.16.16 0 01.081.14v4.825L17.23 9.86c.05.029.081.082.082.14l.026 4.92a.16.16 0 01-.081.14l-8.52 4.92a.161.161 0 01-.242-.14V10c0-.057.03-.11.08-.14l4.006-2.319-4.005-2.32a.161.161 0 010-.28l4.246-2.458a.161.161 0 01.162 0zm3.845 7.517L13.064 7.82v4.36L16.828 10zM8.978 5.08l3.764 2.18V2.901l-3.763 2.18z", fill: color || "#000" }),
+        react_1.default.createElement(react_native_svg_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M8.75.022a.161.161 0 00-.162 0l-4.242 2.46a.16.16 0 00-.019.01L.11 4.94l-.003.001a.161.161 0 00-.081.136v.004l-.013 4.994a.161.161 0 000 .125L0 14.92c0 .058.03.111.08.14l4.24 2.455.03.018 4.226 2.446a.161.161 0 00.242-.14v-9.746l4.166-2.412a.162.162 0 000-.28l-.081-.046V2.808l.08-.047a.162.162 0 000-.28L8.75.022zm3.828 2.597L8.67.35 4.74 2.626l3.917 2.267 3.922-2.275zM8.656 5.268L4.74 7.538l3.916 2.275L12.58 7.54 8.656 5.268zM4.419 7.352l3.915-2.27-3.916-2.268L.508 5.08 4.42 7.35zm-.165.277v4.692L.336 10.05l.012-4.69 3.906 2.268zm.323 4.879V7.817l3.918 2.275v4.685l-3.918-2.27zm-.323.186l-3.92-2.27-.01 4.403 3.93 2.276v-4.41zm.323 4.596v-4.41l3.918 2.27v4.408L4.577 17.29z", fill: color || "#000" })));
 }
 exports.default = SnackLogo;

package/dist/logos/WordMarkLogo.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { SvgProps } from "react-native-svg";
 import { IconProps } from "../types";
-export default function WordMarkLogo(props: SvgProps & IconProps): JSX.Element;
+export default function WordMarkLogo(props: IconProps): JSX.Element;

package/dist/logos/WordMarkLogo.js

@@ -18,12 +18,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const react_native_svg_1 = __importStar(require("react-native-svg"));
 function WordMarkLogo(props) {
     const { color } = props;
-    return (React.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 71 20", fill: "none" }, props),
-        React.createElement(react_native_svg_1.Path, { d: "M9.258 6.342c.158-.23.331-.26.472-.26.14 0 .374.03.532.26 2.06 2.806 6.332 10.208 6.727 10.611.585.597 1.388.225 1.854-.452.46-.667.587-1.135.587-1.634 0-.34-6.653-12.614-7.324-13.636C11.462.248 11.252 0 10.15 0h-.825c-1.1 0-1.259.248-1.903 1.23C6.75 2.254.097 14.528.097 14.868c0 .5.127.967.587 1.634.466.677 1.269 1.05 1.854.452.395-.403 4.661-7.805 6.72-10.61zm14.941-5.237v15.344h9.35v-3.113h-6.125v-3.244h5.45V6.98h-5.45V4.218h6.125V1.105h-9.35zM46.25 16.449l-3.88-5.568 3.619-5.195h-3.662L40.54 8.23l-1.765-2.543h-3.706l3.618 5.217-3.857 5.546h3.661l2.027-2.915 2.027 2.915h3.705zm7.572-10.982c-1.482 0-2.637.614-3.378 1.732V5.686H47.37V20h3.073v-5.063c.74 1.117 1.896 1.731 3.378 1.731 2.768 0 4.97-2.52 4.97-5.611 0-3.091-2.202-5.59-4.97-5.59zm-.697 8.242c-1.504 0-2.681-1.14-2.681-2.652 0-1.49 1.177-2.653 2.68-2.653 1.483 0 2.681 1.184 2.681 2.653 0 1.49-1.198 2.652-2.68 2.652zm12.188-8.242c-3.16 0-5.558 2.411-5.558 5.612 0 3.2 2.397 5.59 5.557 5.59 3.139 0 5.558-2.39 5.558-5.59 0-3.2-2.42-5.612-5.558-5.612zm0 2.96c1.438 0 2.55 1.117 2.55 2.652 0 1.49-1.112 2.63-2.55 2.63-1.46 0-2.55-1.14-2.55-2.63 0-1.535 1.09-2.653 2.55-2.653z", fill: color || "#000" })));
+    return (react_1.default.createElement(react_native_svg_1.default, Object.assign({ viewBox: "0 0 71 20", fill: "none" }, props),
+        react_1.default.createElement(react_native_svg_1.Path, { d: "M9.258 6.342c.158-.23.331-.26.472-.26.14 0 .374.03.532.26 2.06 2.806 6.332 10.208 6.727 10.611.585.597 1.388.225 1.854-.452.46-.667.587-1.135.587-1.634 0-.34-6.653-12.614-7.324-13.636C11.462.248 11.252 0 10.15 0h-.825c-1.1 0-1.259.248-1.903 1.23C6.75 2.254.097 14.528.097 14.868c0 .5.127.967.587 1.634.466.677 1.269 1.05 1.854.452.395-.403 4.661-7.805 6.72-10.61zm14.941-5.237v15.344h9.35v-3.113h-6.125v-3.244h5.45V6.98h-5.45V4.218h6.125V1.105h-9.35zM46.25 16.449l-3.88-5.568 3.619-5.195h-3.662L40.54 8.23l-1.765-2.543h-3.706l3.618 5.217-3.857 5.546h3.661l2.027-2.915 2.027 2.915h3.705zm7.572-10.982c-1.482 0-2.637.614-3.378 1.732V5.686H47.37V20h3.073v-5.063c.74 1.117 1.896 1.731 3.378 1.731 2.768 0 4.97-2.52 4.97-5.611 0-3.091-2.202-5.59-4.97-5.59zm-.697 8.242c-1.504 0-2.681-1.14-2.681-2.652 0-1.49 1.177-2.653 2.68-2.653 1.483 0 2.681 1.184 2.681 2.653 0 1.49-1.198 2.652-2.68 2.652zm12.188-8.242c-3.16 0-5.558 2.411-5.558 5.612 0 3.2 2.397 5.59 5.557 5.59 3.139 0 5.558-2.39 5.558-5.59 0-3.2-2.42-5.612-5.558-5.612zm0 2.96c1.438 0 2.55 1.117 2.55 2.652 0 1.49-1.112 2.63-2.55 2.63-1.46 0-2.55-1.14-2.55-2.63 0-1.535 1.09-2.653 2.55-2.653z", fill: color || "#000" })));
 }
 exports.default = WordMarkLogo;

package/dist/styles/themes.d.ts

@@ -8,6 +8,7 @@ export declare const lightTheme: {
         error: string;
         warning: string;
         success: string;
+        info: string;
         overlay: string;
     };
     border: {
@@ -15,6 +16,7 @@ export declare const lightTheme: {
         error: string;
         success: string;
         warning: string;
+        info: string;
     };
     button: {
         primary: {
@@ -59,6 +61,7 @@ export declare const lightTheme: {
         error: string;
         warning: string;
         success: string;
+        info: string;
     };
     code: {
         keyword: string;
@@ -95,6 +98,7 @@ export declare const darkTheme: {
         error: string;
         warning: string;
         success: string;
+        info: string;
         overlay: string;
     };
     border: {
@@ -102,6 +106,7 @@ export declare const darkTheme: {
         error: string;
         success: string;
         warning: string;
+        info: string;
     };
     button: {
         primary: {
@@ -146,6 +151,7 @@ export declare const darkTheme: {
         error: string;
         warning: string;
         success: string;
+        info: string;
     };
     code: {
         keyword: string;

package/dist/styles/themes.js

@@ -12,6 +12,7 @@ exports.lightTheme = {
         error: palette_1.palette.light.red[100],
         warning: palette_1.palette.light.yellow[100],
         success: palette_1.palette.light.green[100],
+        info: palette_1.palette.light.blue[100],
         overlay: palette_1.palette.light.white,
     },
     border: {
@@ -19,6 +20,7 @@ exports.lightTheme = {
         error: palette_1.palette.light.red[300],
         success: palette_1.palette.light.green[300],
         warning: palette_1.palette.light.yellow[300],
+        info: palette_1.palette.light.blue[300],
     },
     button: {
         primary: {
@@ -63,6 +65,7 @@ exports.lightTheme = {
         error: palette_1.palette.light.red[600],
         warning: palette_1.palette.light.yellow[900],
         success: palette_1.palette.light.green[600],
+        info: palette_1.palette.light.blue[600],
     },
     code: {
         keyword: palette_1.palette.light.blue[500],
@@ -91,7 +94,7 @@ exports.lightTheme = {
 };
 exports.darkTheme = {
     background: {
-        default: palette_1.palette.dark.gray['100'],
+        default: palette_1.palette.dark.gray[100],
         screen: palette_1.palette.dark.gray['000'],
         secondary: palette_1.palette.dark.gray[200],
         tertiary: palette_1.palette.dark.gray[300],
@@ -99,6 +102,7 @@ exports.darkTheme = {
         error: palette_1.palette.dark.red['000'],
         warning: palette_1.palette.dark.yellow['000'],
         success: palette_1.palette.dark.green['000'],
+        info: palette_1.palette.dark.blue['000'],
         overlay: palette_1.palette.dark.gray[200],
     },
     border: {
@@ -106,6 +110,7 @@ exports.darkTheme = {
         error: palette_1.palette.dark.red[200],
         success: palette_1.palette.dark.green[200],
         warning: palette_1.palette.dark.yellow[200],
+        info: palette_1.palette.dark.blue[200],
     },
     button: {
         primary: {
@@ -150,6 +155,7 @@ exports.darkTheme = {
         error: palette_1.palette.dark.red[600],
         warning: palette_1.palette.dark.yellow[900],
         success: palette_1.palette.dark.green[600],
+        info: palette_1.palette.dark.blue[700],
     },
     code: {
         keyword: palette_1.palette.dark.blue[600],

package/dist/types/index.d.ts

@@ -1,3 +1,4 @@
-export declare type IconProps = {
+import { SvgProps } from "react-native-svg";
+export declare type IconProps = SvgProps & {
     size?: number;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@expo/styleguide-native",
-  "version": "4.1.1",
+  "version": "4.1.2",
   "description": "Foundational styles for Expo interfaces.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",