@simplybusiness/mobius 4.0.0-beta.5 → 4.0.0-beta.6

package/CHANGELOG.md

@@ -0,0 +1,437 @@
+# Changelog
+
+All notable changes to this project will be documented in this file, or link in [archives](#archived).
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## Unreleased
+
+### Added
+
+- `useBreakPoint` hook supports initialisation with custom breakpoints array.
+
+## [4.0.0-beta.3] - 2023-11-09
+
+### Added
+
+- Added optional `onOpen` and `onClose` props to `<Accordion>`, which triggers a callback. Replaces the previous `onClick` event.
+
+### Changed
+
+- Changed all `React.SyntheticEvent` callback types to `HTMLElementEvent`, which includes a type definition for `e.target.value` and prevents TypeScript complaints in consuming apps.
+
+## [4.0.0-beta.1] - 2023-11-07
+
+### Added
+
+- Add optional `onChange` prop to `<MaskedField>`, which provides the entire change event object
+
+### Changed
+
+- Removed invalid `aria-describedby` attribute on `Select`
+- Removed `@react-aria/textfield` library from `TextArea`
+- Removed `@react-aria/textfield` library from `TextField`
+- Removed `@react-aria/breadcrumbs` library
+- Removed `@react-aria/link` library
+- Removed `@react-aria/separator` library
+- Updated `Select` to use `useLabel` from Mobius
+- Make `<Icon>` lighter: remove `name` prop. Use `icon` prop instead
+- Make `<Accordion>` 18% lighter by replacing `react-animate-height` dependency with native animation. Other changes: 1) Prevent animation when `startOpen` value changes; 2) Attach `--is-open` class to icon and other components to make it easier to style; 3) Animate icon by default; 4) Remove `show` and `hide` classes in favour of `--is-open` when `<Accordion>` is expanded. This is to prevent accidental side-effects from generic CSS classes.
+- Move `<MaskedField>` to `@simplybusiness/chopin` package since it is Chopin specific
+
+## [4.0.0-alpha.0] - 2023-10-23
+
+### Changed
+
+- Make `<Button>` lighter: 1) remove use of `useHover()` and `useFocusRing()` hooks to reduce component size; 2) remove `--is-hovered`, `--is-focus-visible`, `--has-icon`, `hide-children` classes. Replace `--is-hovered` and `--is-focus-visible` with `:hover` and `:focus-visible` selectors; 3) remove `<Icon>` component use inside `<Button>`; add `icon` and `iconPosition` prop deprecation warning in button
+- Removed `useHover` and `useFocusFing` hooks from `TextField`
+- Removed `useHover` and `useFocusFing` hooks from `TextArea`
+- Make `<Select>` lighter: 1) remove use of `useHover()` and `useFocusRing()` hooks to reduce component size; 2) remove `--is-hovered`, `--is-focus-visible` classes. Replace with `:hover` and `:focus-visible` selectors. Replace `onChange` event value to return the entire default event, instead of `event.target.value`, which can be limiting in some use cases.
+- Removed react-modal dependency to put Modal atom on a diet, using the new HTML Dialog element. Note that some props are deprecated: (`appElement`, `preventCloseOnEsc`, `shouldFocusAfterRender`, `parentSelector` and `mobius/ModalOverlay.--is-closing`)
+- Make `<Radio>` and `<RadioButton>` lighter: 1) remove use of `useHover()` and `useFocusRing()` hooks to reduce component size; 2) remove `--is-hovered`, `--is-focus-visible` classes. Replace with `:hover` and `:focus-visible` selectors; 3) Replace `onChange` event value to return the entire default event, instead of `event.target.value`, which can be limiting in some use cases; 4) the following CSS variables have been removed in favour of native CSS `::after` element styling on `<Radio>` and `<RadioButton>`: `--bullet-width`, `--bullet-empty`, `--bullet-hover`, `--bullet-disabled`, `--bullet-disabled-selected`, `--bullet-valid`, `--bullet-valid-selected`, `--bullet-selected`, `--bullet-selected-hover`, `--bullet-invalid`, `--bullet-invalid-selected`; 5) remove `circular` prop and styles. Following design refresh in Chopin, this style is no longer used; 6) `<RadioButton>` now mostly uses `<Radio>` CSS classes due to underlying implementation being shared; 7) Controlled value support has been removed in order to only support existing use cases.
+- Make `<Checkbox>` and `<CheckboxGroup>` lighter: 1) remove use of `useHover()`, `useFocusRing()`, `useCheckboxGroup()`, `useCheckboxGroupState()` hooks to reduce component size; 2) remove `--is-hovered`, `--is-focus-visible` classes. Replace with `:hover` and `:focus-visible` selectors; 3) Replace `onChange` event value to return the entire default event for `<Checkbox>`, instead of `event.target.value`, which can be limiting in some use cases; 4) the following CSS variables have been removed in favour of native CSS `::after` element styling on `<Checkbox>`: `--checkbox-empty`, `--checkbox-empty-hover`, `--checkbox-valid`, `--checkbox-invalid`, `--checkbox-indeterminate`, `--checkbox-indeterminate-valid`, `--checkbox-indeterminate-invalid`. To replace the icon use `--checkbox` and target background colour in order to amend styles based on state; 5) remove unused `indeterminate` prop and styles to reduce complexity that needs ongoing maintenance; 6) `<CheckboxItem>` and `<CheckboxGroupitem>` now use a single `<Checkbox>` instead; 7) `<CheckboxContext>` in favour of `<CheckboxGroup>` passing relevant props to children; 8) Controlled value support has been removed in order to only support existing use cases.
+- `Progress` no longer relies on React-aria as a dependency.
+- `Slider` no longer relies on React-aria as a dependency.
+- `Fieldset` no longer relies on React-aria as a dependency.
+- `NumberField` no longer relies on React-aria as a dependency. It no longer supports formatOptions, though we expect to add that back before release.
+- Remove `icons` from `ThemeContext`; icons should be imported at application level, rather than set in Context. This is a breaking change, and Storybook no longer shows custom icons when changing theme.
+- Chopin package no longer relies on React-aria as a dependency.
+- Removed sb-legacy theme
+
+## [3.12.2] - 2023-09-27
+
+### Added
+
+- Add `onChange` to `<Accordion>` to inform user when component is expanded/collapsed (true/false)
+
+## [3.12.1] - 2023-09-27
+
+### Fixed
+
+- Fix `startOpen` prop in `<Accordion>`. Changing the prop doesn't update the internal state of the component. For example, if initial state is `true`, which then changes to `false`, the component remains in initial state.
+- Fix `<Accordion>` toggle not rendering `aria-expanded` attribute
+
+## [3.12.0] - 2023-09-25
+
+### Added
+
+- Add `headerChildren` prop to `<Accordion>` in order to enable additional content to be added in the header part of the component.
+
+## [3.11.0] - 2023-09-14
+
+### Removed
+
+- Removed DataTable atom, which is unused in any application and adds heavy dependencies from `react-table` to the core library
+
+### Changed
+
+- Moved all Chopin components into their own package, now available under `@simplybusiness/mobius-chopin`. Previous Chopin component imports - `import { Chopin } from "@simplybusiness/mobius"`. For example `<Chopin.TradeSelector />` would have to be imported as `import { TradeSelector } from "@simplybusiness/mobius-chopin";`. The motivation behind this change is to reduce the weight of Mobius imports.
+- Moved `<DatePicker>` component into its own package. Any `import { DatePicker } from "@simplybusiness/mobius"` would have to be changed to `import { DatePicker } from "@simplybusiness/mobius-datepicker";`. The motivation behind this change is to reduce the weight of Mobius imports.
+
+## [3.10.0] - 2023-08-20
+
+### Changed
+
+- Migrated all icons to [FontAwesome Sharp Regular](https://fontawesome.com/search?o=r&s=regular&f=sharp) equivalents. This was a design decision to make it easier to have uniform looking icons, and also so we have a larger pool of icons to choose from.
+- Updated Icon component to better support FontAwesome icons
+
+## [3.9.4] - 2023-08-17
+
+### Added
+
+- Add docs for `<NumberField>` `formatOptions` prop with example
+- Exclude tests and stories from ESM build
+
+## [3.9.3] - 2023-08-17
+
+### Added
+
+- Added explicit types export to mobius package.json
+
+## [3.9.0] - 2023-08-14
+
+### Changed
+
+- Upgrade Storybook from 6.5.13 to 7.2.1
+
+### Fixed
+
+- Add missing `<Checkbox>` `label` prop type. Storybook entry for the component contains JSX element as prop value. This fix adds the missing type
+
+- Fix an issue where `gap` prop is ignored in `<Grid>`. This mostly affects examples where both `gap` and `rowGap` / `columnGap` values are provided. If `gap` has a value and `rowGap` / `columnGap` have `undefined`, the combined result will be `undefined` for `gap`. This is similar issue to `<Flex>` that's been recently fixed
+
+## [3.8.0] - 2023-08-01
+
+### Added
+
+- Added custom `useBodyScrollLock` hook to prevent scrolling of body when modal is open
+
+## [3.7.0] - 2023-07-31
+
+### Added
+
+- New simpler `useButton` hook implemenation, to work correctly with
+  shadow DOM
+
+## [3.6.2] - 2023-07-26
+
+### Fixed
+
+- Fix missing `:focus-visible` state for `<Button variant="basic">`
+
+## [3.6.1] - 2023-07-26
+
+### Fixed
+
+- Add `:focus-visible` default styles alongisde programatically added `--is-focus-visible`, `--is-focused` CSS class names. This is to address an issue where no styles display when using keyboard navigation in ShadowDOM.
+- Fix previewing `@simplybusiness/icons` in Storybook. When an icon isn't published, Storybook only displays icons from an installed package as opposed to locally available set of icons.
+
+## [3.6.0] - 2023-07-20
+
+### Changed
+
+- Remove Emotion in favour of plain CSS. Emotion isn't deeply integrated in Mobius and it presents issues when embedding Mobius containing apps in ShadowDOM.
+
+### Fixed
+
+- Fix `<Icon>` not adhering to provided styles in `<Alert>` and `<StepItem>`. Also, fix `<Icon>` 'Spinning' variant not spinning.
+
+### Added
+
+- Add `Modal` `size` prop docs. Currently only `fullscreen` is documented. A user may assume that default sizing is provided out of the box. However, only a CSS class name is applied and user has to add their own styles. Documenting for clarity.
+
+## [3.5.1] - 2023-07-07
+
+### Fixed
+
+- Fix an issue where `gap` prop is ignored in `<Flex>`
+
+## [3.5.0] - 2023-04-28
+
+### Added
+
+- `MaskedField` atom, to be used for formatting user input based on available input formatters - SSN (Social Security Number) or FEIN (Federal Employer Identification Number).
+- `watch` script for running build task automatically when developing Mobius
+- "use client" at the root level, for React server component compatibility
+
+### Changed
+
+- Removed Emotion jsx import source.
+
+### Fixed
+
+- Checkbox only shows a focus ring around the box icon, rather than the entire label.
+
+## [3.4.4] - 2023-03-28
+
+### Added
+
+- Allow `data-cy` as prop to `<TradeSelector>`. This is to allow for easier Cypress testing. Currently, component has to be wrapped with a div that has `data-cy` attribute. However, since `<Question>` expects direct children to handle `errorMessage` and `validationState`, spreading all props is not an option.
+
+### Fixed
+
+- Fix an issue where `<QuestionHelp>` `onChange` handler is called twice on render. It should only be invoked when help text button is pressed
+
+## [3.4.3] - 2023-03-28
+
+### Changed
+
+- Updated Turbo to 1.8.5
+- Updated Storybook tasks to utilise Turbo cache
+
+### Added
+
+- Added missing secondary colour variable to On The Tools (ott) partner theme.
+
+## [3.4.2] - 2023-03-27
+
+### Added
+
+- Add onChange prop to `<Question>` for when help text is shown/hidden. This is to enable Snowplow analytics events to be attached
+
+## [3.4.1] - 2023-03-23
+
+### Fixed
+
+- Fix an issue where disabled button ghost variant would change colour on click
+- Replace 301 Moved Permanently with 307 Temporary Redirect for homepage
+
+## [3.4.0] - 2023-03-06
+
+### Added
+
+- Add support for `vertical` and `searchScope` properties on `TradeSelector`.
+- Add basic implementation of Trade Selector 2, which does not depend on heavy libraries
+- Update README with suggestion for testing Mobius impact in project
+- Add Trade Selector 2 CSS styles
+- Enable selecting and editing a trade in Trade Selector 2
+- Add missing features to Trade Selector 2: call real API, show loading/error/empty state, add aria labels, onTradeSelected prop
+- Add unit tests for Trade Selector 2
+- Trade Selector: on Enter, select first trade from the list
+
+### Changed
+
+- To improve code readability and maintainability in Trade Selector 2: split component state between parent component and Search Results component; extract trade fetching into its own hook; extract header into its own component; move labels into the config helper in order to colocate configuration related parameters
+- Remove Trade Selector; rename Trade Selector 2 to Trade Selector
+
+### Fixed
+
+- Fixed an issue in Trade Selector 2 where 'View all trades' link may appear when minimum input threshold is met
+
+## [3.3.2] - 2023-02-07
+
+### Fixed
+
+- PasswordField did not reveal text after clicking 'show'
+
+## [3.3.1] - 2023-01-24
+
+### Changed
+
+- Change selected trade from TradeProps to string in Trade Selector. When loading Trade Selector where trade is already known, string value is sufficient to display the chosen trade. Example use case: Chopin API, which retains trade value as a string
+
+## [3.3.0] - 2023-01-23
+
+### Added
+
+- Add ability to have selected trade on initial render in Trade Selector
+
+## [3.2.3] - 2023-01-11
+
+### Changed
+
+- Change `<Chopin.Actions />` to render as buttons by default. Previously, in order to render actions as buttons we would have to provide `elementType` prop, but that still required for `href` to be present. Now, with `href` provided, a `<LinkButton>` will show, otherwise `<Button>` will show
+
+### Fixed
+
+- Fixed `<Button />` default transition during page load by specifying only the properties that we want transitioning. This fixes an issue where conditionally added padding scales button in size in an inelegant way.
+
+## [3.2.2] - 2023-01-06
+
+### Fixed
+
+- Fixed `onClick` type for `<LinkButton>`, so that it always expects default event
+
+## [3.2.0] - 2023-01-04
+
+### Changed
+
+- Allow providing a `ReactNode` as the `errorMessage` prop for `Question`
+
+### Fixed
+
+- Fixed typo in `<Chopin.Actions />` docs
+- Fixed `<Chopin.Actions />` back button styles when disabled
+
+## [3.1.3] - 2022-12-19
+
+### Fixed
+
+- Prevent `isSelected` prop from being applied as DOM attribute on `<Checkbox>`
+
+### Added
+
+- Added docs for controlling state of individual and group `<Checkbox>`, `<Radio>`, `<RadioButton>` components
+
+## [3.1.2] - 2022-12-14
+
+### Added
+
+- Added default spacing between `<Question>` components
+- Added `closeHelpOnOutsideClick` to `<Question>` to make closing of help text on outside click behaviour optional.
+
+### Changed
+
+- Changed default `<Question>` width to take up 100% of container width
+- Changed default `<Question>` help text styles to always display inline. This is to match current behaviour in Chopin.
+
+## [3.1.1] - 2022-11-30
+
+### Added
+
+- Make `<DatePicker>` component available
+
+### Changed
+
+- Render `<Question>` label as `<span>` when no child components provided. This is to accommodate for `renderAs: "info"` in Chopin-next
+
+## [3.1.0] - 2022-11-24
+
+### Changed
+
+- Refactored props in `Chopin.Actions` molecule to only require back/next labels and respective `LinkButton` props; this allows users to assign any link or button attributes to buttons, e.g. disabled state.
+
+## [3.0.0] - 2022-11-23
+
+### Breaking Changes
+
+#### Imports
+
+Mobius imports have changed to become clearer, shorter and more consistent. We recommend uninstalling old imports before importing V3 libraries (lock files will be cleaner):
+
+```javascript
+import { Container } from "@simplybusiness/mobius";
+import "@simplybusiness/theme-sb";
+```
+
+- `mobius-core` is now simply `mobius`
+- Themes are all named `theme-{partner}`
+- Some themes expose extra components, e.g. breakpoint maps and custom icons. e.g.
+
+```javascript
+import { tick } from "@simplybusiness/theme-ott/icons";
+```
+
+Additionally, mobius and themes are available on the public NPM registry and can be used in code sandboxes withount needing an `.npmrc` file.
+
+#### "is" prefix on Input props
+
+- Change `<Button />` props: `disabled` -> `isDisabled`, `success` -> `isSuccess`, `loading` -> `isLoading`
+- Change `<Checkbox />`, `<CheckboxGroupContext />`, `<CheckboxItem />`, `<CheckboxGroup />`, `<CheckboxGroupItem />` props: `disabled` -> `isDisabled`, `indeterminate` -> `isIndeterminate`, `selected` -> `isSelected`
+- Change `<Link />`, `<LinkButton />` props: `disabled` -> `isDisabled`, `success` -> `isSuccess`, `loading` -> `isLoading`
+- Change `<NumberField />` `disabled` prop to `isDisabled`
+- Change `<NumberFieldButton />` `disabled` prop to `isDisabled`
+- Change `<PasswordField />`, `<TextField />` `disabled` prop to `isDisabled`
+- Change `<Radio />`, `<RadioButton />`, `<RadioGroup />`, `<RadioContext />` `disabled` prop to `isDisabled`
+- Change `<Select />`, `<Option />` `disabled` prop to `isDisabled`
+- Change `<Slider />` `disabled` prop to `isDisabled`
+- Change `<TextArea />`, `disabled` prop to `isDisabled`
+- Change `<Modal>` `open` prop to `isOpen`
+- Change `<DataTable />` `sortable` prop to `isSortable`
+- Change `<List />` props: `ordered` -> `isOrdered`, `reversed` -> `isReversed`
+
+### Added
+
+- Handle beta releases more elegantly. New `premajor` and `preminor` scripts adjust the version before appending `-beta.X`, do not update release docs and prompt for confirmation before committing and tagging. Tags are set as `beta` rather than
+  `latest` and beta packages are only published to Nexus.
+- Add 'All themes' documentation page to Storybook
+- Add `icons` prop to `<ThemeProvider />` to optionally load partner icon customisations.
+- `<Select />`: apply `aria-required` attribute when `isRequired` is set
+- Add spacing beneath `<TradeSelector />` to make it consistent with other form fields
+- Add `hideLabel` prop to `<TradeSelector />` to optionally hide label
+- Add optional description, placeholder labels to `<TradeSelector />`
+
+### Changed
+
+- Update `<Select />` code examples to include first disabled option
+- Remove setting partner styles in `<ThemeProvider />` via `styles` prop. Guide users to import partner styles at the root level
+- `Question` and `QuestionGroup` handle responsive layout for mobile and desktop breakpoints (where 'desktop' is `md` or larger). They no longer use `size` props.
+- Added percent format to `PercentageTotalsQuestion` inputs
+- `DatePicker` styling in `sb2` theme
+- Rename `@simplybusiness/mobius-theme-simplybusiness` theme to `@simplybusiness/theme-sb-legacy`. This is to make theme name consistent with other theme names. Also, the rename will clearly differentiate between the new `sb` theme
+- Rename `@simplybusiness/theme-sb2` to `@simplybusiness/theme-sb` simplify theme naming across the board
+- Use `sb` theme as base for `chopin`, `sb-legacy` and `ott` themes; remove duplicate code
+- Consolidate CSS variables across all themes; remove redundant SCSS modules and CSS properties as a result
+- Reduce unique `chopin` theme file count by extending from `sb-legacy` theme
+- Update colour palettes for all themes by only retaining colours used
+- Swap primary and secondary colours in `chopin` and `sb-legacy` themes in order to reflect real-life usage
+
+### Fixed
+
+- Fix `<Checkbox />` Storybook entry where user is unable to toggle. This is due to incorrectly set initial value.
+- Fix `<NumberField />` standalone input styles; also when used inside `<PercentageTotalsQuestion />` in `sb2` theme
+- Fix `<DatePicker />` input color to match other input fields in `sb2` theme
+- Address color TODOs for `simplybusiness` and `chopin` themes
+- Fix `<TextField />` `type` attribute by defining available options
+- Fix number formatting on blur on `<NumberField />`
+- Prevent `defaultSelected` prop from spilling onto `<Checkbox />` DOM attributes
+- Fixed `<Label />` validation CSS. Now valid and invalid states apply across components
+
+## Github Links
+
+[3.12.2]: https://github.com/simplybusiness/mobius/releases/tag/v3.12.2
+[3.12.1]: https://github.com/simplybusiness/mobius/releases/tag/v3.12.1
+[3.12.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.12.0
+[3.11.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.11.0
+[3.10.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.10.0
+[3.9.4]: https://github.com/simplybusiness/mobius/releases/tag/v3.9.4
+[3.9.3]: https://github.com/simplybusiness/mobius/releases/tag/v3.9.3
+[3.9.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.9.0
+[3.8.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.8.0
+[3.7.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.7.0
+[3.6.2]: https://github.com/simplybusiness/mobius/releases/tag/v3.6.2
+[3.6.1]: https://github.com/simplybusiness/mobius/releases/tag/v3.6.1
+[3.6.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.6.0
+[3.5.1]: https://github.com/simplybusiness/mobius/releases/tag/v3.5.1
+[3.5.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.5.0
+[3.4.4]: https://github.com/simplybusiness/mobius/releases/tag/v3.4.4
+[3.4.3]: https://github.com/simplybusiness/mobius/releases/tag/v3.4.3
+[3.4.2]: https://github.com/simplybusiness/mobius/releases/tag/v3.4.2
+[3.4.1]: https://github.com/simplybusiness/mobius/releases/tag/v3.4.1
+[3.4.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.4.0
+[3.3.2]: https://github.com/simplybusiness/mobius/releases/tag/v3.3.2
+[3.3.1]: https://github.com/simplybusiness/mobius/releases/tag/v3.3.1
+[3.3.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.3.0
+[3.2.3]: https://github.com/simplybusiness/mobius/releases/tag/v3.2.3
+[3.2.2]: https://github.com/simplybusiness/mobius/releases/tag/v3.2.2
+[3.2.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.2.0
+[3.1.3]: https://github.com/simplybusiness/mobius/releases/tag/v3.1.3
+[3.1.2]: https://github.com/simplybusiness/mobius/releases/tag/v3.1.2
+[3.1.1]: https://github.com/simplybusiness/mobius/releases/tag/v3.1.1
+[3.1.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.1.0
+[3.0.0]: https://github.com/simplybusiness/mobius/releases/tag/v3.0.0
+
+## Archived
+
+[Version 2 Changelog](./CHANGELOG-v2.md)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@simplybusiness/mobius",
   "license": "UNLICENSED",
-  "version": "4.0.0-beta.5",
+  "version": "4.0.0-beta.6",
   "description": "Core library of Mobius react components",
   "repository": {
     "type": "git",
@@ -26,7 +26,6 @@
   },
   "scripts": {
     "build": "yarn run -T turbo run turbo:build",
-    "prepack": "yarn run build",
     "build:cjs": "tsc",
     "build:esm": "tsc -p tsconfig.esm.json",
     "build:extract-api": "api-extractor run",
@@ -85,7 +84,7 @@
     "react-dom": "^16.13.1 || ^17.0.1 || ^18.0.0"
   },
   "dependencies": {
-    "@simplybusiness/icons": "workspace:^",
+    "@simplybusiness/icons": "^4.0.0-beta.6",
     "classnames": "^2.3.2",
     "dialog-polyfill": "^0.5.6",
     "lodash.debounce": "^4.0.8",
@@ -94,4 +93,4 @@
   "lint-staged": {
     "*.{js,ts,jsx,tsx}": "eslint --ext .tsx,.ts,.js,.jsx,.mjs --fix"
   }
-}
+}