@atlaskit/link-create 0.5.7 → 0.6.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/link-create
 
+## 0.6.0
+
+### Minor Changes
+
+- [`ac3927f0650`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ac3927f0650) - Make modal 480px wide, Update TextField to take isRequired prop w/o default browser validation, remove extra internal spacing in the create form
+
 ## 0.5.7
 
 ### Patch Changes

package/dist/cjs/common/constants.js

@@ -8,7 +8,7 @@ var ANALYTICS_CHANNEL = 'media';
 exports.ANALYTICS_CHANNEL = ANALYTICS_CHANNEL;
 var COMPONENT_NAME = 'linkCreate';
 exports.COMPONENT_NAME = COMPONENT_NAME;
-var CREATE_FORM_MAX_WIDTH_IN_PX = '600';
+var CREATE_FORM_MAX_WIDTH_IN_PX = '480';
 exports.CREATE_FORM_MAX_WIDTH_IN_PX = CREATE_FORM_MAX_WIDTH_IN_PX;
 var CREATE_FORM_MIN_HEIGHT_IN_PX = '200';
 exports.CREATE_FORM_MIN_HEIGHT_IN_PX = CREATE_FORM_MIN_HEIGHT_IN_PX;

package/dist/cjs/ui/create-form/main.js

@@ -96,7 +96,7 @@ var CreateForm = function CreateForm(_ref) {
       name: "confluence-creation-form",
       "data-testid": testId,
       css: formStyles
-    }), (0, _react2.jsx)(_form.FormSection, null, children), !hideFooter && (0, _react2.jsx)(_form.FormFooter, null, formErrorMessage && (0, _react2.jsx)("div", {
+    }), (0, _react2.jsx)("div", null, children), !hideFooter && (0, _react2.jsx)(_form.FormFooter, null, formErrorMessage && (0, _react2.jsx)("div", {
       css: errorStyles,
       "data-testid": "link-create-form-error"
     }, (0, _react2.jsx)(_error.default, {

package/dist/cjs/ui/create-form/textfield/main.js

@@ -13,7 +13,7 @@ var _form = require("@atlaskit/form");
 var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
 var _form2 = require("../../../common/utils/form");
 var _formContext = require("../../../controllers/form-context");
-var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue"];
+var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue", "isRequired"];
 /** @jsx jsx */
 /**
  * A text field utilising the Atlaskit Textfield and Field objects from `@atlaskit/form`.
@@ -28,6 +28,7 @@ function TextField(_ref) {
     validationHelpText = _ref.validationHelpText,
     validators = _ref.validators,
     defaultValue = _ref.defaultValue,
+    isRequired = _ref.isRequired,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var _useFormContext = (0, _formContext.useFormContext)(),
     assignValidator = _useFormContext.assignValidator;
@@ -47,6 +48,7 @@ function TextField(_ref) {
     (0, _react2.jsx)(_form.Field, {
       name: name,
       label: label,
+      isRequired: isRequired,
       defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : ''
     }, function (_ref2) {
       var fieldProps = _ref2.fieldProps,
@@ -54,7 +56,8 @@ function TextField(_ref) {
         error = _ref2.error;
       var isInvalid = (0, _form2.validateSubmitErrors)(meta);
       return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_textfield.default, (0, _extends2.default)({}, fieldProps, restProps, {
-        isInvalid: isInvalid
+        isInvalid: isInvalid,
+        isRequired: false // Remove the default browser validation
       })), !error && validationHelpText && (0, _react2.jsx)(_form.HelperMessage, null, validationHelpText), error && isInvalid && (0, _react2.jsx)(_form.ErrorMessage, {
         testId: "".concat(restProps.testId, "-error-message")
       }, error));

package/dist/cjs/ui/main.js

@@ -93,7 +93,8 @@ var LinkCreateWithModal = function LinkCreateWithModal(props) {
     testId: testId,
     shouldScrollInViewport: true,
     onOpenComplete: handleOpenComplete,
-    onCloseComplete: handleCloseComplete
+    onCloseComplete: handleCloseComplete,
+    width: "".concat(_constants.CREATE_FORM_MAX_WIDTH_IN_PX, "px")
   }, (0, _react2.jsx)(_modalDialog.ModalHeader, null, (0, _react2.jsx)(_modalDialog.ModalTitle, null, intl.formatMessage(_messages.messages.heading))), (0, _react2.jsx)(_modalDialog.ModalBody, null, (0, _react2.jsx)(_errorBoundary.ErrorBoundary, null, (0, _react2.jsx)(_formContext.FormContextProvider, null, (0, _react2.jsx)(LinkCreate, props))))));
 };
 var LinkCreateWithAnalyticsContext = (0, _analytics.withLinkCreateAnalyticsContext)( /*#__PURE__*/(0, _react.memo)(function (_ref3) {

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-create",
-	"version": "0.5.7",
+	"version": "0.6.0",
 	"sideEffects": false
 }

package/dist/es2019/common/constants.js

@@ -1,4 +1,4 @@
 export const ANALYTICS_CHANNEL = 'media';
 export const COMPONENT_NAME = 'linkCreate';
-export const CREATE_FORM_MAX_WIDTH_IN_PX = '600';
+export const CREATE_FORM_MAX_WIDTH_IN_PX = '480';
 export const CREATE_FORM_MIN_HEIGHT_IN_PX = '200';

package/dist/es2019/ui/create-form/main.js

@@ -7,7 +7,7 @@ import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ButtonGroup } from '@atlaskit/button';
 import LoadingButton from '@atlaskit/button/loading-button';
 import Button from '@atlaskit/button/standard-button';
-import Form, { FormFooter, FormSection } from '@atlaskit/form';
+import Form, { FormFooter } from '@atlaskit/form';
 import ErrorIcon from '@atlaskit/icon/glyph/error';
 import { ANALYTICS_CHANNEL, CREATE_FORM_MAX_WIDTH_IN_PX } from '../../common/constants';
 import createEventPayload from '../../common/utils/analytics/analytics.codegen';
@@ -69,7 +69,7 @@ export const CreateForm = ({
     name: "confluence-creation-form",
     "data-testid": testId,
     css: formStyles
-  }), jsx(FormSection, null, children), !hideFooter && jsx(FormFooter, null, formErrorMessage && jsx("div", {
+  }), jsx("div", null, children), !hideFooter && jsx(FormFooter, null, formErrorMessage && jsx("div", {
     css: errorStyles,
     "data-testid": "link-create-form-error"
   }, jsx(ErrorIcon, {

package/dist/es2019/ui/create-form/textfield/main.js

@@ -19,6 +19,7 @@ export function TextField({
   validationHelpText,
   validators,
   defaultValue,
+  isRequired,
   ...restProps
 }) {
   const {
@@ -40,6 +41,7 @@ export function TextField({
     jsx(Field, {
       name: name,
       label: label,
+      isRequired: isRequired,
       defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : ''
     }, ({
       fieldProps,
@@ -48,7 +50,8 @@ export function TextField({
     }) => {
       const isInvalid = validateSubmitErrors(meta);
       return jsx(Fragment, null, jsx(AkTextfield, _extends({}, fieldProps, restProps, {
-        isInvalid: isInvalid
+        isInvalid: isInvalid,
+        isRequired: false // Remove the default browser validation
       })), !error && validationHelpText && jsx(HelperMessage, null, validationHelpText), error && isInvalid && jsx(ErrorMessage, {
         testId: `${restProps.testId}-error-message`
       }, error));

package/dist/es2019/ui/main.js

@@ -4,7 +4,7 @@ import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import { AnalyticsContext, useAnalyticsEvents } from '@atlaskit/analytics-next';
 import Modal, { ModalBody, ModalHeader, ModalTitle, ModalTransition } from '@atlaskit/modal-dialog';
-import { ANALYTICS_CHANNEL, COMPONENT_NAME } from '../common/constants';
+import { ANALYTICS_CHANNEL, COMPONENT_NAME, CREATE_FORM_MAX_WIDTH_IN_PX } from '../common/constants';
 import { withLinkCreateAnalyticsContext } from '../common/utils/analytics';
 import createEventPayload from '../common/utils/analytics/analytics.codegen';
 import { LinkCreateCallbackProvider } from '../controllers/callback-context';
@@ -65,7 +65,8 @@ const LinkCreateWithModal = props => {
     testId: testId,
     shouldScrollInViewport: true,
     onOpenComplete: handleOpenComplete,
-    onCloseComplete: handleCloseComplete
+    onCloseComplete: handleCloseComplete,
+    width: `${CREATE_FORM_MAX_WIDTH_IN_PX}px`
   }, jsx(ModalHeader, null, jsx(ModalTitle, null, intl.formatMessage(messages.heading))), jsx(ModalBody, null, jsx(ErrorBoundary, null, jsx(FormContextProvider, null, jsx(LinkCreate, props))))));
 };
 const LinkCreateWithAnalyticsContext = withLinkCreateAnalyticsContext( /*#__PURE__*/memo(({

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-create",
-	"version": "0.5.7",
+	"version": "0.6.0",
 	"sideEffects": false
 }

package/dist/esm/common/constants.js

@@ -1,4 +1,4 @@
 export var ANALYTICS_CHANNEL = 'media';
 export var COMPONENT_NAME = 'linkCreate';
-export var CREATE_FORM_MAX_WIDTH_IN_PX = '600';
+export var CREATE_FORM_MAX_WIDTH_IN_PX = '480';
 export var CREATE_FORM_MIN_HEIGHT_IN_PX = '200';

package/dist/esm/ui/create-form/main.js

@@ -9,7 +9,7 @@ import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ButtonGroup } from '@atlaskit/button';
 import LoadingButton from '@atlaskit/button/loading-button';
 import Button from '@atlaskit/button/standard-button';
-import Form, { FormFooter, FormSection } from '@atlaskit/form';
+import Form, { FormFooter } from '@atlaskit/form';
 import ErrorIcon from '@atlaskit/icon/glyph/error';
 import { ANALYTICS_CHANNEL, CREATE_FORM_MAX_WIDTH_IN_PX } from '../../common/constants';
 import createEventPayload from '../../common/utils/analytics/analytics.codegen';
@@ -85,7 +85,7 @@ export var CreateForm = function CreateForm(_ref) {
       name: "confluence-creation-form",
       "data-testid": testId,
       css: formStyles
-    }), jsx(FormSection, null, children), !hideFooter && jsx(FormFooter, null, formErrorMessage && jsx("div", {
+    }), jsx("div", null, children), !hideFooter && jsx(FormFooter, null, formErrorMessage && jsx("div", {
       css: errorStyles,
       "data-testid": "link-create-form-error"
     }, jsx(ErrorIcon, {

package/dist/esm/ui/create-form/textfield/main.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue"];
+var _excluded = ["label", "name", "validationHelpText", "validators", "defaultValue", "isRequired"];
 /** @jsx jsx */
 import { Fragment, useEffect } from 'react';
 import { jsx } from '@emotion/react';
@@ -21,6 +21,7 @@ export function TextField(_ref) {
     validationHelpText = _ref.validationHelpText,
     validators = _ref.validators,
     defaultValue = _ref.defaultValue,
+    isRequired = _ref.isRequired,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _useFormContext = useFormContext(),
     assignValidator = _useFormContext.assignValidator;
@@ -40,6 +41,7 @@ export function TextField(_ref) {
     jsx(Field, {
       name: name,
       label: label,
+      isRequired: isRequired,
       defaultValue: defaultValue !== null && defaultValue !== void 0 ? defaultValue : ''
     }, function (_ref2) {
       var fieldProps = _ref2.fieldProps,
@@ -47,7 +49,8 @@ export function TextField(_ref) {
         error = _ref2.error;
       var isInvalid = validateSubmitErrors(meta);
       return jsx(Fragment, null, jsx(AkTextfield, _extends({}, fieldProps, restProps, {
-        isInvalid: isInvalid
+        isInvalid: isInvalid,
+        isRequired: false // Remove the default browser validation
       })), !error && validationHelpText && jsx(HelperMessage, null, validationHelpText), error && isInvalid && jsx(ErrorMessage, {
         testId: "".concat(restProps.testId, "-error-message")
       }, error));

package/dist/esm/ui/main.js

@@ -8,7 +8,7 @@ import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import { AnalyticsContext, useAnalyticsEvents } from '@atlaskit/analytics-next';
 import Modal, { ModalBody, ModalHeader, ModalTitle, ModalTransition } from '@atlaskit/modal-dialog';
-import { ANALYTICS_CHANNEL, COMPONENT_NAME } from '../common/constants';
+import { ANALYTICS_CHANNEL, COMPONENT_NAME, CREATE_FORM_MAX_WIDTH_IN_PX } from '../common/constants';
 import { withLinkCreateAnalyticsContext } from '../common/utils/analytics';
 import createEventPayload from '../common/utils/analytics/analytics.codegen';
 import { LinkCreateCallbackProvider } from '../controllers/callback-context';
@@ -82,7 +82,8 @@ var LinkCreateWithModal = function LinkCreateWithModal(props) {
     testId: testId,
     shouldScrollInViewport: true,
     onOpenComplete: handleOpenComplete,
-    onCloseComplete: handleCloseComplete
+    onCloseComplete: handleCloseComplete,
+    width: "".concat(CREATE_FORM_MAX_WIDTH_IN_PX, "px")
   }, jsx(ModalHeader, null, jsx(ModalTitle, null, intl.formatMessage(messages.heading))), jsx(ModalBody, null, jsx(ErrorBoundary, null, jsx(FormContextProvider, null, jsx(LinkCreate, props))))));
 };
 var LinkCreateWithAnalyticsContext = withLinkCreateAnalyticsContext( /*#__PURE__*/memo(function (_ref3) {

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-create",
-	"version": "0.5.7",
+	"version": "0.6.0",
 	"sideEffects": false
 }

package/dist/types/common/constants.d.ts

@@ -1,4 +1,4 @@
 export declare const ANALYTICS_CHANNEL = "media";
 export declare const COMPONENT_NAME = "linkCreate";
-export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "600";
+export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "480";
 export declare const CREATE_FORM_MIN_HEIGHT_IN_PX = "200";

package/dist/types/ui/create-form/textfield/main.d.ts

@@ -6,4 +6,4 @@ import { TextFieldProps } from './types';
  * the handleSubmit function passed to the form <Form> that have a key matching the `name`
  * of this text field are shown above the field.
  */
-export declare function TextField({ label, name, validationHelpText, validators, defaultValue, ...restProps }: TextFieldProps): jsx.JSX.Element;
+export declare function TextField({ label, name, validationHelpText, validators, defaultValue, isRequired, ...restProps }: TextFieldProps): jsx.JSX.Element;

package/dist/types/ui/create-form/textfield/types.d.ts

@@ -1,6 +1,6 @@
 import { TextFieldProps as AKTextFieldProps } from '@atlaskit/textfield';
 import { Validator } from '../../../common/types';
-export type TextFieldProps = Omit<AKTextFieldProps, 'name' | 'isRequired'> & {
+export type TextFieldProps = Omit<AKTextFieldProps, 'name'> & {
     /** Name passed to the <Field>.*/
     name: string;
     label?: string;

package/dist/types-ts4.5/common/constants.d.ts

@@ -1,4 +1,4 @@
 export declare const ANALYTICS_CHANNEL = "media";
 export declare const COMPONENT_NAME = "linkCreate";
-export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "600";
+export declare const CREATE_FORM_MAX_WIDTH_IN_PX = "480";
 export declare const CREATE_FORM_MIN_HEIGHT_IN_PX = "200";

package/dist/types-ts4.5/ui/create-form/textfield/main.d.ts

@@ -6,4 +6,4 @@ import { TextFieldProps } from './types';
  * the handleSubmit function passed to the form <Form> that have a key matching the `name`
  * of this text field are shown above the field.
  */
-export declare function TextField({ label, name, validationHelpText, validators, defaultValue, ...restProps }: TextFieldProps): jsx.JSX.Element;
+export declare function TextField({ label, name, validationHelpText, validators, defaultValue, isRequired, ...restProps }: TextFieldProps): jsx.JSX.Element;

package/dist/types-ts4.5/ui/create-form/textfield/types.d.ts

@@ -1,6 +1,6 @@
 import { TextFieldProps as AKTextFieldProps } from '@atlaskit/textfield';
 import { Validator } from '../../../common/types';
-export type TextFieldProps = Omit<AKTextFieldProps, 'name' | 'isRequired'> & {
+export type TextFieldProps = Omit<AKTextFieldProps, 'name'> & {
     /** Name passed to the <Field>.*/
     name: string;
     label?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-create",
-  "version": "0.5.7",
+  "version": "0.6.0",
   "description": "The driver component of meta creation flow",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -53,14 +53,14 @@
   },
   "devDependencies": {
     "@atlaskit/docs": "*",
-    "@atlaskit/link-picker": "^1.22.0",
+    "@atlaskit/link-picker": "^1.23.0",
     "@atlaskit/link-test-helpers": "^4.0.0",
     "@atlaskit/popup": "^1.6.0",
     "@atlaskit/visual-regression": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
-    "@atlassian/link-create-confluence": "^6.1.0",
-    "@atlassian/link-create-presets": "^4.0.0",
-    "@atlassian/link-picker-atlassian-plugin": "^33.0.0",
+    "@atlassian/link-create-confluence": "^7.0.0",
+    "@atlassian/link-create-presets": "^5.0.0",
+    "@atlassian/link-picker-atlassian-plugin": "^33.3.0",
     "@testing-library/react": "^12.1.5",
     "@testing-library/user-event": "^14.4.3",
     "fetch-mock": "^8.0.0",

package/report.api.md

@@ -158,11 +158,12 @@ export function TextField({
   validationHelpText,
   validators,
   defaultValue,
+  isRequired,
   ...restProps
 }: TextFieldProps): jsx.JSX.Element;
 
 // @public (undocumented)
-type TextFieldProps = Omit<TextFieldProps_2, 'isRequired' | 'name'> & {
+type TextFieldProps = Omit<TextFieldProps_2, 'name'> & {
   name: string;
   label?: string;
   validationHelpText?: string;

package/tmp/api-report-tmp.d.ts

@@ -121,10 +121,10 @@ interface Option_2 {
 export { Option_2 as Option }
 
 // @public
-export function TextField({ label, name, validationHelpText, validators, defaultValue, ...restProps }: TextFieldProps): jsx.JSX.Element;
+export function TextField({ label, name, validationHelpText, validators, defaultValue, isRequired, ...restProps }: TextFieldProps): jsx.JSX.Element;
 
 // @public (undocumented)
-type TextFieldProps = Omit<TextFieldProps_2, 'isRequired' | 'name'> & {
+type TextFieldProps = Omit<TextFieldProps_2, 'name'> & {
     name: string;
     label?: string;
     validationHelpText?: string;