@momentum-design/components 0.36.1 → 0.36.2

package/dist/index.d.ts

@@ -26,9 +26,11 @@ import Toggle from './components/toggle';
 import Tooltip from './components/tooltip';
 import VirtualizedList from './components/virtualizedlist';
 import { inMemoryCache, webAPIIconsCache } from './utils/icon-cache';
+import Option from './components/option';
+import OptGroup from './components/optgroup';
 import Textarea from './components/textarea';
 import type { SpinnerSize, SpinnerVariant } from './components/spinner/spinner.types';
 import type { TextType } from './components/text/text.types';
-export { Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Coachmark, Divider, FormfieldGroup, Icon, IconProvider, Input, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Textarea, Tooltip, };
+export { Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Coachmark, Divider, FormfieldGroup, Icon, IconProvider, Input, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Option, OptGroup, Textarea, Tooltip, };
 export type { TextType, SpinnerSize, SpinnerVariant, };
 export { inMemoryCache, webAPIIconsCache };

package/dist/index.js

@@ -26,6 +26,8 @@ import Toggle from './components/toggle';
 import Tooltip from './components/tooltip';
 import VirtualizedList from './components/virtualizedlist';
 import { inMemoryCache, webAPIIconsCache } from './utils/icon-cache';
+import Option from './components/option';
+import OptGroup from './components/optgroup';
 import Textarea from './components/textarea';
-export { Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Coachmark, Divider, FormfieldGroup, Icon, IconProvider, Input, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Textarea, Tooltip, };
+export { Avatar, AvatarButton, Badge, Bullet, Button, Checkbox, Coachmark, Divider, FormfieldGroup, Icon, IconProvider, Input, Link, List, ListItem, Marker, Popover, Presence, Radio, RadioGroup, Spinner, Tab, Text, ThemeProvider, Toggle, VirtualizedList, Option, OptGroup, Textarea, Tooltip, };
 export { inMemoryCache, webAPIIconsCache };

package/dist/react/index.d.ts

@@ -16,6 +16,8 @@ export { default as Link } from './link';
 export { default as List } from './list';
 export { default as ListItem } from './listitem';
 export { default as Marker } from './marker';
+export { default as OptGroup } from './optgroup';
+export { default as Option } from './option';
 export { default as Popover } from './popover';
 export { default as Presence } from './presence';
 export { default as Radio } from './radio';

package/dist/react/index.js

@@ -16,6 +16,8 @@ export { default as Link } from './link';
 export { default as List } from './list';
 export { default as ListItem } from './listitem';
 export { default as Marker } from './marker';
+export { default as OptGroup } from './optgroup';
+export { default as Option } from './option';
 export { default as Popover } from './popover';
 export { default as Presence } from './presence';
 export { default as Radio } from './radio';

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

@@ -0,0 +1,14 @@
+import Component from '../../components/optgroup';
+/**
+ * optgroup component, which creates a grouping of mdc-option within a listbox element.
+ *
+ * @dependency mdc-text
+ *
+ * @tagname mdc-optgroup
+ *
+ * @slot default - This is a default slot for mdc-option elements.
+ *
+ * @cssproperty --mdc-optgroup-disabled-color - Allows customization of the disabled option color.
+ */
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
+export default reactWrapper;

package/dist/react/optgroup/index.js

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/optgroup';
+import { TAG_NAME } from '../../components/optgroup/optgroup.constants';
+/**
+ * optgroup component, which creates a grouping of mdc-option within a listbox element.
+ *
+ * @dependency mdc-text
+ *
+ * @tagname mdc-optgroup
+ *
+ * @slot default - This is a default slot for mdc-option elements.
+ *
+ * @cssproperty --mdc-optgroup-disabled-color - Allows customization of the disabled option color.
+ */
+const reactWrapper = createComponent({
+    tagName: TAG_NAME,
+    elementClass: Component,
+    react: React,
+    events: {},
+    displayName: 'OptGroup',
+});
+export default reactWrapper;

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

@@ -0,0 +1,21 @@
+import Component from '../../components/option';
+/**
+ * option component, which is used as a list item in a select component.<br/>
+ * We can pass an icon which will be displayed in leading position of the option label text.
+ *
+ * @tagname mdc-option
+ *
+ * @slot default - This is a default/unnamed slot
+ *
+ * @event click - (React: onClick) This event is dispatched when the option is clicked.
+ * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the option.
+ * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the option.
+ * @event focus - (React: onFocus) This event is dispatched when the option receives focus.
+ */
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
+    onClick: string;
+    onKeyDown: string;
+    onKeyUp: string;
+    onFocus: string;
+}>;
+export default reactWrapper;

package/dist/react/option/index.js

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/option';
+import { TAG_NAME } from '../../components/option/option.constants';
+/**
+ * option component, which is used as a list item in a select component.<br/>
+ * We can pass an icon which will be displayed in leading position of the option label text.
+ *
+ * @tagname mdc-option
+ *
+ * @slot default - This is a default/unnamed slot
+ *
+ * @event click - (React: onClick) This event is dispatched when the option is clicked.
+ * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the option.
+ * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the option.
+ * @event focus - (React: onFocus) This event is dispatched when the option receives focus.
+ */
+const reactWrapper = createComponent({
+    tagName: TAG_NAME,
+    elementClass: Component,
+    react: React,
+    events: {
+        onClick: 'click',
+        onKeyDown: 'keydown',
+        onKeyUp: 'keyup',
+        onFocus: 'focus',
+    },
+    displayName: 'Option',
+});
+export default reactWrapper;

package/package.json

@@ -38,5 +38,5 @@
     "lit": "^3.2.0",
     "uuid": "^11.0.5"
   },
-  "version": "0.36.1"
+  "version": "0.36.2"
 }