newskit 0.0.0-e00e1f6 → 0.0.0-e5b249306

package/README.md

@@ -1,42 +1,119 @@
 <p align="center">
-  <a href="https://github.com/newscorp-ghfb/ncu-newskit">
-    <img width="500px" src="https://www.news.co.uk/wp-content/themes/newscouk/assets/img/logo.png">
+  <a href="https://www.newskit.co.uk">
+    <img width='550' src="https://www.newskit.co.uk/static/newskit-logo.svg">
   </a>
 </p>
 
-# <h1 align="center">News UK Components</h1>
+# NewsKit
 
-**News UK Design System** is a design system comprised of modern, responsive, living components which will be used as the base components for all publication titles at News UK.
+NewsKit is News UK’s design system. It provides interactive building blocks and guidelines for crafting cohesive digital product interfaces and accelerating development. Build better products faster.
 
-## Pre-requisites
+This document is focused on the React components, more expansive documentation can be found on our [website](http://newskit.co.uk).
 
-You will need to install the following as pre-requisites to getting started:
+## Introduction
 
-* [Node.js](https://nodejs.org/en/download/) Version 10.*. If you are using an older version of Node, it is recommended to install other versions via NVM
-* [Yarn](https://yarnpkg.com/en/docs/install#mac-stable) to install the project dependencies
-* [Docker](https://docs.docker.com/docker-for-mac/install/)
+The NewsKit design system provides an npm package that exports a library of reusable React components and utilities that can be used as building blocks to compose web applications.
 
-## Getting Started
+## Why build products with NewsKit
 
-Once you have the above installed, run the following commands:
+### Accessible
 
-```sh
-git clone git@github.com:newscorp-ghfb/ncu-newskit.git
-cd ncu-newskit
-docker-compose build
-docker-compose up
+NewsKit components folllow [WCAG guidelines](https://www.w3.org/WAI/standards-guidelines/wcag/), [WAI Aria](https://www.w3.org/WAI/standards-guidelines/aria/) and [Aria-practices](https://www.w3.org/TR/wai-aria-practices/). Components are AA compliant with A11Y features built-in including props to extend their flexibility if required.
+
+### Adaptive
+
+NewsKit has an extensive [theming system](https://newskit.co.uk/theme/overview/) that enables customization of style and layout. Additionally components support a range of properties to customise behaviour.
+
+### Productive
+
+Carefully crafted components ensure that teams using NewsKit can rapidly iterate on product requirements through re-use of common functionality. This promotes both consistency
+and common language across product development teams.
+
+## 💎 What’s included
+
+### React web components
+
+A collection high quality React [web components](https://newskit.co.uk/components/overview/) built using [TypeScript](https://www.typescriptlang.org/) and [Emotion](https://emotion.sh/docs/introduction).
+
+### Advanced theming system
+
+An advanced full-featured [theming system](https://newskit.co.uk/theme/overview/) with the flexibility to meet the requirement of a single or multi-brand requirement, including both business and consumer products.
+
+### Utility functions
+
+A host of utility functions for use in third-party or custom components.
+
+### Guidance
+
+Comprehensive online documentation and guidelines.
+
+## 🙌 Browser support
+
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Chrome  | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Safari |
+| --- | --- | --- |
+| last 2 versions | last 2 versions | last 2 versions |
+
+## ✅ Pre-requisites
+
+To start using NewsKit components in your projects your projects you will need the following:
+
+* [Node.js](https://nodejs.org/en/download/) with a minimum of node v14 installed
+* A project to install NewsKit into. If you need to create a new one try [Next.js](https://nextjs.org/learn/basics/create-nextjs-app) or [Create React App](https://create-react-app.dev/docs/getting-started/).
+
+## 📦 Install
+
+Use your favourite package manager to install NewsKit.
+
+```bash
+npm install newskit
+```
+
+```bash
+yarn add newskit
 ```
 
-## Contributing
+## 🔨 Usage
+
+NewsKit components can be used like any typical react components. One thing to bear in mind is that they will need to be descendants of a `ThemeProvider`, this can be thought of as the theme context, this theme will be applied to all of its descendants.
+The following example shows the "Hello World!" example of using a NewsKit component. More comprehensive usage documentation can be found on our [website](https://www.newskit.co.uk/getting-started/code/engineering-quickstart/).
+
+```typescript
+import {ThemeProvider, Tag, TagSize, newskitLightTheme} from 'newskit';
+import React from 'react';
+
+export default class App extends React.Component {
+
+  render() {
+    return (
+      <ThemeProvider theme={newskitLightTheme}>
+        <Tag
+          href="http://example.com"
+          size={TagSize.Medium}>
+            Tag Content
+        </Tag>
+      </ThemeProvider>
+    )
+  }
+}
+```
+
+## 👉 What’s next
+
+* To start engineering with NewsKit, follow the steps in the [quickstart guide](https://nidigitalsolutions.jira.com/wiki/spaces/NPP/pages/2354218083).
+* Have a question? [Contact the NewsKit team via the contact form](https://newskit.co.uk/about/contact-us/).
+
+## 🐛 Bugs, Issues & Feature requests
 
-For detailed information on how to create your first PR, branching and commit messages convention, please visit [Contributing](./docs/CONTRIBUTING.md)
+Feel free to reach out by raising issues on our [github](https://github.com/newscorp-ghfb/newskit/issues).
 
-## Testing
+## 🤝 Contributing
 
-We use the following libraries for our automated tests:
+See the [contributing guidelines](https://github.com/newscorp-ghfb/newskit/wiki/Contributing-Guidelines) in the wiki.
 
-* Jest and React Testing Library for unit testing
-* Cypress for component and E2E testing
-* cypress-axe for automated accessibility testing
+## 🔗 Key Links
 
-For detailed information on how to run the automated tests, please visit [Testing](./docs/testing.md)
+* [NewsKit Documentation](https://www.newskit.co.uk/)
+* [View NewsKit Design System npm package](https://www.npmjs.com/package/newskit)
+* [Github repository](https://github.com/newscorp-ghfb/newskit)
+* [Medium](https://medium.com/newskit-design-system)
+* [Storybook](https://storybook.newskit.co.uk/)

package/cjs/aspect-ratio/aspect-ratio.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { AspectRatioProps } from './types';
+/**
+ * @deprecated AspectRatio is deprecated and will be removed in the next major release.
+ */
+export declare const AspectRatio: React.FC<AspectRatioProps>;
+//# sourceMappingURL=aspect-ratio.d.ts.map

package/cjs/aspect-ratio/aspect-ratio.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"aspect-ratio.d.ts","sourceRoot":"","sources":["../../../src/aspect-ratio/aspect-ratio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AAEzC;;GAEG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAyBlD,CAAC"}

package/cjs/aspect-ratio/aspect-ratio.js

@@ -0,0 +1,29 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AspectRatio = void 0;
+var react_1 = __importDefault(require("react"));
+var get_aspect_ratio_1 = require("../utils/get-aspect-ratio");
+var styled_1 = require("./styled");
+/**
+ * @deprecated AspectRatio is deprecated and will be removed in the next major release.
+ */
+var AspectRatio = function (_a) {
+    var aspectRatio = _a.aspectRatio, width = _a.width, height = _a.height, children = _a.children, maxHeight = _a.maxHeight, maxWidth = _a.maxWidth;
+    var _b = (0, get_aspect_ratio_1.getAspectRatioStyles)({
+        aspectRatio: aspectRatio,
+        width: width,
+        height: height,
+    }), paddingTop = _b.paddingTop, $width = _b.width, $height = _b.height;
+    var _c = (0, get_aspect_ratio_1.getAspectRatioStyles)({
+        aspectRatio: aspectRatio,
+        width: maxWidth,
+        height: maxHeight,
+    }), mWidth = _c.width, mHeight = _c.height;
+    return (react_1.default.createElement(styled_1.Container, { paddingTop: paddingTop, maxHeight: mHeight, maxWidth: mWidth },
+        react_1.default.createElement(styled_1.StyledDiv, { "$width": $width, "$height": $height }, children)));
+};
+exports.AspectRatio = AspectRatio;
+//# sourceMappingURL=aspect-ratio.js.map

package/cjs/aspect-ratio/aspect-ratio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"aspect-ratio.js","sourceRoot":"","sources":["../../../src/aspect-ratio/aspect-ratio.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAA0B;AAC1B,8DAA+D;AAC/D,mCAA8C;AAG9C;;GAEG;AACI,IAAM,WAAW,GAA+B,UAAC,EAOvD;QANC,WAAW,iBAAA,EACX,KAAK,WAAA,EACL,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA;IAEF,IAAA,KAA+C,IAAA,uCAAoB,EAAC;QACxE,WAAW,aAAA;QACX,KAAK,OAAA;QACL,MAAM,QAAA;KACP,CAAC,EAJK,UAAU,gBAAA,EAAS,MAAM,WAAA,EAAU,OAAO,YAI/C,CAAC;IACG,IAAA,KAAmC,IAAA,uCAAoB,EAAC;QAC5D,WAAW,aAAA;QACX,KAAK,EAAE,QAAQ;QACf,MAAM,EAAE,SAAS;KAClB,CAAC,EAJY,MAAM,WAAA,EAAU,OAAO,YAInC,CAAC;IACH,OAAO,CACL,8BAAC,kBAAS,IAAC,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM;QACrE,8BAAC,kBAAS,cAAS,MAAM,aAAW,OAAO,IACxC,QAAQ,CACC,CACF,CACb,CAAC;AACJ,CAAC,CAAC;AAzBW,QAAA,WAAW,eAyBtB"}

package/cjs/aspect-ratio/index.d.ts

@@ -0,0 +1,3 @@
+export * from './aspect-ratio';
+export type { AspectRatioProps } from './types';
+//# sourceMappingURL=index.d.ts.map

package/cjs/aspect-ratio/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/aspect-ratio/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,YAAY,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC"}

package/cjs/aspect-ratio/index.js

@@ -0,0 +1,14 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./aspect-ratio"), exports);
+//# sourceMappingURL=index.js.map

package/cjs/aspect-ratio/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/aspect-ratio/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,iDAA+B"}

package/cjs/aspect-ratio/styled.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { ContainerProp, StyledContainerProps } from './types';
+export declare const Container: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & ContainerProp, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledDiv: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Omit<StyledContainerProps, "aspectRatio">, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+//# sourceMappingURL=styled.d.ts.map

package/cjs/aspect-ratio/styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../src/aspect-ratio/styled.ts"],"names":[],"mappings":";AACA,OAAO,EAAC,aAAa,EAAE,oBAAoB,EAAC,MAAM,SAAS,CAAC;AAE5D,eAAO,MAAM,SAAS;;;yHAKrB,CAAC;AAEF,eAAO,MAAM,SAAS;;;qJAWrB,CAAC"}

package/cjs/aspect-ratio/styled.js

@@ -0,0 +1,21 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledDiv = exports.Container = void 0;
+var style_1 = require("../utils/style");
+exports.Container = style_1.styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  ", "\n"], ["\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  ", "\n"])), function (_a) {
+    var maxHeight = _a.maxHeight, maxWidth = _a.maxWidth, paddingTop = _a.paddingTop;
+    return ({ maxHeight: maxHeight, maxWidth: maxWidth, paddingTop: paddingTop });
+});
+exports.StyledDiv = style_1.styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  overflow: hidden;\n  ", "\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  overflow: hidden;\n  ", "\n"])), function (_a) {
+    var _b = _a.$width, width = _b === void 0 ? '100%' : _b, _c = _a.$height, height = _c === void 0 ? 'auto' : _c;
+    return ({
+        width: width,
+        height: height,
+    });
+});
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=styled.js.map

package/cjs/aspect-ratio/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","sourceRoot":"","sources":["../../../src/aspect-ratio/styled.ts"],"names":[],"mappings":";;;;;;;AAAA,wCAAsC;AAGzB,QAAA,SAAS,GAAG,cAAM,CAAC,GAAG,2IAAe,kEAI9C,EAA0E,IAC7E,KADG,UAAC,EAAiC;QAAhC,SAAS,eAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA;IAAM,OAAA,CAAC,EAAC,SAAS,WAAA,EAAE,QAAQ,UAAA,EAAE,UAAU,YAAA,EAAC,CAAC;AAAnC,CAAmC,EAC5E;AAEW,QAAA,SAAS,GAAG,cAAM,CAAC,GAAG,6KAA2C,oGAO1E,EAGA,IACH,KAJG,UAAC,EAAkD;QAAjD,cAAsB,EAAd,KAAK,mBAAG,MAAM,KAAA,EAAE,eAAwB,EAAf,MAAM,mBAAG,MAAM,KAAA;IAAM,OAAA,CAAC;QACzD,KAAK,OAAA;QACL,MAAM,QAAA;KACP,CAAC;AAHwD,CAGxD,EACF"}

package/cjs/aspect-ratio/types.d.ts

@@ -0,0 +1,17 @@
+import { MaxHeightProperty, MaxWidthProperty, PaddingTopProperty, HeightProperty, WidthProperty } from 'csstype';
+import { GetAspectRatioProp } from '../utils/get-aspect-ratio';
+export interface ContainerProp {
+    paddingTop?: PaddingTopProperty<string>;
+    maxHeight?: MaxHeightProperty<string>;
+    maxWidth?: MaxWidthProperty<string>;
+}
+export interface StyledContainerProps {
+    $height?: HeightProperty<string>;
+    $width?: WidthProperty<string>;
+}
+/**
+ * @deprecated AspectRatioProps is deprecated and will be removed in the next major release.
+ */
+export interface AspectRatioProps extends GetAspectRatioProp, Omit<ContainerProp, 'paddingTop'> {
+}
+//# sourceMappingURL=types.d.ts.map

package/cjs/aspect-ratio/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/aspect-ratio/types.ts"],"names":[],"mappings":"AACA,OAAO,EACL,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,EACd,aAAa,EACd,MAAM,SAAS,CAAC;AACjB,OAAO,EAAC,kBAAkB,EAAC,MAAM,2BAA2B,CAAC;AAE7D,MAAM,WAAW,aAAa;IAC5B,UAAU,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;IACxC,SAAS,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;CACrC;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IACjC,MAAM,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;CAChC;AAED;;GAEG;AACH,MAAM,WAAW,gBACf,SAAQ,kBAAkB,EACxB,IAAI,CAAC,aAAa,EAAE,YAAY,CAAC;CAAG"}

package/cjs/aspect-ratio/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/aspect-ratio/types.ts"],"names":[],"mappings":""}

package/cjs/assistive-text/assistive-text.d.ts

@@ -0,0 +1,3 @@
+import { AssistiveTextProps } from './types';
+export declare const AssistiveText: import("../utils/with-own-theme").NewsKitReactComponents<AssistiveTextProps>;
+//# sourceMappingURL=assistive-text.d.ts.map

package/cjs/assistive-text/assistive-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"assistive-text.d.ts","sourceRoot":"","sources":["../../../src/assistive-text/assistive-text.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AA2C3C,eAAO,MAAM,aAAa,8EAGxB,CAAC"}

package/cjs/assistive-text/assistive-text.js

@@ -0,0 +1,45 @@
+"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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AssistiveText = void 0;
+var react_1 = __importDefault(require("react"));
+var styled_1 = require("./styled");
+var with_enhancers_1 = require("../with-enhancers/with-enhancers");
+var defaults_1 = __importDefault(require("./defaults"));
+var style_presets_1 = __importDefault(require("./style-presets"));
+var with_own_theme_1 = require("../utils/with-own-theme");
+var logical_properties_1 = require("../utils/logical-properties");
+var ThemelessAssistiveText = function (_a) {
+    var overrides = _a.overrides, _b = _a.size, size = _b === void 0 ? 'medium' : _b, state = _a.state, children = _a.children, startEnhancer = _a.startEnhancer, endEnhancer = _a.endEnhancer, props = __rest(_a, ["overrides", "size", "state", "children", "startEnhancer", "endEnhancer"]);
+    var nonLogicalOverrides = (0, logical_properties_1.omitLogicalPropsFromOverrides)(overrides);
+    return (react_1.default.createElement(with_enhancers_1.WithEnhancers, { componentDefaultsPath: "assistiveText.".concat(size), overrides: overrides, state: state, startEnhancer: startEnhancer, endEnhancer: endEnhancer, marginPosition: "inside", alignSelf: "start" }, children && (react_1.default.createElement(styled_1.StyledAssistiveText, __assign({ "aria-disabled": state === 'disabled' ? true : undefined, size: size, overrides: nonLogicalOverrides, state: state, role: state === 'invalid' ? 'alert' : undefined, "aria-live": state === 'invalid' ? 'polite' : undefined }, props), children))));
+};
+exports.AssistiveText = (0, with_own_theme_1.withOwnTheme)(ThemelessAssistiveText)({
+    defaults: defaults_1.default,
+    stylePresets: style_presets_1.default,
+});
+//# sourceMappingURL=assistive-text.js.map

package/cjs/assistive-text/assistive-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"assistive-text.js","sourceRoot":"","sources":["../../../src/assistive-text/assistive-text.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAE1B,mCAA6C;AAC7C,mEAA+D;AAE/D,wDAAkC;AAClC,kEAA2C;AAC3C,0DAAqD;AACrD,kEAA0E;AAE1E,IAAM,sBAAsB,GAAG,UAAC,EAQX;IAPnB,IAAA,SAAS,eAAA,EACT,YAAgC,EAAhC,IAAI,mBAAG,QAAyB,KAAA,EAChC,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,WAAW,iBAAA,EACR,KAAK,cAPsB,0EAQ/B,CADS;IAER,IAAM,mBAAmB,GAAG,IAAA,kDAA6B,EAAC,SAAS,CAAC,CAAC;IACrE,OAAO,CACL,8BAAC,8BAAa,IACZ,qBAAqB,EAAE,wBAAiB,IAAI,CAAE,EAC9C,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,cAAc,EAAC,QAAQ,EACvB,SAAS,EAAC,OAAO,IAEhB,QAAQ,IAAI,CACX,8BAAC,4BAAmB,8BACH,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACtD,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,mBAAmB,EAC9B,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,eACpC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,IACjD,KAAK,GAER,QAAQ,CACW,CACvB,CACa,CACjB,CAAC;AACJ,CAAC,CAAC;AAEW,QAAA,aAAa,GAAG,IAAA,6BAAY,EAAC,sBAAsB,CAAC,CAAC;IAChE,QAAQ,oBAAA;IACR,YAAY,yBAAA;CACb,CAAC,CAAC"}

package/cjs/assistive-text/defaults.d.ts

@@ -0,0 +1,45 @@
+declare const _default: {
+    assistiveText: {
+        small: {
+            stylePreset: string;
+            typographyPreset: string;
+            minHeight: string;
+            startEnhancer: {
+                iconSize: string;
+                spaceInline: string;
+            };
+            endEnhancer: {
+                iconSize: string;
+                spaceInline: string;
+            };
+        };
+        medium: {
+            stylePreset: string;
+            typographyPreset: string;
+            minHeight: string;
+            startEnhancer: {
+                iconSize: string;
+                spaceInline: string;
+            };
+            endEnhancer: {
+                iconSize: string;
+                spaceInline: string;
+            };
+        };
+        large: {
+            stylePreset: string;
+            typographyPreset: string;
+            minHeight: string;
+            startEnhancer: {
+                iconSize: string;
+                spaceInline: string;
+            };
+            endEnhancer: {
+                iconSize: string;
+                spaceInline: string;
+            };
+        };
+    };
+};
+export default _default;
+//# sourceMappingURL=defaults.d.ts.map

package/cjs/assistive-text/defaults.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults.d.ts","sourceRoot":"","sources":["../../../src/assistive-text/defaults.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBA0CE"}

package/cjs/assistive-text/defaults.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    assistiveText: {
+        small: {
+            stylePreset: 'assistiveText',
+            typographyPreset: 'utilityBody010',
+            minHeight: 'sizing030',
+            startEnhancer: {
+                iconSize: 'iconSize010',
+                spaceInline: 'space020',
+            },
+            endEnhancer: {
+                iconSize: 'iconSize010',
+                spaceInline: 'space020',
+            },
+        },
+        medium: {
+            stylePreset: 'assistiveText',
+            typographyPreset: 'utilityBody020',
+            minHeight: 'sizing030',
+            startEnhancer: {
+                iconSize: 'iconSize020',
+                spaceInline: 'space020',
+            },
+            endEnhancer: {
+                iconSize: 'iconSize020',
+                spaceInline: 'space020',
+            },
+        },
+        large: {
+            stylePreset: 'assistiveText',
+            typographyPreset: 'utilityBody030',
+            minHeight: 'sizing030',
+            startEnhancer: {
+                iconSize: 'iconSize020',
+                spaceInline: 'space030',
+            },
+            endEnhancer: {
+                iconSize: 'iconSize020',
+                spaceInline: 'space030',
+            },
+        },
+    },
+};
+//# sourceMappingURL=defaults.js.map

package/cjs/assistive-text/defaults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults.js","sourceRoot":"","sources":["../../../src/assistive-text/defaults.ts"],"names":[],"mappings":";;AAAA,kBAAe;IACb,aAAa,EAAE;QACb,KAAK,EAAE;YACL,WAAW,EAAE,eAAe;YAC5B,gBAAgB,EAAE,gBAAgB;YAClC,SAAS,EAAE,WAAW;YACtB,aAAa,EAAE;gBACb,QAAQ,EAAE,aAAa;gBACvB,WAAW,EAAE,UAAU;aACxB;YACD,WAAW,EAAE;gBACX,QAAQ,EAAE,aAAa;gBACvB,WAAW,EAAE,UAAU;aACxB;SACF;QACD,MAAM,EAAE;YACN,WAAW,EAAE,eAAe;YAC5B,gBAAgB,EAAE,gBAAgB;YAClC,SAAS,EAAE,WAAW;YACtB,aAAa,EAAE;gBACb,QAAQ,EAAE,aAAa;gBACvB,WAAW,EAAE,UAAU;aACxB;YACD,WAAW,EAAE;gBACX,QAAQ,EAAE,aAAa;gBACvB,WAAW,EAAE,UAAU;aACxB;SACF;QACD,KAAK,EAAE;YACL,WAAW,EAAE,eAAe;YAC5B,gBAAgB,EAAE,gBAAgB;YAClC,SAAS,EAAE,WAAW;YACtB,aAAa,EAAE;gBACb,QAAQ,EAAE,aAAa;gBACvB,WAAW,EAAE,UAAU;aACxB;YACD,WAAW,EAAE;gBACX,QAAQ,EAAE,aAAa;gBACvB,WAAW,EAAE,UAAU;aACxB;SACF;KACF;CACF,CAAC"}

package/cjs/assistive-text/index.d.ts

@@ -0,0 +1,3 @@
+export * from './assistive-text';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/cjs/assistive-text/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/assistive-text/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC"}

package/cjs/assistive-text/index.js

@@ -0,0 +1,15 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./assistive-text"), exports);
+__exportStar(require("./types"), exports);
+//# sourceMappingURL=index.js.map

package/cjs/assistive-text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/assistive-text/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,mDAAiC;AACjC,0CAAwB"}

package/cjs/assistive-text/style-presets.d.ts

@@ -0,0 +1,4 @@
+import { StylePreset } from '../theme/types';
+declare const _default: Record<string, StylePreset>;
+export default _default;
+//# sourceMappingURL=style-presets.d.ts.map

package/cjs/assistive-text/style-presets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"style-presets.d.ts","sourceRoot":"","sources":["../../../src/assistive-text/style-presets.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;;AAE3C,wBAeiC"}

package/cjs/assistive-text/style-presets.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    assistiveText: {
+        base: {
+            color: '{{colors.inkSubtle}}',
+        },
+        disabled: {
+            color: '{{colors.inkNonEssential}}',
+        },
+        invalid: {
+            color: '{{colors.inkNegative}}',
+        },
+        valid: {
+            color: '{{colors.inkSubtle}}',
+        },
+    },
+};
+//# sourceMappingURL=style-presets.js.map

package/cjs/assistive-text/style-presets.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style-presets.js","sourceRoot":"","sources":["../../../src/assistive-text/style-presets.ts"],"names":[],"mappings":";;AAEA,kBAAe;IACb,aAAa,EAAE;QACb,IAAI,EAAE;YACJ,KAAK,EAAE,sBAAsB;SAC9B;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,4BAA4B;SACpC;QACD,OAAO,EAAE;YACP,KAAK,EAAE,wBAAwB;SAChC;QACD,KAAK,EAAE;YACL,KAAK,EAAE,sBAAsB;SAC9B;KACF;CAC6B,CAAC"}

package/cjs/assistive-text/styled.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { TextBlockProps } from '../text-block/types';
+export declare const StyledAssistiveText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & TextBlockProps & import("react").ClassAttributes<HTMLParagraphElement> & import("react").HTMLAttributes<HTMLParagraphElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & Omit<TextBlockProps, "overrides"> & Omit<import("../with-enhancers/types").WithEnhancersProps, "isFocused" | "componentDefaultsPath" | "enhancersType"> & {
+    overrides?: (import("../form/types").EnhancerOverrides & {
+        stylePreset?: import("../utils/style").MQ<string> | undefined;
+        typographyPreset?: import("../utils/style").MQ<string> | undefined;
+        minHeight?: import("../utils/style").MQ<string> | undefined;
+    }) | undefined;
+}, {}, {}>;
+//# sourceMappingURL=styled.d.ts.map

package/cjs/assistive-text/styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../src/assistive-text/styled.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,cAAc,EAAC,MAAM,qBAAqB,CAAC;AAOnD,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;UAe/B,CAAC"}

package/cjs/assistive-text/styled.js

@@ -0,0 +1,24 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledAssistiveText = void 0;
+var text_block_1 = require("../text-block");
+var style_1 = require("../utils/style");
+exports.StyledAssistiveText = (0, style_1.styled)(text_block_1.TextBlock)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  flex: 1;\n\n  ", "\n  ", "\n"], ["\n  flex: 1;\n\n  ", "\n  ", "\n"])), function (_a) {
+    var size = _a.size, state = _a.state;
+    return (0, style_1.getStylePreset)("assistiveText.".concat(size), '', {
+        isInvalid: state === 'invalid',
+        isDisabled: state === 'disabled',
+        isValid: state === 'valid',
+    });
+}, function (_a) {
+    var size = _a.size;
+    return (0, style_1.getTypographyPreset)("assistiveText.".concat(size), '', {
+        withCrop: true,
+    });
+});
+var templateObject_1;
+//# sourceMappingURL=styled.js.map

package/cjs/assistive-text/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","sourceRoot":"","sources":["../../../src/assistive-text/styled.tsx"],"names":[],"mappings":";;;;;;;AACA,4CAAwC;AAExC,wCAA2E;AAI9D,QAAA,mBAAmB,GAAG,IAAA,cAAM,EAAC,sBAAS,CAAC,qGAEnD,oBAGG,EAKE,MACF,EAGE,IACL,KAVG,UAAC,EAAa;QAAZ,IAAI,UAAA,EAAE,KAAK,WAAA;IACb,OAAA,IAAA,sBAAc,EAAC,wBAAiB,IAAI,CAAE,EAAE,EAAE,EAAE;QAC1C,SAAS,EAAE,KAAK,KAAK,SAAS;QAC9B,UAAU,EAAE,KAAK,KAAK,UAAU;QAChC,OAAO,EAAE,KAAK,KAAK,OAAO;KAC3B,CAAC;AAJF,CAIE,EACF,UAAC,EAAM;QAAL,IAAI,UAAA;IACN,OAAA,IAAA,2BAAmB,EAAC,wBAAiB,IAAI,CAAE,EAAE,EAAE,EAAE;QAC/C,QAAQ,EAAE,IAAI;KACf,CAAC;AAFF,CAEE,EACJ"}

package/cjs/assistive-text/types.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { EnhancerOverrides } from '../form/types';
+import { MQ } from '../utils/style';
+import { WithEnhancersProps } from '../with-enhancers/types';
+export declare type AssistiveTextProps = React.HTMLAttributes<HTMLParagraphElement> & Omit<WithEnhancersProps, 'enhancersType' | 'isFocused' | 'componentDefaultsPath'> & {
+    overrides?: EnhancerOverrides & {
+        stylePreset?: MQ<string>;
+        typographyPreset?: MQ<string>;
+        minHeight?: MQ<string>;
+    };
+};
+//# sourceMappingURL=types.d.ts.map

package/cjs/assistive-text/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/assistive-text/types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAChD,OAAO,EAAC,EAAE,EAAC,MAAM,gBAAgB,CAAC;AAClC,OAAO,EAAC,kBAAkB,EAAC,MAAM,yBAAyB,CAAC;AAE3D,oBAAY,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,GACzE,IAAI,CACF,kBAAkB,EAClB,eAAe,GAAG,WAAW,GAAG,uBAAuB,CACxD,GAAG;IACF,SAAS,CAAC,EAAE,iBAAiB,GAAG;QAC9B,WAAW,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC;QACzB,gBAAgB,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC;QAC9B,SAAS,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC;KACxB,CAAC;CACH,CAAC"}

package/cjs/assistive-text/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/assistive-text/types.ts"],"names":[],"mappings":""}