@loadsmart/loadsmart-ui 7.3.2 → 7.3.3

package/dist/utils/toolset/highlightMatch.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 /**
  * A function that wraps a match into `mark` element to be highlighted.
  * @example

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loadsmart/loadsmart-ui",
-  "version": "7.3.2",
+  "version": "7.3.3",
   "description": "Miranda UI, a React UI library",
   "main": "dist",
   "files": [
@@ -82,10 +82,10 @@
     "@types/lodash.range": "^3.2.6",
     "@types/mdx": "^2.0.2",
     "@types/node": "^18.11.18",
-    "@types/react": "^17.0.59",
-    "@types/react-dom": "^17.0.20",
+    "@types/react": "^17.0.83",
+    "@types/react-dom": "^17.0.25",
     "@types/react-test-renderer": "^17.0.1",
-    "@types/styled-components": "^5.1.26",
+    "@types/styled-components": "^5.1.34",
     "@typescript-eslint/eslint-plugin": "^4.22.1",
     "@typescript-eslint/parser": "^4.22.1",
     "@zerollup/ts-transform-paths": "^1.7.18",
@@ -132,7 +132,7 @@
     "rollup-plugin-visualizer": "^5.5.2",
     "semantic-release": "^17.4.2",
     "storybook": "^7.0.17",
-    "styled-components": "^5.3.0",
+    "styled-components": "^5.3.11",
     "stylelint": "^13.13.1",
     "stylelint-config-prettier": "^8.0.2",
     "stylelint-config-rational-order": "^0.1.2",
@@ -181,6 +181,11 @@
     }
   },
   "resolutions": {
-    "@stylelint/postcss-css-in-js": "0.37.2"
+    "@stylelint/postcss-css-in-js": "0.37.2",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "@types/react": "17.0.83",
+    "@types/react-dom": "17.0.25",
+    "react-is": "17.0.2"
   }
 }

package/src/components/Dropdown/Dropdown.stories.tsx

@@ -80,7 +80,7 @@ export const WithSections: Story<DropdownStoryProps> = (args) => {
     <div className="flex flex-col">
       <Dropdown {...args}>
         <Dropdown.Trigger outlined={args.outlined}>Sections</Dropdown.Trigger>
-        <Dropdown.Menu align={args.align}>
+        <Dropdown.Menu>
           <Dropdown.Section header="My profile">
             {PROFILE_ACTIONS.map(({ label, value }) => (
               <Dropdown.Item
@@ -128,7 +128,6 @@ export const Extended: Story<DropdownStoryProps> = (args) => {
       <Dropdown {...args}>
         <Dropdown.Trigger outlined={args.outlined}>With Header &amp; Footer</Dropdown.Trigger>
         <Dropdown.Menu
-          align={args.align}
           header={<p className="px-2">Header</p>}
           footer={<p className="px-2">A cool footer</p>}
         >

package/src/components/IconFactory/IconFactory.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react'
+import React, { ReactNode, ComponentType } from 'react'
 import styled from 'styled-components'
 
 import transition from 'styles/transition'
@@ -50,7 +50,7 @@ export function UnknownIcon(): JSX.Element {
   return <span aria-label="Unknown icon">&#9785;</span>
 }
 
-function IconFactory(map: IconMapping): (props: IconProps<typeof map>) => JSX.Element {
+function IconFactory(map: IconMapping): ComponentType<IconProps<typeof map>> {
   function getIcon(name: keyof typeof map): ReactNode | null {
     // eslint-disable-next-line no-param-reassign
     name = String(name || '').toLowerCase()

package/src/components/Select/Select.constants.ts

@@ -4,9 +4,9 @@ import type { SelectAdapter } from './Select.types'
 
 export const GenericAdapter: SelectAdapter<unknown> = {
   getKey(o): string {
-    return get(o, 'value') as string
+    return get(o, 'value')!
   },
   getLabel(o): string {
-    return get(o, 'label') as string
+    return get(o, 'label')!
   },
 }

package/src/components/Steps/useSteps.ts

@@ -115,7 +115,7 @@ function useSteps({ steps, current: currentProp }: useStepsProps): [State, Dispa
   // TODO: gather step info to feed Steps component
   function init(steps: Array<Step>, current?: number | string): State {
     return {
-      current: current || (get(steps, '0.id') as number | string),
+      current: current || get(steps, '0.id')!,
       steps,
     }
   }

package/src/components/Tag/Tag.tsx

@@ -315,7 +315,7 @@ const StyledCloseButton = styled.button<WithSizeProps & WithVariantProps>`
       'tag-warning-background--focus': whenProps({ variant: 'warning' }),
       'tag-danger-background--focus': whenProps({ variant: 'danger' }),
     })};
-    box-shadow: ${token('tag-outline')};
+    box-shadow: ${token('tag-box-shadow')};
   }
 `
 

package/src/hooks/useSelectable/SelectableStrategy.ts

@@ -14,7 +14,7 @@ export type SelectableStrategyContext<T extends Selectable> = {
 
 const GenericAdapter: SelectableAdapter<unknown> = {
   getKey(o): string {
-    return get(o, 'value') as string
+    return get(o, 'value')!
   },
 }