@webiny/ui 0.0.0-mt-1

package/TopAppBar/TopAppBarTitle.js

@@ -0,0 +1,13 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["children"];
+import * as React from "react";
+import { TopAppBarTitle as RmwcTopAppBarTitle } from "@rmwc/top-app-bar";
+
+var TopAppBarTitle = function TopAppBarTitle(props) {
+  var children = props.children,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/React.createElement(RmwcTopAppBarTitle, rest, children);
+};
+
+export { TopAppBarTitle };

package/TopAppBar/icons/baseline-autorenew-24px.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+    <path d="M12 6v3l4-4-4-4v3c-4.42 0-8 3.58-8 8 0 1.57.46 3.03 1.24 4.26L6.7 14.8c-.45-.83-.7-1.79-.7-2.8 0-3.31 2.69-6 6-6zm6.76 1.74L17.3 9.2c.44.84.7 1.79.7 2.8 0 3.31-2.69 6-6 6v-3l-4 4 4 4v-3c4.42 0 8-3.58 8-8 0-1.57-.46-3.03-1.24-4.26z"/>
+    <path d="M0 0h24v24H0z" fill="none"/>
+</svg>

package/TopAppBar/icons/baseline-cloud_done-24px.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+    <path d="M0 0h24v24H0z" fill="none"/>
+    <path d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM10 17l-3.5-3.5 1.41-1.41L10 14.17 15.18 9l1.41 1.41L10 17z"/>
+</svg>

package/TopAppBar/icons/baseline-delete-24px.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+    <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/>
+    <path d="M0 0h24v24H0z" fill="none"/>
+</svg>

package/TopAppBar/icons/baseline-email-24px.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+    <path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/>
+    <path d="M0 0h24v24H0z" fill="none"/>
+</svg>

package/TopAppBar/icons/baseline-menu-24px.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+    <path d="M0 0h24v24H0z" fill="none"/>
+    <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/>
+</svg>

package/TopAppBar/index.d.ts

@@ -0,0 +1,7 @@
+export * from "./TopAppBar";
+export * from "./TopAppBarPrimary";
+export * from "./TopAppBarSecondary";
+export * from "./TopAppBarSection";
+export * from "./TopAppBarTitle";
+export * from "./TopAppBarNavigationIcon";
+export * from "./TopAppBarActionItem";

package/TopAppBar/index.js

@@ -0,0 +1,7 @@
+export * from "./TopAppBar";
+export * from "./TopAppBarPrimary";
+export * from "./TopAppBarSecondary";
+export * from "./TopAppBarSection";
+export * from "./TopAppBarTitle";
+export * from "./TopAppBarNavigationIcon";
+export * from "./TopAppBarActionItem";

package/TopProgressBar/README.md

@@ -0,0 +1,11 @@
+# TopProgressBar
+
+### Description
+
+Use `TopProgressBar` to let users know their actions are being processed.
+
+### Import
+
+```js
+import { TopProgressBar } from "@webiny/ui/TopProgressBar";
+```

package/TopProgressBar/TopProgressBar.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import nprogress from "nprogress";
+import "./style.scss";
+export declare type TopProgressBarRender = {
+    start: () => void;
+    finish: () => void;
+    nprogress: nprogress;
+};
+export declare type TopProgressBarProps = {
+    /**
+     * Elements that require top loading bar to be shown.
+     */
+    children: (params: TopProgressBarRender) => React.ReactElement;
+};
+export declare const TopProgressBar: (props: TopProgressBarProps) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)>) | (new (props: any) => React.Component<any, any, any>)>;

package/TopProgressBar/TopProgressBar.js

@@ -0,0 +1,9 @@
+import nprogress from "nprogress";
+import "./style.scss";
+export var TopProgressBar = function TopProgressBar(props) {
+  return props.children({
+    start: nprogress.start,
+    finish: nprogress.done,
+    nprogress: nprogress
+  });
+};

package/TopProgressBar/TopProgressBar.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/TopProgressBar/TopProgressBar.stories.js

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { storiesOf } from "@storybook/react";
+import { Story, StoryReadme, StorySandboxCode, StorySandbox, StorySandboxExample } from "@webiny/storybook-utils/Story";
+import readme from "./../TopProgressBar/README.md";
+import { ButtonPrimary } from "./../Button";
+import { TopProgressBar } from "./TopProgressBar";
+var story = storiesOf("Components/TopProgressBar", module);
+story.add("usage", function () {
+  return /*#__PURE__*/React.createElement(Story, null, /*#__PURE__*/React.createElement(StoryReadme, null, readme), /*#__PURE__*/React.createElement(StorySandbox, null, /*#__PURE__*/React.createElement(StorySandboxExample, null, /*#__PURE__*/React.createElement(TopProgressBar, null, function (_ref) {
+    var start = _ref.start,
+        finish = _ref.finish;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ButtonPrimary, {
+      onClick: start
+    }, "Start"), "\xA0", /*#__PURE__*/React.createElement(ButtonPrimary, {
+      onClick: finish
+    }, "Done"));
+  })), /*#__PURE__*/React.createElement(StorySandboxCode, null, "\n                    <TopProgressBar>\n                        {({start, done}) => (\n                            <React.Fragment>\n                                <ButtonPrimary onClick={start}>Start</ButtonPrimary>\n                                <ButtonPrimary onClick={done}>Done</ButtonPrimary>\n                            </React.Fragment>\n                        )}\n                    </TopProgressBar>\n                    ")));
+}, {
+  info: {
+    propTables: [TopProgressBar]
+  }
+});

package/TopProgressBar/hoc/index.d.ts

@@ -0,0 +1 @@
+export { default as withTopProgressBar } from "./withTopProgressBar";

package/TopProgressBar/hoc/index.js

@@ -0,0 +1 @@
+export { default as withTopProgressBar } from "./withTopProgressBar";

package/TopProgressBar/hoc/withTopProgressBar.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare const withTopProgressBar: () => (BaseComponent: React.ComponentType<any>) => (props: any) => JSX.Element;
+export default withTopProgressBar;

package/TopProgressBar/hoc/withTopProgressBar.js

@@ -0,0 +1,23 @@
+import * as React from "react";
+import { TopProgressBar } from "..";
+
+var withTopProgressBar = function withTopProgressBar() {
+  return function (BaseComponent) {
+    var WithTopProgressBar = function WithTopProgressBar(props) {
+      return /*#__PURE__*/React.createElement(TopProgressBar, null, function (_ref) {
+        var start = _ref.start,
+            finish = _ref.finish,
+            nprogress = _ref.nprogress;
+        return /*#__PURE__*/React.createElement(BaseComponent, Object.assign({}, props, {
+          startTopProgressBar: start,
+          finishTopProgressBar: finish,
+          nprogress: nprogress
+        }));
+      });
+    };
+
+    return WithTopProgressBar;
+  };
+};
+
+export default withTopProgressBar;

package/TopProgressBar/index.d.ts

@@ -0,0 +1 @@
+export * from "./TopProgressBar";

package/TopProgressBar/index.js

@@ -0,0 +1 @@
+export * from "./TopProgressBar";

package/TopProgressBar/style.scss

@@ -0,0 +1,21 @@
+/* Make clicks pass-through */
+#nprogress {
+  pointer-events: none;
+}
+
+#nprogress .bar {
+  background: var(--mdc-theme-secondary);
+
+  position: fixed;
+  z-index: 1031;
+  top: 64px;
+  left: 0;
+
+  width: 100%;
+  height: 2px;
+}
+
+/* Fancy blur effect */
+#nprogress .peg {
+  display: none;
+}

package/Typography/README.md

@@ -0,0 +1,15 @@
+# Typography
+
+### Design
+
+<a href="https://material.io/design/typography/the-type-system.html" target="_blank">https://material.io/design/typography/the-type-system.html</a>
+
+### Description
+
+`Typography` component is used to represent different text sizes and styles.
+
+### Import
+
+```js
+import { Typography } from "@webiny/ui/Typography";
+```

package/Typography/Typography.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import { TypographyProps as RmwcTypographyProps } from "@rmwc/typography";
+declare type TypographyProps = RmwcTypographyProps & {
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+    tag?: string;
+};
+/**
+ * Use Ripple component to display a list of choices, once the handler is triggered.
+ */
+declare const Typography: (props: TypographyProps) => JSX.Element;
+export { Typography };

package/Typography/Typography.js

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { Typography as RwmcTypography } from "@rmwc/typography";
+
+/**
+ * Use Ripple component to display a list of choices, once the handler is triggered.
+ */
+var Typography = function Typography(props) {
+  return /*#__PURE__*/React.createElement(RwmcTypography, props, props.children);
+};
+
+export { Typography };

package/Typography/Typography.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/Typography/Typography.stories.js

@@ -0,0 +1,67 @@
+import * as React from "react";
+import { storiesOf } from "@storybook/react";
+import { Story, StoryReadme, StorySandboxCode, StorySandbox, StorySandboxExample } from "@webiny/storybook-utils/Story";
+import readme from "./README.md";
+import { Typography } from "./Typography";
+var story = storiesOf("Components/Typography", module);
+story.add("usage", function () {
+  return /*#__PURE__*/React.createElement(Story, null, /*#__PURE__*/React.createElement(StoryReadme, null, readme), /*#__PURE__*/React.createElement(StorySandbox, {
+    title: "Typography styles"
+  }, /*#__PURE__*/React.createElement(StorySandboxExample, null, /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "headline1"
+  }, "headline1")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "headline2"
+  }, "headline2")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "headline3"
+  }, "headline3")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "headline4"
+  }, "headline4")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "headline5"
+  }, "headline5")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "headline6"
+  }, "headline6")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "subtitle1"
+  }, "subtitle1")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "subtitle2"
+  }, "subtitle2")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "body1"
+  }, "body1")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "body2"
+  }, "body2")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "caption"
+  }, "caption")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "button"
+  }, "button")), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "overline"
+  }, "overline")))), /*#__PURE__*/React.createElement(StorySandboxCode, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Typography, {
+    use: "headline1"
+  }, "headline1"), /*#__PURE__*/React.createElement(Typography, {
+    use: "headline2"
+  }, "headline2"), /*#__PURE__*/React.createElement(Typography, {
+    use: "headline3"
+  }, "headline3"), /*#__PURE__*/React.createElement(Typography, {
+    use: "headline4"
+  }, "headline4"), /*#__PURE__*/React.createElement(Typography, {
+    use: "headline5"
+  }, "headline5"), /*#__PURE__*/React.createElement(Typography, {
+    use: "headline6"
+  }, "headline6"), /*#__PURE__*/React.createElement(Typography, {
+    use: "subtitle1"
+  }, "subtitle1"), /*#__PURE__*/React.createElement(Typography, {
+    use: "subtitle2"
+  }, "subtitle2"), /*#__PURE__*/React.createElement(Typography, {
+    use: "body1"
+  }, "body1"), /*#__PURE__*/React.createElement(Typography, {
+    use: "body2"
+  }, "body2"), /*#__PURE__*/React.createElement(Typography, {
+    use: "caption"
+  }, "caption"), /*#__PURE__*/React.createElement(Typography, {
+    use: "button"
+  }, "button"), /*#__PURE__*/React.createElement(Typography, {
+    use: "overline"
+  }, "overline")))));
+}, {
+  info: {
+    propTables: [Typography]
+  }
+});

package/Typography/index.d.ts

@@ -0,0 +1 @@
+export * from "./Typography";

package/Typography/index.js

@@ -0,0 +1 @@
+export * from "./Typography";

package/package.json

@@ -0,0 +1,142 @@
+{
+	"name": "@webiny/ui",
+	"version": "0.0.0-mt-1",
+	"main": "index.js",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/webiny/webiny-js.git"
+	},
+	"description": "A collection of material-design based components, for all of your UI development needs.",
+	"contributors": [
+		"Pavel Denisjuk <pavel@webiny.com>",
+		"Sven Al Hamad <sven@webiny.com>",
+		"Adrian Smijulj <adrian@webiny.com>"
+	],
+	"license": "MIT",
+	"dependencies": {
+		"@babel/runtime": "7.15.4",
+		"@editorjs/editorjs": "2.22.3",
+		"@emotion/core": "10.1.1",
+		"@emotion/styled": "10.0.27",
+		"@material/base": "3.1.0",
+		"@material/textfield": "3.2.0",
+		"@rmwc/base": "5.7.2",
+		"@rmwc/button": "5.7.2",
+		"@rmwc/checkbox": "5.7.2",
+		"@rmwc/chip": "5.7.2",
+		"@rmwc/dialog": "5.7.2",
+		"@rmwc/drawer": "5.7.2",
+		"@rmwc/elevation": "5.7.2",
+		"@rmwc/fab": "5.7.2",
+		"@rmwc/floating-label": "5.7.2",
+		"@rmwc/grid": "5.7.2",
+		"@rmwc/icon": "5.7.2",
+		"@rmwc/icon-button": "5.7.2",
+		"@rmwc/line-ripple": "5.7.2",
+		"@rmwc/list": "5.7.2",
+		"@rmwc/menu": "5.7.2",
+		"@rmwc/notched-outline": "5.7.2",
+		"@rmwc/radio": "5.7.2",
+		"@rmwc/ripple": "5.7.2",
+		"@rmwc/select": "5.7.2",
+		"@rmwc/slider": "5.7.2",
+		"@rmwc/snackbar": "5.7.2",
+		"@rmwc/switch": "5.7.2",
+		"@rmwc/tabs": "5.7.2",
+		"@rmwc/textfield": "file:./rmwc/textfield",
+		"@rmwc/top-app-bar": "5.7.2",
+		"@rmwc/types": "5.6.0",
+		"@rmwc/typography": "5.7.2",
+		"@svgr/webpack": "4.3.3",
+		"brace": "0.11.1",
+		"classnames": "2.3.1",
+		"cropperjs": "1.5.12",
+		"dot-prop-immutable": "2.1.1",
+		"downshift": "2.2.3",
+		"emotion": "10.0.17",
+		"keycode": "2.2.0",
+		"load-script": "1.0.0",
+		"lodash": "4.17.21",
+		"material-components-web": "3.2.0",
+		"nprogress": "0.2.0",
+		"nuka-carousel": "4.7.1",
+		"rc-tooltip": "3.7.3",
+		"react-ace": "6.6.0",
+		"react-butterfiles": "1.3.3",
+		"react-color": "2.19.3",
+		"react-columned": "1.1.3",
+		"react-custom-scrollbars": "4.2.1",
+		"react-loading-skeleton": "0.5.0",
+		"react-spinner-material": "1.1.4",
+		"react-transition-group": "4.4.2",
+		"shortid": "2.2.16"
+	},
+	"devDependencies": {
+		"@babel/cli": "^7.5.5",
+		"@babel/core": "^7.5.5",
+		"@babel/plugin-proposal-class-properties": "^7.5.5",
+		"@babel/preset-env": "^7.5.5",
+		"@babel/preset-typescript": "^7.8.3",
+		"@storybook/addon-info": "^5.2.8",
+		"@storybook/addon-knobs": "^5.0.5",
+		"@storybook/addon-links": "^5.0.5",
+		"@storybook/react": "^5.2.8",
+		"@webiny/cli": "^0.0.0-mt-1",
+		"@webiny/form": "^0.0.0-mt-1",
+		"@webiny/project-utils": "^0.0.0-mt-1",
+		"@webiny/storybook-utils": "^0.0.0-mt-1",
+		"@webiny/validation": "^0.0.0-mt-1",
+		"babel-loader": "^8.0.0-beta.6",
+		"babel-plugin-emotion": "^9.2.8",
+		"babel-plugin-named-asset-import": "^1.0.0-next.3e165448",
+		"execa": "^5.0.0",
+		"jest-dom": "^3.0.0",
+		"ncp": "^2.0.0",
+		"raw-loader": "^0.5.1",
+		"react-docgen": "^5.0.0",
+		"react-docgen-typescript-loader": "^3.6.0",
+		"react-testing-library": "^8.0.1",
+		"regenerator-runtime": "^0.13.2",
+		"rimraf": "^3.0.2",
+		"sass": "^1.38.0",
+		"sass-loader": "^12.1.0",
+		"typescript": "^4.1.3",
+		"webpack": "^4.46.0"
+	},
+	"peerDependencies": {
+		"react": "16.14.0",
+		"react-dom": "16.14.0"
+	},
+	"publishConfig": {
+		"access": "public",
+		"directory": "dist"
+	},
+	"scripts": {
+		"build": "yarn webiny run build",
+		"watch": "yarn webiny run watch",
+		"storybook": "start-storybook -p 6006",
+		"build-storybook": "build-storybook -c .storybook -o ${OUT:-.out}"
+	},
+	"jest": {
+		"transform": {
+			"^.+\\.js$": "babel-jest"
+		},
+		"setupTestFrameworkScriptFile": "jest-extended"
+	},
+	"svgo": {
+		"plugins": {
+			"removeViewBox": false
+		}
+	},
+	"adio": {
+		"ignore": {
+			"dependencies": [
+				"@svgr/webpack",
+				"material-components-web",
+				"@emotion/core",
+				"@rmwc/base"
+			]
+		}
+	},
+	"gitHead": "37736d8456a6ecb342a6c3645060bd9a3f2d4bb0"
+}

package/rmwc/textfield/code/index.d.ts

@@ -0,0 +1,135 @@
+/* eslint-disable */
+import * as RMWC from '@rmwc/types';
+import * as React from 'react';
+import { IconProps } from '@rmwc/icon';
+import { SpecificEventListener } from '@material/base/types';
+import { MDCTextFieldFoundation, MDCTextFieldIconFoundation, MDCTextFieldCharacterCounterFoundation } from '@material/textfield';
+import { FoundationComponent } from '@rmwc/base';
+/*********************************************************************
+ * TextField
+ *********************************************************************/
+/** A TextField component for accepting text input from a user. */
+export interface TextFieldProps {
+    /** Sets the value for controlled TextFields. */
+    value?: string | number;
+    /** Adds help text to the field */
+    helpText?: React.ReactNode | TextFieldHelperTextProps;
+    /** Shows the character count, must be used in conjunction with maxLength. */
+    characterCount?: boolean;
+    /** Makes the TextField visually invalid. This is sometimes automatically applied in cases where required or pattern is used.  */
+    invalid?: boolean;
+    /** Makes the Textfield disabled.  */
+    disabled?: boolean;
+    /** Makes the Textfield required.  */
+    required?: boolean;
+    /** Outline the TextField */
+    outlined?: boolean;
+    /** A label for the input. */
+    label?: React.ReactNode;
+    /** Makes a multiline TextField. */
+    textarea?: boolean;
+    /** Makes the TextField fullwidth. */
+    fullwidth?: boolean;
+    /** Add a leading icon. */
+    icon?: RMWC.IconPropT;
+    /** Add a trailing icon. */
+    trailingIcon?: RMWC.IconPropT;
+    /** By default, props spread to the input. These props are for the component's root container. */
+    rootProps?: Object;
+    /** A reference to the native input or textarea. */
+    inputRef?: React.MutableRefObject<HTMLInputElement | HTMLTextAreaElement | null> | ((ref: HTMLInputElement | HTMLTextAreaElement | null) => void);
+    /** The type of input field to render, search, number, etc */
+    type?: string;
+}
+export interface DeprecatedTextfieldProps {
+    /** DEPRECATED: Is being removed from MCW. */
+    dense?: boolean;
+    /** DEPRECATED: Use icon. */
+    withLeadingIcon?: RMWC.IconPropT;
+    /** DEPRECATED: Use trailingIcon. */
+    withTrailingIcon?: RMWC.IconPropT;
+}
+/** A TextField component for accepting text input from a user. */
+export declare class TextField extends FoundationComponent<MDCTextFieldFoundation, TextFieldProps & DeprecatedTextfieldProps> {
+    static displayName: string;
+    generatedId: string;
+    private root;
+    private input;
+    private label;
+    private lineRipple;
+    characterCounter?: null | TextFieldCharacterCount;
+    leadingIcon: null | TextFieldIcon;
+    trailingIcon: null | TextFieldIcon;
+    outline: null | any;
+    valueNeedsUpdate: boolean;
+    constructor(props: any);
+    getDefaultFoundation(): MDCTextFieldFoundation;
+    getLabelAdapterMethods(): {
+        shakeLabel: (shouldShake: boolean) => void;
+        floatLabel: (shouldFloat: boolean) => void;
+        hasLabel: () => boolean;
+        getLabelWidth: () => number;
+    };
+    getLineRippleAdapterMethods(): {
+        activateLineRipple: () => void;
+        deactivateLineRipple: () => void;
+        setLineRippleTransformOrigin: (normalizedX: number) => void;
+    };
+    getOutlineAdapterMethods(): {
+        notchOutline: (labelWidth: number) => void;
+        closeOutline: () => any;
+        hasOutline: () => boolean;
+    };
+    getInputAdapterMethods(): {
+        registerInputInteractionHandler: <K extends any>(evtType: K, handler: SpecificEventListener<any>) => void;
+        deregisterInputInteractionHandler: <K extends any>(evtType: K, handler: SpecificEventListener<any>) => void;
+        getNativeInput: () => (HTMLInputElement & HTMLTextAreaElement) | null;
+    };
+    getFoundationMap(): {
+        characterCounter: MDCTextFieldCharacterCounterFoundation | undefined;
+        helperText: undefined;
+        leadingIcon: MDCTextFieldIconFoundation | undefined;
+        trailingIcon: MDCTextFieldIconFoundation | undefined;
+    };
+    renderIcon(icon: RMWC.IconPropT, leadOrTrail: 'leadingIcon' | 'trailingIcon'): JSX.Element;
+    sync(props: TextFieldProps): void;
+    handleOnChange(evt: React.ChangeEvent<HTMLInputElement>): void;
+    renderHelpText(renderedCharacterCounter?: React.ReactNode): JSX.Element | null;
+    render(): JSX.Element;
+}
+/*********************************************************************
+ * Helper Text
+ *********************************************************************/
+interface TextFieldHelperCharacterCount {
+}
+declare class TextFieldCharacterCount extends FoundationComponent<MDCTextFieldCharacterCounterFoundation, TextFieldHelperCharacterCount> {
+    static displayName: string;
+    state: {
+        content: string;
+    };
+    getDefaultFoundation(): MDCTextFieldCharacterCounterFoundation;
+    render(): JSX.Element;
+}
+export interface TextFieldHelperTextProps {
+    /** Make the help text always visible */
+    persistent?: boolean;
+    /** Make the help a validation message style */
+    validationMsg?: boolean;
+    /** Content for the help text */
+    children: React.ReactNode;
+}
+/** A help text component */
+export declare const TextFieldHelperText: React.ComponentType<RMWC.MergeInterfacesT<TextFieldHelperTextProps, RMWC.ComponentProps>>;
+/*********************************************************************
+ * Icon
+ *********************************************************************/
+/**
+ * An Icon in a TextField
+ */
+export declare class TextFieldIcon extends FoundationComponent<MDCTextFieldIconFoundation, IconProps> {
+    static displayName: string;
+    private root;
+    getDefaultFoundation(): MDCTextFieldIconFoundation;
+    render(): JSX.Element;
+}
+export {};