@momentum-design/components 0.43.0 → 0.43.1

package/dist/index.d.ts

@@ -33,6 +33,7 @@ import Progressbar from './components/progressbar';
 import Option from './components/option';
 import OptGroup from './components/optgroup';
 import Textarea from './components/textarea';
+import Searchfield from './components/searchfield';
 import Brandvisual from './components/brandvisual';
 import type { SpinnerSize, SpinnerVariant } from './components/spinner/spinner.types';
 import type { TextType } from './components/text/text.types';
@@ -41,6 +42,6 @@ import type { BadgeType } from './components/badge/badge.types';
 import type { IconButtonSize, PillButtonSize, ButtonVariant, ButtonColor } from './components/button/button.types';
 import { BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES } from './components/button/button.constants';
 import { inMemoryCache, webAPIIconsCache } from './utils/icon-cache';
-export { AlertChip, Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Chip, Coachmark, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Option, OptGroup, Progressbar, Textarea, Tooltip, Brandvisual, };
+export { AlertChip, Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Chip, Coachmark, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Option, OptGroup, Progressbar, Textarea, Tooltip, Searchfield, Brandvisual, };
 export type { TextType, SpinnerSize, SpinnerVariant, PopoverPlacement, BadgeType, IconButtonSize, PillButtonSize, ButtonVariant, ButtonColor, };
 export { inMemoryCache, webAPIIconsCache, BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES };

package/dist/index.js

@@ -34,11 +34,12 @@ import Progressbar from './components/progressbar';
 import Option from './components/option';
 import OptGroup from './components/optgroup';
 import Textarea from './components/textarea';
+import Searchfield from './components/searchfield';
 import Brandvisual from './components/brandvisual';
 // Constants / Utils Imports
 import { BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES, } from './components/button/button.constants';
 import { inMemoryCache, webAPIIconsCache } from './utils/icon-cache';
 // Components Exports
-export { AlertChip, Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Chip, Coachmark, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Option, OptGroup, Progressbar, Textarea, Tooltip, Brandvisual, };
+export { AlertChip, Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Chip, Coachmark, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Option, OptGroup, Progressbar, Textarea, Tooltip, Searchfield, Brandvisual, };
 // Constants / Utils Exports
 export { inMemoryCache, webAPIIconsCache, BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES };

package/dist/react/index.d.ts

@@ -1,6 +1,6 @@
 export { default as AlertChip } from './alertchip';
-export { default as AvatarButton } from './avatarbutton';
 export { default as Avatar } from './avatar';
+export { default as AvatarButton } from './avatarbutton';
 export { default as Badge } from './badge';
 export { default as Brandvisual } from './brandvisual';
 export { default as Bullet } from './bullet';
@@ -28,6 +28,7 @@ export { default as Presence } from './presence';
 export { default as Progressbar } from './progressbar';
 export { default as Radio } from './radio';
 export { default as RadioGroup } from './radiogroup';
+export { default as Searchfield } from './searchfield';
 export { default as Spinner } from './spinner';
 export { default as Tab } from './tab';
 export { default as Text } from './text';

package/dist/react/index.js

@@ -1,6 +1,6 @@
 export { default as AlertChip } from './alertchip';
-export { default as AvatarButton } from './avatarbutton';
 export { default as Avatar } from './avatar';
+export { default as AvatarButton } from './avatarbutton';
 export { default as Badge } from './badge';
 export { default as Brandvisual } from './brandvisual';
 export { default as Bullet } from './bullet';
@@ -28,6 +28,7 @@ export { default as Presence } from './presence';
 export { default as Progressbar } from './progressbar';
 export { default as Radio } from './radio';
 export { default as RadioGroup } from './radiogroup';
+export { default as Searchfield } from './searchfield';
 export { default as Spinner } from './spinner';
 export { default as Tab } from './tab';
 export { default as Text } from './text';

package/dist/react/inputchip/index.d.ts

@@ -12,10 +12,7 @@ import Component from '../../components/inputchip';
  * @dependency mdc-icon
  * @dependency mdc-text
  *
- * @event click - (React: onClick) This event is dispatched when the close button is clicked.
- * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the close button.
- * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the close button.
- * @event focus - (React: onFocus) This event is dispatched when the close button receives focus.
+ * @event remove - This event is dispatched when the close button is activated. It bubbles and is composed.
  *
  * @cssproperty --mdc-chip-color - The color of the chip.
  * @cssproperty --mdc-chip-border-color - The border color of the chip.
@@ -23,10 +20,6 @@ import Component from '../../components/inputchip';
  *
  */
 declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
-    undefined: string;
-    onClick: string;
-    onKeyDown: string;
-    onKeyUp: string;
-    onFocus: string;
+    onRemove: string;
 }>;
 export default reactWrapper;

package/dist/react/inputchip/index.js

@@ -15,10 +15,7 @@ import { TAG_NAME } from '../../components/inputchip/inputchip.constants';
  * @dependency mdc-icon
  * @dependency mdc-text
  *
- * @event click - (React: onClick) This event is dispatched when the close button is clicked.
- * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the close button.
- * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the close button.
- * @event focus - (React: onFocus) This event is dispatched when the close button receives focus.
+ * @event remove - This event is dispatched when the close button is activated. It bubbles and is composed.
  *
  * @cssproperty --mdc-chip-color - The color of the chip.
  * @cssproperty --mdc-chip-border-color - The border color of the chip.
@@ -30,11 +27,7 @@ const reactWrapper = createComponent({
     elementClass: Component,
     react: React,
     events: {
-        undefined: 'undefined',
-        onClick: 'click',
-        onKeyDown: 'keydown',
-        onKeyUp: 'keyup',
-        onFocus: 'focus',
+        onRemove: 'remove',
     },
     displayName: 'InputChip',
 });

package/dist/react/searchfield/index.d.ts

@@ -0,0 +1,21 @@
+import Component from '../../components/searchfield';
+/**
+ * searchfield component is used as an input field for search functionality.
+ *
+ * It supports `mdc-inputchip` as filters.
+ *
+ * This component is built by extending the `mdc-input` component.
+ *
+ * @tagname mdc-searchfield
+ *
+ * @slot filters - Slot for input chips
+ *
+ */
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
+    undefined: string;
+    onInput: string;
+    onChange: string;
+    onFocus: string;
+    onBlur: string;
+}>;
+export default reactWrapper;

package/dist/react/searchfield/index.js

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/searchfield';
+import { TAG_NAME } from '../../components/searchfield/searchfield.constants';
+/**
+ * searchfield component is used as an input field for search functionality.
+ *
+ * It supports `mdc-inputchip` as filters.
+ *
+ * This component is built by extending the `mdc-input` component.
+ *
+ * @tagname mdc-searchfield
+ *
+ * @slot filters - Slot for input chips
+ *
+ */
+const reactWrapper = createComponent({
+    tagName: TAG_NAME,
+    elementClass: Component,
+    react: React,
+    events: {
+        undefined: 'undefined',
+        onInput: 'input',
+        onChange: 'change',
+        onFocus: 'focus',
+        onBlur: 'blur',
+    },
+    displayName: 'Searchfield',
+});
+export default reactWrapper;

package/package.json

@@ -38,5 +38,5 @@
     "lit": "^3.2.0",
     "uuid": "^11.0.5"
   },
-  "version": "0.43.0"
+  "version": "0.43.1"
 }