@entur/chip 0.4.22 → 0.5.0

package/CHANGELOG.md

@@ -3,6 +3,20 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.5.0](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.4.24...@entur/chip@0.5.0) (2022-03-14)
+
+### Features
+
+- **action chip:** add loading state to action chip ([290e709](https://bitbucket.org/enturas/design-system/commits/290e709baef2c7513fc3b85e834fabb34697842e))
+
+## [0.4.24](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.4.23...@entur/chip@0.4.24) (2022-03-01)
+
+**Note:** Version bump only for package @entur/chip
+
+## [0.4.23](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.4.22...@entur/chip@0.4.23) (2022-02-09)
+
+**Note:** Version bump only for package @entur/chip
+
 ## [0.4.22](https://bitbucket.org/enturas/design-system/compare/@entur/chip@0.4.21...@entur/chip@0.4.22) (2022-01-21)
 
 **Note:** Version bump only for package @entur/chip

package/dist/ActionChip.d.ts

@@ -6,5 +6,9 @@ export declare type ActionChipProps = {
     children: React.ReactNode;
     /** Ekstra klassenavn */
     className?: string;
+    /** Om chip-en er opptatt, f.eks med å oppdatere informasjon
+     * @default false
+     */
+    loading?: boolean;
 } & React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
-export declare const ActionChip: React.ForwardRefExoticComponent<Pick<ActionChipProps, "children" | "className" | "key" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const ActionChip: React.ForwardRefExoticComponent<Pick<ActionChipProps, "loading" | "key" | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & React.RefAttributes<HTMLButtonElement>>;

package/dist/ChoiceChip.d.ts

@@ -13,4 +13,4 @@ export declare type ChoiceChipProps = {
     /** Verdien til ChoiceChip */
     value: string;
 } & Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, 'value'>;
-export declare const ChoiceChip: React.ForwardRefExoticComponent<Pick<ChoiceChipProps, "value" | "key" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "width" | "onChange" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLInputElement>>;
+export declare const ChoiceChip: React.ForwardRefExoticComponent<Pick<ChoiceChipProps, "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "value" | "key" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "width" | "onChange" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLInputElement>>;

package/dist/chip.cjs.development.js

@@ -2,14 +2,36 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
 var utils = require('@entur/utils');
-var React = _interopDefault(require('react'));
-var classNames = _interopDefault(require('classnames'));
+var React = require('react');
+var classNames = require('classnames');
+var loader = require('@entur/loader');
 var icons = require('@entur/icons');
 var form = require('@entur/form');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
+
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -25,10 +47,10 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-var ChoiceChipGroupContext = /*#__PURE__*/React.createContext(null);
+var ChoiceChipGroupContext = /*#__PURE__*/React__default["default"].createContext(null);
 var ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;
 var useChoiceChipGroupContext = function useChoiceChipGroupContext() {
-  var context = React.useContext(ChoiceChipGroupContext);
+  var context = React__default["default"].useContext(ChoiceChipGroupContext);
 
   if (!context) {
     throw new Error('You need to wrap your ChoiceChips in a ChoiceChipGroup-component');
@@ -37,19 +59,20 @@ var useChoiceChipGroupContext = function useChoiceChipGroupContext() {
   return context;
 };
 
-var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+var _excluded$4 = ["className", "children", "value", "disabled", "style"];
+var ChoiceChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var className = _ref.className,
       children = _ref.children,
       value = _ref.value,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       style = _ref.style,
-      rest = _objectWithoutPropertiesLoose(_ref, ["className", "children", "value", "disabled", "style"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
 
-  var childrenArray = React.Children.toArray(children);
+  var childrenArray = React__default["default"].Children.toArray(children);
   var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
   var hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== 'string';
-  var classList = classNames(className, 'eds-chip', {
+  var classList = classNames__default["default"](className, 'eds-chip', {
     'eds-chip--disabled': disabled,
     'eds-chip--leading-icon': hasLeadingIcon,
     'eds-chip--trailing-icon': hasTrailingIcon
@@ -60,10 +83,10 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       selectedValue = _useChoiceChipGroupCo.value,
       onChange = _useChoiceChipGroupCo.onChange;
 
-  return React.createElement("label", {
+  return React__default["default"].createElement("label", {
     className: "eds-choice-chip",
     style: style
-  }, React.createElement("input", Object.assign({
+  }, React__default["default"].createElement("input", _extends({
     className: "eds-choice-chip__input",
     type: "radio",
     name: name,
@@ -72,46 +95,53 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     disabled: disabled,
     checked: selectedValue === value,
     onChange: onChange
-  }, rest)), React.createElement("div", {
+  }, rest)), React__default["default"].createElement("div", {
     className: classList
   }, children));
 });
 
-var ActionChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+var _excluded$3 = ["children", "className", "loading"];
+var ActionChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var children = _ref.children,
       className = _ref.className,
-      rest = _objectWithoutPropertiesLoose(_ref, ["children", "className"]);
+      _ref$loading = _ref.loading,
+      loading = _ref$loading === void 0 ? false : _ref$loading,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
 
-  var childrenArray = React.Children.toArray(children);
+  var childrenArray = React__default["default"].Children.toArray(children);
   var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
   var hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== 'string';
-  return React.createElement("button", Object.assign({
-    className: classNames('eds-chip', 'eds-action-chip', {
+  return React__default["default"].createElement("button", _extends({
+    className: classNames__default["default"]('eds-chip', 'eds-action-chip', {
       'eds-chip--leading-icon': hasLeadingIcon,
       'eds-chip--trailing-icon': hasTrailingIcon
     }, className),
     ref: ref,
     type: "button"
-  }, rest), children);
+  }, rest), loading ? React__default["default"].createElement(loader.LoadingDots, {
+    className: "eds-action-chip__loading-dots"
+  }) : children);
 });
 
-var TagChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+var _excluded$2 = ["children", "className", "onClose"];
+var TagChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var children = _ref.children,
       className = _ref.className,
       onClose = _ref.onClose,
-      rest = _objectWithoutPropertiesLoose(_ref, ["children", "className", "onClose"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
 
-  return React.createElement("div", Object.assign({
-    className: classNames('eds-chip', 'eds-tag-chip', className)
-  }, rest), children, React.createElement("button", {
+  return React__default["default"].createElement("div", _extends({
+    className: classNames__default["default"]('eds-chip', 'eds-tag-chip', className)
+  }, rest), children, React__default["default"].createElement("button", {
     className: "eds-tag-chip__close-button",
     type: "button",
     onClick: onClose,
     ref: ref
-  }, React.createElement(icons.CloseIcon, null)));
+  }, React__default["default"].createElement(icons.CloseIcon, null)));
 });
 
-var FilterChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+var _excluded$1 = ["className", "children", "value", "disabled", "name", "style"];
+var FilterChip = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var className = _ref.className,
       children = _ref.children,
       value = _ref.value,
@@ -119,55 +149,56 @@ var FilterChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       name = _ref.name,
       style = _ref.style,
-      rest = _objectWithoutPropertiesLoose(_ref, ["className", "children", "value", "disabled", "name", "style"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
 
-  var classList = classNames(className, 'eds-chip', 'eds-filter-chip');
-  return React.createElement("label", {
+  var classList = classNames__default["default"](className, 'eds-chip', 'eds-filter-chip');
+  return React__default["default"].createElement("label", {
     className: classList,
     style: style
-  }, React.createElement("input", Object.assign({
+  }, React__default["default"].createElement("input", _extends({
     className: "eds-filter-chip__input",
     type: "checkbox",
     name: name,
     ref: ref,
     value: value,
     disabled: disabled
-  }, rest)), React.createElement("span", {
+  }, rest)), React__default["default"].createElement("span", {
     className: "eds-filter-chip__icon"
-  }, React.createElement(CheckboxIcon, null)), children);
+  }, React__default["default"].createElement(CheckboxIcon, null)), children);
 });
 
 var CheckboxIcon = function CheckboxIcon() {
-  return React.createElement("svg", {
+  return React__default["default"].createElement("svg", {
     className: "eds-filter-chip-icon",
     width: "11px",
     height: "9px",
     viewBox: "6 11 37 33"
-  }, React.createElement("path", {
+  }, React__default["default"].createElement("path", {
     className: "eds-filter-chip-icon__path",
     d: "M14.1 27.2l7.1 7.2 14.6-14.8",
     fill: "none"
   }));
 };
 
+var _excluded = ["name", "value", "children", "onChange", "label"];
 var ChoiceChipGroup = function ChoiceChipGroup(_ref) {
   var name = _ref.name,
       value = _ref.value,
       children = _ref.children,
       onChange = _ref.onChange,
       label = _ref.label,
-      rest = _objectWithoutPropertiesLoose(_ref, ["name", "value", "children", "onChange", "label"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
-  var contextValue = React.useMemo(function () {
+  var contextValue = React__default["default"].useMemo(function () {
     return {
       name: name,
       value: value,
       onChange: onChange
     };
   }, [name, value, onChange]);
-  return React.createElement(ChoiceChipGroupContextProvider, {
+  return React__default["default"].createElement(ChoiceChipGroupContextProvider, {
     value: contextValue
-  }, React.createElement(form.Fieldset, Object.assign({
+  }, React__default["default"].createElement(form.Fieldset, _extends({
     className: "eds-choice-chips-group",
     label: label
   }, rest), children));

package/dist/chip.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.cjs.development.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n  name: string;\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n  React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n  () => {\n    const context = React.useContext(ChoiceChipGroupContext);\n    if (!context) {\n      throw new Error(\n        'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n      );\n    }\n    return context;\n  };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om Choicechip er deaktivert eller ikke\n   * @default false\n   */\n  disabled?: boolean;\n  /** Label til ChoiceChip */\n  children?: React.ReactNode;\n  /** Verdien til ChoiceChip */\n  value: string;\n} & Omit<\n  React.DetailedHTMLProps<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HTMLInputElement\n  >,\n  'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n  (\n    { className, children, value, disabled = false, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    const classList = cx(className, 'eds-chip', {\n      'eds-chip--disabled': disabled,\n      'eds-chip--leading-icon': hasLeadingIcon,\n      'eds-chip--trailing-icon': hasTrailingIcon,\n    });\n    const {\n      name,\n      value: selectedValue,\n      onChange,\n    } = useChoiceChipGroupContext();\n    return (\n      <label className=\"eds-choice-chip\" style={style}>\n        <input\n          className=\"eds-choice-chip__input\"\n          type=\"radio\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          checked={selectedValue === value}\n          onChange={onChange}\n          {...rest}\n        />\n        <div className={classList}>{children}</div>\n      </label>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n  /** Teksten som vises i ActionChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n  ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    return (\n      <button\n        className={classNames(\n          'eds-chip',\n          'eds-action-chip',\n          {\n            'eds-chip--leading-icon': hasLeadingIcon,\n            'eds-chip--trailing-icon': hasTrailingIcon,\n          },\n          className,\n        )}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      >\n        {children}\n      </button>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n  /** Teksten som vises i TagChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Callback for når man klikker på krysset */\n  onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n  (\n    { children, className, onClose, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    return (\n      <div\n        className={classNames('eds-chip', 'eds-tag-chip', className)}\n        {...rest}\n      >\n        {children}\n        <button\n          className=\"eds-tag-chip__close-button\"\n          type=\"button\"\n          onClick={onClose}\n          ref={ref}\n        >\n          <CloseIcon />\n        </button>\n      </div>\n    );\n  },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label til FilterChip */\n  children?: React.ReactNode;\n  /** Verdien til FilterChip */\n  value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n  (\n    { className, children, value, disabled = false, name, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n    return (\n      <label className={classList} style={style}>\n        <input\n          className=\"eds-filter-chip__input\"\n          type=\"checkbox\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          {...rest}\n        />\n        <span className=\"eds-filter-chip__icon\">\n          <CheckboxIcon />\n        </span>\n        {children}\n      </label>\n    );\n  },\n);\n\nconst CheckboxIcon: React.FC = () => {\n  return (\n    <svg\n      className=\"eds-filter-chip-icon\"\n      width=\"11px\"\n      height=\"9px\"\n      viewBox=\"6 11 37 33\"\n    >\n      <path\n        className=\"eds-filter-chip-icon__path\"\n        d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n        fill=\"none\"\n      />\n    </svg>\n  );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n  /** Navnet til ChoiceChipsGroup */\n  name: string;\n  /** Verdien til den valgte ChoiceChipen */\n  value: string | null;\n  /** ChoiceChip-komponentene sendes inn som children */\n  children: React.ReactNode;\n  /** En callback som blir kalles hver gang en ChoiceChip klikkes på  */\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Labelen til ChoiceChip-gruppen. */\n  label?: React.ReactNode;\n  [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n  name,\n  value,\n  children,\n  onChange,\n  label,\n  ...rest\n}) => {\n  const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n    name,\n    value,\n    onChange,\n  ]);\n  return (\n    <ChoiceChipGroupContextProvider value={contextValue}>\n      <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n        {children}\n      </Fieldset>\n    </ChoiceChipGroupContextProvider>\n  );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":"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"}
+{"version":3,"file":"chip.cjs.development.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n  name: string;\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n  React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n  () => {\n    const context = React.useContext(ChoiceChipGroupContext);\n    if (!context) {\n      throw new Error(\n        'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n      );\n    }\n    return context;\n  };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om Choicechip er deaktivert eller ikke\n   * @default false\n   */\n  disabled?: boolean;\n  /** Label til ChoiceChip */\n  children?: React.ReactNode;\n  /** Verdien til ChoiceChip */\n  value: string;\n} & Omit<\n  React.DetailedHTMLProps<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HTMLInputElement\n  >,\n  'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n  (\n    { className, children, value, disabled = false, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    const classList = cx(className, 'eds-chip', {\n      'eds-chip--disabled': disabled,\n      'eds-chip--leading-icon': hasLeadingIcon,\n      'eds-chip--trailing-icon': hasTrailingIcon,\n    });\n    const {\n      name,\n      value: selectedValue,\n      onChange,\n    } = useChoiceChipGroupContext();\n    return (\n      <label className=\"eds-choice-chip\" style={style}>\n        <input\n          className=\"eds-choice-chip__input\"\n          type=\"radio\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          checked={selectedValue === value}\n          onChange={onChange}\n          {...rest}\n        />\n        <div className={classList}>{children}</div>\n      </label>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { LoadingDots } from '@entur/loader';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n  /** Teksten som vises i ActionChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om chip-en er opptatt, f.eks med å oppdatere informasjon\n   * @default false\n   */\n  loading?: boolean;\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n  (\n    { children, className, loading = false, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    return (\n      <button\n        className={classNames(\n          'eds-chip',\n          'eds-action-chip',\n          {\n            'eds-chip--leading-icon': hasLeadingIcon,\n            'eds-chip--trailing-icon': hasTrailingIcon,\n          },\n          className,\n        )}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      >\n        {loading ? (\n          <LoadingDots className=\"eds-action-chip__loading-dots\" />\n        ) : (\n          children\n        )}\n      </button>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n  /** Teksten som vises i TagChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Callback for når man klikker på krysset */\n  onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n  (\n    { children, className, onClose, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    return (\n      <div\n        className={classNames('eds-chip', 'eds-tag-chip', className)}\n        {...rest}\n      >\n        {children}\n        <button\n          className=\"eds-tag-chip__close-button\"\n          type=\"button\"\n          onClick={onClose}\n          ref={ref}\n        >\n          <CloseIcon />\n        </button>\n      </div>\n    );\n  },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label til FilterChip */\n  children?: React.ReactNode;\n  /** Verdien til FilterChip */\n  value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n  (\n    { className, children, value, disabled = false, name, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n    return (\n      <label className={classList} style={style}>\n        <input\n          className=\"eds-filter-chip__input\"\n          type=\"checkbox\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          {...rest}\n        />\n        <span className=\"eds-filter-chip__icon\">\n          <CheckboxIcon />\n        </span>\n        {children}\n      </label>\n    );\n  },\n);\n\nconst CheckboxIcon: React.FC = () => {\n  return (\n    <svg\n      className=\"eds-filter-chip-icon\"\n      width=\"11px\"\n      height=\"9px\"\n      viewBox=\"6 11 37 33\"\n    >\n      <path\n        className=\"eds-filter-chip-icon__path\"\n        d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n        fill=\"none\"\n      />\n    </svg>\n  );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n  /** Navnet til ChoiceChipsGroup */\n  name: string;\n  /** Verdien til den valgte ChoiceChipen */\n  value: string | null;\n  /** ChoiceChip-komponentene sendes inn som children */\n  children: React.ReactNode;\n  /** En callback som blir kalles hver gang en ChoiceChip klikkes på  */\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Labelen til ChoiceChip-gruppen. */\n  label?: React.ReactNode;\n  [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n  name,\n  value,\n  children,\n  onChange,\n  label,\n  ...rest\n}) => {\n  const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n    name,\n    value,\n    onChange,\n  ]);\n  return (\n    <ChoiceChipGroupContextProvider value={contextValue}>\n      <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n        {children}\n      </Fieldset>\n    </ChoiceChipGroupContextProvider>\n  );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","loading","classNames","LoadingDots","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":"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"}

package/dist/chip.cjs.production.min.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@entur/utils"),n=e(require("react")),a=e(require("classnames")),i=require("@entur/icons"),r=require("@entur/form");function l(e,t){if(null==e)return{};var n,a,i={},r=Object.keys(e);for(a=0;a<r.length;a++)t.indexOf(n=r[a])>=0||(i[n]=e[n]);return i}var c=n.createContext(null),s=c.Provider,o=n.forwardRef((function(e,t){var i=e.className,r=e.children,s=e.value,o=e.disabled,d=void 0!==o&&o,h=e.style,u=l(e,["className","children","value","disabled","style"]),p=n.Children.toArray(r),m=a(i,"eds-chip",{"eds-chip--disabled":d,"eds-chip--leading-icon":p.length>1&&"string"!=typeof p[0],"eds-chip--trailing-icon":p.length>1&&"string"!=typeof p[p.length-1]}),f=function(){var e=n.useContext(c);if(!e)throw new Error("You need to wrap your ChoiceChips in a ChoiceChipGroup-component");return e}();return n.createElement("label",{className:"eds-choice-chip",style:h},n.createElement("input",Object.assign({className:"eds-choice-chip__input",type:"radio",name:f.name,ref:t,value:s,disabled:d,checked:f.value===s,onChange:f.onChange},u)),n.createElement("div",{className:m},r))})),d=n.forwardRef((function(e,t){var i=e.children,r=e.className,c=l(e,["children","className"]),s=n.Children.toArray(i);return n.createElement("button",Object.assign({className:a("eds-chip","eds-action-chip",{"eds-chip--leading-icon":s.length>1&&"string"!=typeof s[0],"eds-chip--trailing-icon":s.length>1&&"string"!=typeof s[s.length-1]},r),ref:t,type:"button"},c),i)})),h=n.forwardRef((function(e,t){var r=e.children,c=e.className,s=e.onClose,o=l(e,["children","className","onClose"]);return n.createElement("div",Object.assign({className:a("eds-chip","eds-tag-chip",c)},o),r,n.createElement("button",{className:"eds-tag-chip__close-button",type:"button",onClick:s,ref:t},n.createElement(i.CloseIcon,null)))})),u=n.forwardRef((function(e,t){var i=e.className,r=e.children,c=e.value,s=e.disabled,o=void 0!==s&&s,d=e.name,h=e.style,u=l(e,["className","children","value","disabled","name","style"]),m=a(i,"eds-chip","eds-filter-chip");return n.createElement("label",{className:m,style:h},n.createElement("input",Object.assign({className:"eds-filter-chip__input",type:"checkbox",name:d,ref:t,value:c,disabled:o},u)),n.createElement("span",{className:"eds-filter-chip__icon"},n.createElement(p,null)),r)})),p=function(){return n.createElement("svg",{className:"eds-filter-chip-icon",width:"11px",height:"9px",viewBox:"6 11 37 33"},n.createElement("path",{className:"eds-filter-chip-icon__path",d:"M14.1 27.2l7.1 7.2 14.6-14.8",fill:"none"}))};t.warnAboutMissingStyles("chip","form"),exports.ActionChip=d,exports.ChoiceChip=o,exports.ChoiceChipGroup=function(e){var t=e.name,a=e.value,i=e.children,c=e.onChange,o=e.label,d=l(e,["name","value","children","onChange","label"]),h=n.useMemo((function(){return{name:t,value:a,onChange:c}}),[t,a,c]);return n.createElement(s,{value:h},n.createElement(r.Fieldset,Object.assign({className:"eds-choice-chips-group",label:o},d),i))},exports.FilterChip=u,exports.TagChip=h;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),a=require("classnames"),l=require("@entur/loader"),n=require("@entur/icons"),r=require("@entur/form");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=i(t),s=i(a);function d(){return d=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var l in a)Object.prototype.hasOwnProperty.call(a,l)&&(e[l]=a[l])}return e},d.apply(this,arguments)}function o(e,t){if(null==e)return{};var a,l,n={},r=Object.keys(e);for(l=0;l<r.length;l++)t.indexOf(a=r[l])>=0||(n[a]=e[a]);return n}var u=c.default.createContext(null),f=u.Provider,h=["className","children","value","disabled","style"],p=c.default.forwardRef((function(e,t){var a=e.className,l=e.children,n=e.value,r=e.disabled,i=void 0!==r&&r,f=e.style,p=o(e,h),m=c.default.Children.toArray(l),g=s.default(a,"eds-chip",{"eds-chip--disabled":i,"eds-chip--leading-icon":m.length>1&&"string"!=typeof m[0],"eds-chip--trailing-icon":m.length>1&&"string"!=typeof m[m.length-1]}),v=function(){var e=c.default.useContext(u);if(!e)throw new Error("You need to wrap your ChoiceChips in a ChoiceChipGroup-component");return e}();return c.default.createElement("label",{className:"eds-choice-chip",style:f},c.default.createElement("input",d({className:"eds-choice-chip__input",type:"radio",name:v.name,ref:t,value:n,disabled:i,checked:v.value===n,onChange:v.onChange},p)),c.default.createElement("div",{className:g},l))})),m=["children","className","loading"],g=c.default.forwardRef((function(e,t){var a=e.children,n=e.className,r=e.loading,i=void 0!==r&&r,u=o(e,m),f=c.default.Children.toArray(a);return c.default.createElement("button",d({className:s.default("eds-chip","eds-action-chip",{"eds-chip--leading-icon":f.length>1&&"string"!=typeof f[0],"eds-chip--trailing-icon":f.length>1&&"string"!=typeof f[f.length-1]},n),ref:t,type:"button"},u),i?c.default.createElement(l.LoadingDots,{className:"eds-action-chip__loading-dots"}):a)})),v=["children","className","onClose"],b=c.default.forwardRef((function(e,t){var a=e.children,l=e.className,r=e.onClose,i=o(e,v);return c.default.createElement("div",d({className:s.default("eds-chip","eds-tag-chip",l)},i),a,c.default.createElement("button",{className:"eds-tag-chip__close-button",type:"button",onClick:r,ref:t},c.default.createElement(n.CloseIcon,null)))})),y=["className","children","value","disabled","name","style"],C=c.default.forwardRef((function(e,t){var a=e.className,l=e.children,n=e.value,r=e.disabled,i=void 0!==r&&r,u=e.name,f=e.style,h=o(e,y),p=s.default(a,"eds-chip","eds-filter-chip");return c.default.createElement("label",{className:p,style:f},c.default.createElement("input",d({className:"eds-filter-chip__input",type:"checkbox",name:u,ref:t,value:n,disabled:i},h)),c.default.createElement("span",{className:"eds-filter-chip__icon"},c.default.createElement(N,null)),l)})),N=function(){return c.default.createElement("svg",{className:"eds-filter-chip-icon",width:"11px",height:"9px",viewBox:"6 11 37 33"},c.default.createElement("path",{className:"eds-filter-chip-icon__path",d:"M14.1 27.2l7.1 7.2 14.6-14.8",fill:"none"}))},E=["name","value","children","onChange","label"];e.warnAboutMissingStyles("chip","form"),exports.ActionChip=g,exports.ChoiceChip=p,exports.ChoiceChipGroup=function(e){var t=e.name,a=e.value,l=e.children,n=e.onChange,i=e.label,s=o(e,E),u=c.default.useMemo((function(){return{name:t,value:a,onChange:n}}),[t,a,n]);return c.default.createElement(f,{value:u},c.default.createElement(r.Fieldset,d({className:"eds-choice-chips-group",label:i},s),l))},exports.FilterChip=C,exports.TagChip=b;
 //# sourceMappingURL=chip.cjs.production.min.js.map

package/dist/chip.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.cjs.production.min.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/index.tsx","../src/ChoiceChipGroup.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n  name: string;\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n  React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n  () => {\n    const context = React.useContext(ChoiceChipGroupContext);\n    if (!context) {\n      throw new Error(\n        'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n      );\n    }\n    return context;\n  };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om Choicechip er deaktivert eller ikke\n   * @default false\n   */\n  disabled?: boolean;\n  /** Label til ChoiceChip */\n  children?: React.ReactNode;\n  /** Verdien til ChoiceChip */\n  value: string;\n} & Omit<\n  React.DetailedHTMLProps<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HTMLInputElement\n  >,\n  'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n  (\n    { className, children, value, disabled = false, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    const classList = cx(className, 'eds-chip', {\n      'eds-chip--disabled': disabled,\n      'eds-chip--leading-icon': hasLeadingIcon,\n      'eds-chip--trailing-icon': hasTrailingIcon,\n    });\n    const {\n      name,\n      value: selectedValue,\n      onChange,\n    } = useChoiceChipGroupContext();\n    return (\n      <label className=\"eds-choice-chip\" style={style}>\n        <input\n          className=\"eds-choice-chip__input\"\n          type=\"radio\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          checked={selectedValue === value}\n          onChange={onChange}\n          {...rest}\n        />\n        <div className={classList}>{children}</div>\n      </label>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n  /** Teksten som vises i ActionChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n  ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    return (\n      <button\n        className={classNames(\n          'eds-chip',\n          'eds-action-chip',\n          {\n            'eds-chip--leading-icon': hasLeadingIcon,\n            'eds-chip--trailing-icon': hasTrailingIcon,\n          },\n          className,\n        )}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      >\n        {children}\n      </button>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n  /** Teksten som vises i TagChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Callback for når man klikker på krysset */\n  onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n  (\n    { children, className, onClose, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    return (\n      <div\n        className={classNames('eds-chip', 'eds-tag-chip', className)}\n        {...rest}\n      >\n        {children}\n        <button\n          className=\"eds-tag-chip__close-button\"\n          type=\"button\"\n          onClick={onClose}\n          ref={ref}\n        >\n          <CloseIcon />\n        </button>\n      </div>\n    );\n  },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label til FilterChip */\n  children?: React.ReactNode;\n  /** Verdien til FilterChip */\n  value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n  (\n    { className, children, value, disabled = false, name, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n    return (\n      <label className={classList} style={style}>\n        <input\n          className=\"eds-filter-chip__input\"\n          type=\"checkbox\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          {...rest}\n        />\n        <span className=\"eds-filter-chip__icon\">\n          <CheckboxIcon />\n        </span>\n        {children}\n      </label>\n    );\n  },\n);\n\nconst CheckboxIcon: React.FC = () => {\n  return (\n    <svg\n      className=\"eds-filter-chip-icon\"\n      width=\"11px\"\n      height=\"9px\"\n      viewBox=\"6 11 37 33\"\n    >\n      <path\n        className=\"eds-filter-chip-icon__path\"\n        d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n        fill=\"none\"\n      />\n    </svg>\n  );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n  /** Navnet til ChoiceChipsGroup */\n  name: string;\n  /** Verdien til den valgte ChoiceChipen */\n  value: string | null;\n  /** ChoiceChip-komponentene sendes inn som children */\n  children: React.ReactNode;\n  /** En callback som blir kalles hver gang en ChoiceChip klikkes på  */\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Labelen til ChoiceChip-gruppen. */\n  label?: React.ReactNode;\n  [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n  name,\n  value,\n  children,\n  onChange,\n  label,\n  ...rest\n}) => {\n  const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n    name,\n    value,\n    onChange,\n  ]);\n  return (\n    <ChoiceChipGroupContextProvider value={contextValue}>\n      <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n        {children}\n      </Fieldset>\n    </ChoiceChipGroupContextProvider>\n  );\n};\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","classList","cx","length","context","useContext","Error","useChoiceChipGroupContext","type","name","checked","onChange","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","warnAboutMissingStyles","label","contextValue","useMemo","Fieldset"],"mappings":"gZAQA,IAAMA,EACJC,EAAMC,cAAkD,MAE7CC,EAAiCH,EAAuBI,SCcxDC,EAAaJ,EAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBC,IAAAA,MAAUC,2DAGpDC,EAAgBb,EAAMc,SAASC,QAAQP,GAOvCQ,EAAYC,EAAGV,EAAW,WAAY,sBACpBG,2BANtBG,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,ODrBhD,eACQC,EAAUnB,EAAMoB,WAAWrB,OAC5BoB,QACG,IAAIE,MACR,2EAGGF,ECyBHG,UAEFtB,yBAAOO,UAAU,kBAAkBI,MAAOA,GACxCX,uCACEO,UAAU,yBACVgB,KAAK,QACLC,OATJA,KAUIlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,EACVe,UAZJhB,QAY+BA,EAC3BiB,WAZJA,UAaQd,IAENZ,uBAAKO,UAAWS,GAAYR,OC7CvBmB,EAAa3B,EAAMK,YAC9B,WAAmCC,OAAhCE,IAAAA,SAAUD,IAAAA,UAAcK,gCACnBC,EAAgBb,EAAMc,SAASC,QAAQP,UAQ3CR,wCACEO,UAAWqB,EACT,WACA,kBACA,0BAVJf,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,IAWxCX,GAEFD,IAAKA,EACLiB,KAAK,UACDX,GAEHJ,MCxBIqB,EAAU7B,EAAMK,YAC3B,WAEEC,OADEE,IAAAA,SAAUD,IAAAA,UAAWuB,IAAAA,QAAYlB,iDAIjCZ,qCACEO,UAAWqB,EAAW,WAAY,eAAgBrB,IAC9CK,GAEHJ,EACDR,0BACEO,UAAU,6BACVgB,KAAK,SACLQ,QAASD,EACTxB,IAAKA,GAELN,gBAACgC,uBClBEC,EAAajC,EAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBc,IAAAA,KAAMb,IAAAA,MAAUC,kEAG1DI,EAAYC,EAAGV,EAAW,WAAY,0BAG1CP,yBAAOO,UAAWS,EAAWL,MAAOA,GAClCX,uCACEO,UAAU,yBACVgB,KAAK,WACLC,KAAMA,EACNlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,GACNE,IAENZ,wBAAMO,UAAU,yBACdP,gBAACkC,SAEF1B,MAMH0B,EAAyB,kBAE3BlC,uBACEO,UAAU,uBACV4B,MAAM,OACNC,OAAO,MACPC,QAAQ,cAERrC,wBACEO,UAAU,6BACV+B,EAAE,+BACFC,KAAK,WCjDbC,yBAAuB,OAAQ,0ECcgC,gBAC7DhB,IAAAA,KACAf,IAAAA,MACAD,IAAAA,SACAkB,IAAAA,SACAe,IAAAA,MACG7B,sDAEG8B,EAAe1C,EAAM2C,SAAQ,iBAAO,CAAEnB,KAAAA,EAAMf,MAAAA,EAAOiB,SAAAA,KAAa,CACpEF,EACAf,EACAiB,WAGA1B,gBAACE,GAA+BO,MAAOiC,GACrC1C,gBAAC4C,0BAASrC,UAAU,yBAAyBkC,MAAOA,GAAW7B,GAC5DJ"}
+{"version":3,"file":"chip.cjs.production.min.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/index.tsx","../src/ChoiceChipGroup.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n  name: string;\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n  React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n  () => {\n    const context = React.useContext(ChoiceChipGroupContext);\n    if (!context) {\n      throw new Error(\n        'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n      );\n    }\n    return context;\n  };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om Choicechip er deaktivert eller ikke\n   * @default false\n   */\n  disabled?: boolean;\n  /** Label til ChoiceChip */\n  children?: React.ReactNode;\n  /** Verdien til ChoiceChip */\n  value: string;\n} & Omit<\n  React.DetailedHTMLProps<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HTMLInputElement\n  >,\n  'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n  (\n    { className, children, value, disabled = false, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    const classList = cx(className, 'eds-chip', {\n      'eds-chip--disabled': disabled,\n      'eds-chip--leading-icon': hasLeadingIcon,\n      'eds-chip--trailing-icon': hasTrailingIcon,\n    });\n    const {\n      name,\n      value: selectedValue,\n      onChange,\n    } = useChoiceChipGroupContext();\n    return (\n      <label className=\"eds-choice-chip\" style={style}>\n        <input\n          className=\"eds-choice-chip__input\"\n          type=\"radio\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          checked={selectedValue === value}\n          onChange={onChange}\n          {...rest}\n        />\n        <div className={classList}>{children}</div>\n      </label>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { LoadingDots } from '@entur/loader';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n  /** Teksten som vises i ActionChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om chip-en er opptatt, f.eks med å oppdatere informasjon\n   * @default false\n   */\n  loading?: boolean;\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n  (\n    { children, className, loading = false, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    return (\n      <button\n        className={classNames(\n          'eds-chip',\n          'eds-action-chip',\n          {\n            'eds-chip--leading-icon': hasLeadingIcon,\n            'eds-chip--trailing-icon': hasTrailingIcon,\n          },\n          className,\n        )}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      >\n        {loading ? (\n          <LoadingDots className=\"eds-action-chip__loading-dots\" />\n        ) : (\n          children\n        )}\n      </button>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n  /** Teksten som vises i TagChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Callback for når man klikker på krysset */\n  onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n  (\n    { children, className, onClose, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    return (\n      <div\n        className={classNames('eds-chip', 'eds-tag-chip', className)}\n        {...rest}\n      >\n        {children}\n        <button\n          className=\"eds-tag-chip__close-button\"\n          type=\"button\"\n          onClick={onClose}\n          ref={ref}\n        >\n          <CloseIcon />\n        </button>\n      </div>\n    );\n  },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label til FilterChip */\n  children?: React.ReactNode;\n  /** Verdien til FilterChip */\n  value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n  (\n    { className, children, value, disabled = false, name, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n    return (\n      <label className={classList} style={style}>\n        <input\n          className=\"eds-filter-chip__input\"\n          type=\"checkbox\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          {...rest}\n        />\n        <span className=\"eds-filter-chip__icon\">\n          <CheckboxIcon />\n        </span>\n        {children}\n      </label>\n    );\n  },\n);\n\nconst CheckboxIcon: React.FC = () => {\n  return (\n    <svg\n      className=\"eds-filter-chip-icon\"\n      width=\"11px\"\n      height=\"9px\"\n      viewBox=\"6 11 37 33\"\n    >\n      <path\n        className=\"eds-filter-chip-icon__path\"\n        d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n        fill=\"none\"\n      />\n    </svg>\n  );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n  /** Navnet til ChoiceChipsGroup */\n  name: string;\n  /** Verdien til den valgte ChoiceChipen */\n  value: string | null;\n  /** ChoiceChip-komponentene sendes inn som children */\n  children: React.ReactNode;\n  /** En callback som blir kalles hver gang en ChoiceChip klikkes på  */\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Labelen til ChoiceChip-gruppen. */\n  label?: React.ReactNode;\n  [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n  name,\n  value,\n  children,\n  onChange,\n  label,\n  ...rest\n}) => {\n  const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n    name,\n    value,\n    onChange,\n  ]);\n  return (\n    <ChoiceChipGroupContextProvider value={contextValue}>\n      <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n        {children}\n      </Fieldset>\n    </ChoiceChipGroupContextProvider>\n  );\n};\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","classList","cx","length","context","useContext","Error","useChoiceChipGroupContext","type","name","checked","onChange","ActionChip","loading","classNames","LoadingDots","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","warnAboutMissingStyles","label","contextValue","useMemo","Fieldset"],"mappings":"yoBAQA,IAAMA,EACJC,UAAMC,cAAkD,MAE7CC,EAAiCH,EAAuBI,+DCcxDC,EAAaJ,UAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBC,IAAAA,MAAUC,SAGpDC,EAAgBb,UAAMc,SAASC,QAAQP,GAOvCQ,EAAYC,UAAGV,EAAW,WAAY,sBACpBG,2BANtBG,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,ODrBhD,eACQC,EAAUnB,UAAMoB,WAAWrB,OAC5BoB,QACG,IAAIE,MACR,2EAGGF,ECyBHG,UAEFtB,iCAAOO,UAAU,kBAAkBI,MAAOA,GACxCX,mCACEO,UAAU,yBACVgB,KAAK,QACLC,OATJA,KAUIlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,EACVe,UAZJhB,QAY+BA,EAC3BiB,WAZJA,UAaQd,IAENZ,+BAAKO,UAAWS,GAAYR,4CCxCvBmB,EAAa3B,UAAMK,YAC9B,WAEEC,OADEE,IAAAA,SAAUD,IAAAA,cAAWqB,QAAAA,gBAAoBhB,SAGrCC,EAAgBb,UAAMc,SAASC,QAAQP,UAQ3CR,oCACEO,UAAWsB,UACT,WACA,kBACA,0BAVJhB,EAAcK,OAAS,GAAiC,iBAArBL,EAAc,6BAEjDA,EAAcK,OAAS,GAC4B,iBAA5CL,EAAcA,EAAcK,OAAS,IAWxCX,GAEFD,IAAKA,EACLiB,KAAK,UACDX,GAEHgB,EACC5B,wBAAC8B,eAAYvB,UAAU,kCAEvBC,2CCnCGuB,EAAU/B,UAAMK,YAC3B,WAEEC,OADEE,IAAAA,SAAUD,IAAAA,UAAWyB,IAAAA,QAAYpB,gBAIjCZ,iCACEO,UAAWsB,UAAW,WAAY,eAAgBtB,IAC9CK,GAEHJ,EACDR,kCACEO,UAAU,6BACVgB,KAAK,SACLU,QAASD,EACT1B,IAAKA,GAELN,wBAACkC,oFClBEC,EAAanC,UAAMK,YAC9B,WAEEC,OADEC,IAAAA,UAAWC,IAAAA,SAAUC,IAAAA,UAAOC,SAAAA,gBAAkBc,IAAAA,KAAMb,IAAAA,MAAUC,SAG1DI,EAAYC,UAAGV,EAAW,WAAY,0BAG1CP,iCAAOO,UAAWS,EAAWL,MAAOA,GAClCX,mCACEO,UAAU,yBACVgB,KAAK,WACLC,KAAMA,EACNlB,IAAKA,EACLG,MAAOA,EACPC,SAAUA,GACNE,IAENZ,gCAAMO,UAAU,yBACdP,wBAACoC,SAEF5B,MAMH4B,EAAyB,kBAE3BpC,+BACEO,UAAU,uBACV8B,MAAM,OACNC,OAAO,MACPC,QAAQ,cAERvC,gCACEO,UAAU,6BACViC,EAAE,+BACFC,KAAK,4DCjDbC,yBAAuB,OAAQ,0ECcgC,gBAC7DlB,IAAAA,KACAf,IAAAA,MACAD,IAAAA,SACAkB,IAAAA,SACAiB,IAAAA,MACG/B,SAEGgC,EAAe5C,UAAM6C,SAAQ,iBAAO,CAAErB,KAAAA,EAAMf,MAAAA,EAAOiB,SAAAA,KAAa,CACpEF,EACAf,EACAiB,WAGA1B,wBAACE,GAA+BO,MAAOmC,GACrC5C,wBAAC8C,cAASvC,UAAU,yBAAyBoC,MAAOA,GAAW/B,GAC5DJ"}

package/dist/chip.esm.js

@@ -1,9 +1,28 @@
 import { warnAboutMissingStyles } from '@entur/utils';
 import React from 'react';
 import classNames from 'classnames';
+import { LoadingDots } from '@entur/loader';
 import { CloseIcon } from '@entur/icons';
 import { Fieldset } from '@entur/form';
 
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -31,6 +50,7 @@ var useChoiceChipGroupContext = function useChoiceChipGroupContext() {
   return context;
 };
 
+var _excluded$4 = ["className", "children", "value", "disabled", "style"];
 var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
       children = _ref.children,
@@ -38,7 +58,7 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       style = _ref.style,
-      rest = _objectWithoutPropertiesLoose(_ref, ["className", "children", "value", "disabled", "style"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
 
   var childrenArray = React.Children.toArray(children);
   var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
@@ -57,7 +77,7 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   return React.createElement("label", {
     className: "eds-choice-chip",
     style: style
-  }, React.createElement("input", Object.assign({
+  }, React.createElement("input", _extends({
     className: "eds-choice-chip__input",
     type: "radio",
     name: name,
@@ -71,31 +91,37 @@ var ChoiceChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, children));
 });
 
+var _excluded$3 = ["children", "className", "loading"];
 var ActionChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var children = _ref.children,
       className = _ref.className,
-      rest = _objectWithoutPropertiesLoose(_ref, ["children", "className"]);
+      _ref$loading = _ref.loading,
+      loading = _ref$loading === void 0 ? false : _ref$loading,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
 
   var childrenArray = React.Children.toArray(children);
   var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
   var hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== 'string';
-  return React.createElement("button", Object.assign({
+  return React.createElement("button", _extends({
     className: classNames('eds-chip', 'eds-action-chip', {
       'eds-chip--leading-icon': hasLeadingIcon,
       'eds-chip--trailing-icon': hasTrailingIcon
     }, className),
     ref: ref,
     type: "button"
-  }, rest), children);
+  }, rest), loading ? React.createElement(LoadingDots, {
+    className: "eds-action-chip__loading-dots"
+  }) : children);
 });
 
+var _excluded$2 = ["children", "className", "onClose"];
 var TagChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var children = _ref.children,
       className = _ref.className,
       onClose = _ref.onClose,
-      rest = _objectWithoutPropertiesLoose(_ref, ["children", "className", "onClose"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
 
-  return React.createElement("div", Object.assign({
+  return React.createElement("div", _extends({
     className: classNames('eds-chip', 'eds-tag-chip', className)
   }, rest), children, React.createElement("button", {
     className: "eds-tag-chip__close-button",
@@ -105,6 +131,7 @@ var TagChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }, React.createElement(CloseIcon, null)));
 });
 
+var _excluded$1 = ["className", "children", "value", "disabled", "name", "style"];
 var FilterChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className = _ref.className,
       children = _ref.children,
@@ -113,13 +140,13 @@ var FilterChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       name = _ref.name,
       style = _ref.style,
-      rest = _objectWithoutPropertiesLoose(_ref, ["className", "children", "value", "disabled", "name", "style"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
 
   var classList = classNames(className, 'eds-chip', 'eds-filter-chip');
   return React.createElement("label", {
     className: classList,
     style: style
-  }, React.createElement("input", Object.assign({
+  }, React.createElement("input", _extends({
     className: "eds-filter-chip__input",
     type: "checkbox",
     name: name,
@@ -144,13 +171,14 @@ var CheckboxIcon = function CheckboxIcon() {
   }));
 };
 
+var _excluded = ["name", "value", "children", "onChange", "label"];
 var ChoiceChipGroup = function ChoiceChipGroup(_ref) {
   var name = _ref.name,
       value = _ref.value,
       children = _ref.children,
       onChange = _ref.onChange,
       label = _ref.label,
-      rest = _objectWithoutPropertiesLoose(_ref, ["name", "value", "children", "onChange", "label"]);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var contextValue = React.useMemo(function () {
     return {
@@ -161,7 +189,7 @@ var ChoiceChipGroup = function ChoiceChipGroup(_ref) {
   }, [name, value, onChange]);
   return React.createElement(ChoiceChipGroupContextProvider, {
     value: contextValue
-  }, React.createElement(Fieldset, Object.assign({
+  }, React.createElement(Fieldset, _extends({
     className: "eds-choice-chips-group",
     label: label
   }, rest), children));

package/dist/chip.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.esm.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n  name: string;\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n  React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n  () => {\n    const context = React.useContext(ChoiceChipGroupContext);\n    if (!context) {\n      throw new Error(\n        'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n      );\n    }\n    return context;\n  };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om Choicechip er deaktivert eller ikke\n   * @default false\n   */\n  disabled?: boolean;\n  /** Label til ChoiceChip */\n  children?: React.ReactNode;\n  /** Verdien til ChoiceChip */\n  value: string;\n} & Omit<\n  React.DetailedHTMLProps<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HTMLInputElement\n  >,\n  'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n  (\n    { className, children, value, disabled = false, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    const classList = cx(className, 'eds-chip', {\n      'eds-chip--disabled': disabled,\n      'eds-chip--leading-icon': hasLeadingIcon,\n      'eds-chip--trailing-icon': hasTrailingIcon,\n    });\n    const {\n      name,\n      value: selectedValue,\n      onChange,\n    } = useChoiceChipGroupContext();\n    return (\n      <label className=\"eds-choice-chip\" style={style}>\n        <input\n          className=\"eds-choice-chip__input\"\n          type=\"radio\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          checked={selectedValue === value}\n          onChange={onChange}\n          {...rest}\n        />\n        <div className={classList}>{children}</div>\n      </label>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n  /** Teksten som vises i ActionChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n  ({ children, className, ...rest }, ref: React.Ref<HTMLButtonElement>) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    return (\n      <button\n        className={classNames(\n          'eds-chip',\n          'eds-action-chip',\n          {\n            'eds-chip--leading-icon': hasLeadingIcon,\n            'eds-chip--trailing-icon': hasTrailingIcon,\n          },\n          className,\n        )}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      >\n        {children}\n      </button>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n  /** Teksten som vises i TagChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Callback for når man klikker på krysset */\n  onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n  (\n    { children, className, onClose, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    return (\n      <div\n        className={classNames('eds-chip', 'eds-tag-chip', className)}\n        {...rest}\n      >\n        {children}\n        <button\n          className=\"eds-tag-chip__close-button\"\n          type=\"button\"\n          onClick={onClose}\n          ref={ref}\n        >\n          <CloseIcon />\n        </button>\n      </div>\n    );\n  },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label til FilterChip */\n  children?: React.ReactNode;\n  /** Verdien til FilterChip */\n  value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n  (\n    { className, children, value, disabled = false, name, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n    return (\n      <label className={classList} style={style}>\n        <input\n          className=\"eds-filter-chip__input\"\n          type=\"checkbox\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          {...rest}\n        />\n        <span className=\"eds-filter-chip__icon\">\n          <CheckboxIcon />\n        </span>\n        {children}\n      </label>\n    );\n  },\n);\n\nconst CheckboxIcon: React.FC = () => {\n  return (\n    <svg\n      className=\"eds-filter-chip-icon\"\n      width=\"11px\"\n      height=\"9px\"\n      viewBox=\"6 11 37 33\"\n    >\n      <path\n        className=\"eds-filter-chip-icon__path\"\n        d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n        fill=\"none\"\n      />\n    </svg>\n  );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n  /** Navnet til ChoiceChipsGroup */\n  name: string;\n  /** Verdien til den valgte ChoiceChipen */\n  value: string | null;\n  /** ChoiceChip-komponentene sendes inn som children */\n  children: React.ReactNode;\n  /** En callback som blir kalles hver gang en ChoiceChip klikkes på  */\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Labelen til ChoiceChip-gruppen. */\n  label?: React.ReactNode;\n  [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n  name,\n  value,\n  children,\n  onChange,\n  label,\n  ...rest\n}) => {\n  const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n    name,\n    value,\n    onChange,\n  ]);\n  return (\n    <ChoiceChipGroupContextProvider value={contextValue}>\n      <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n        {children}\n      </Fieldset>\n    </ChoiceChipGroupContextProvider>\n  );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","classNames","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":"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"}
+{"version":3,"file":"chip.esm.js","sources":["../src/ChoiceChipGroupContext.tsx","../src/ChoiceChip.tsx","../src/ActionChip.tsx","../src/TagChip.tsx","../src/FilterChip.tsx","../src/ChoiceChipGroup.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype ChoiceChipGroupContextProps = {\n  name: string;\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  value: string | null;\n};\n\nconst ChoiceChipGroupContext =\n  React.createContext<ChoiceChipGroupContextProps | null>(null);\n\nexport const ChoiceChipGroupContextProvider = ChoiceChipGroupContext.Provider;\n\nexport const useChoiceChipGroupContext: () => ChoiceChipGroupContextProps =\n  () => {\n    const context = React.useContext(ChoiceChipGroupContext);\n    if (!context) {\n      throw new Error(\n        'You need to wrap your ChoiceChips in a ChoiceChipGroup-component',\n      );\n    }\n    return context;\n  };\n","import React from 'react';\nimport cx from 'classnames';\nimport { useChoiceChipGroupContext } from './ChoiceChipGroupContext';\nimport './BaseChip.scss';\nimport './ChoiceChip.scss';\n\nexport type ChoiceChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om Choicechip er deaktivert eller ikke\n   * @default false\n   */\n  disabled?: boolean;\n  /** Label til ChoiceChip */\n  children?: React.ReactNode;\n  /** Verdien til ChoiceChip */\n  value: string;\n} & Omit<\n  React.DetailedHTMLProps<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    HTMLInputElement\n  >,\n  'value'\n>;\n\nexport const ChoiceChip = React.forwardRef<HTMLInputElement, ChoiceChipProps>(\n  (\n    { className, children, value, disabled = false, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    const classList = cx(className, 'eds-chip', {\n      'eds-chip--disabled': disabled,\n      'eds-chip--leading-icon': hasLeadingIcon,\n      'eds-chip--trailing-icon': hasTrailingIcon,\n    });\n    const {\n      name,\n      value: selectedValue,\n      onChange,\n    } = useChoiceChipGroupContext();\n    return (\n      <label className=\"eds-choice-chip\" style={style}>\n        <input\n          className=\"eds-choice-chip__input\"\n          type=\"radio\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          checked={selectedValue === value}\n          onChange={onChange}\n          {...rest}\n        />\n        <div className={classList}>{children}</div>\n      </label>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { LoadingDots } from '@entur/loader';\nimport './BaseChip.scss';\nimport './ActionChip.scss';\n\nexport type ActionChipProps = {\n  /** Teksten som vises i ActionChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Om chip-en er opptatt, f.eks med å oppdatere informasjon\n   * @default false\n   */\n  loading?: boolean;\n} & React.DetailedHTMLProps<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  HTMLButtonElement\n>;\n\nexport const ActionChip = React.forwardRef<HTMLButtonElement, ActionChipProps>(\n  (\n    { children, className, loading = false, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    const childrenArray = React.Children.toArray(children);\n    const hasLeadingIcon =\n      childrenArray.length > 1 && typeof childrenArray[0] !== 'string';\n    const hasTrailingIcon =\n      childrenArray.length > 1 &&\n      typeof childrenArray[childrenArray.length - 1] !== 'string';\n\n    return (\n      <button\n        className={classNames(\n          'eds-chip',\n          'eds-action-chip',\n          {\n            'eds-chip--leading-icon': hasLeadingIcon,\n            'eds-chip--trailing-icon': hasTrailingIcon,\n          },\n          className,\n        )}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      >\n        {loading ? (\n          <LoadingDots className=\"eds-action-chip__loading-dots\" />\n        ) : (\n          children\n        )}\n      </button>\n    );\n  },\n);\n","import React from 'react';\nimport classNames from 'classnames';\nimport { CloseIcon } from '@entur/icons';\nimport './BaseChip.scss';\nimport './TagChip.scss';\n\nexport type TagChipProps = {\n  /** Teksten som vises i TagChip */\n  children: React.ReactNode;\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Callback for når man klikker på krysset */\n  onClose: () => void;\n};\n\nexport const TagChip = React.forwardRef<HTMLButtonElement, TagChipProps>(\n  (\n    { children, className, onClose, ...rest },\n    ref: React.Ref<HTMLButtonElement>,\n  ) => {\n    return (\n      <div\n        className={classNames('eds-chip', 'eds-tag-chip', className)}\n        {...rest}\n      >\n        {children}\n        <button\n          className=\"eds-tag-chip__close-button\"\n          type=\"button\"\n          onClick={onClose}\n          ref={ref}\n        >\n          <CloseIcon />\n        </button>\n      </div>\n    );\n  },\n);\n","import React from 'react';\nimport cx from 'classnames';\nimport './BaseChip.scss';\nimport './FilterChip.scss';\n\nexport type FilterChipProps = {\n  /** Ekstra klassenavn */\n  className?: string;\n  /** Label til FilterChip */\n  children?: React.ReactNode;\n  /** Verdien til FilterChip */\n  value: string;\n} & React.InputHTMLAttributes<HTMLInputElement>;\n\nexport const FilterChip = React.forwardRef<HTMLInputElement, FilterChipProps>(\n  (\n    { className, children, value, disabled = false, name, style, ...rest },\n    ref: React.Ref<HTMLInputElement>,\n  ) => {\n    const classList = cx(className, 'eds-chip', 'eds-filter-chip');\n\n    return (\n      <label className={classList} style={style}>\n        <input\n          className=\"eds-filter-chip__input\"\n          type=\"checkbox\"\n          name={name}\n          ref={ref}\n          value={value}\n          disabled={disabled}\n          {...rest}\n        />\n        <span className=\"eds-filter-chip__icon\">\n          <CheckboxIcon />\n        </span>\n        {children}\n      </label>\n    );\n  },\n);\n\nconst CheckboxIcon: React.FC = () => {\n  return (\n    <svg\n      className=\"eds-filter-chip-icon\"\n      width=\"11px\"\n      height=\"9px\"\n      viewBox=\"6 11 37 33\"\n    >\n      <path\n        className=\"eds-filter-chip-icon__path\"\n        d=\"M14.1 27.2l7.1 7.2 14.6-14.8\"\n        fill=\"none\"\n      />\n    </svg>\n  );\n};\n","import React from 'react';\nimport { ChoiceChipGroupContextProvider } from './ChoiceChipGroupContext';\nimport { Fieldset } from '@entur/form';\nexport type ChoiceChipGroupProps = {\n  /** Navnet til ChoiceChipsGroup */\n  name: string;\n  /** Verdien til den valgte ChoiceChipen */\n  value: string | null;\n  /** ChoiceChip-komponentene sendes inn som children */\n  children: React.ReactNode;\n  /** En callback som blir kalles hver gang en ChoiceChip klikkes på  */\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Labelen til ChoiceChip-gruppen. */\n  label?: React.ReactNode;\n  [key: string]: any;\n};\n\nexport const ChoiceChipGroup: React.FC<ChoiceChipGroupProps> = ({\n  name,\n  value,\n  children,\n  onChange,\n  label,\n  ...rest\n}) => {\n  const contextValue = React.useMemo(() => ({ name, value, onChange }), [\n    name,\n    value,\n    onChange,\n  ]);\n  return (\n    <ChoiceChipGroupContextProvider value={contextValue}>\n      <Fieldset className=\"eds-choice-chips-group\" label={label} {...rest}>\n        {children}\n      </Fieldset>\n    </ChoiceChipGroupContextProvider>\n  );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('chip', 'form');\n\nexport * from './ChoiceChip';\nexport * from './ActionChip';\nexport * from './TagChip';\nexport * from './FilterChip';\nexport * from './ChoiceChipGroup';\n"],"names":["ChoiceChipGroupContext","React","createContext","ChoiceChipGroupContextProvider","Provider","useChoiceChipGroupContext","context","useContext","Error","ChoiceChip","forwardRef","ref","className","children","value","disabled","style","rest","childrenArray","Children","toArray","hasLeadingIcon","length","hasTrailingIcon","classList","cx","name","selectedValue","onChange","type","checked","ActionChip","loading","classNames","LoadingDots","TagChip","onClose","onClick","CloseIcon","FilterChip","CheckboxIcon","width","height","viewBox","d","fill","ChoiceChipGroup","label","contextValue","useMemo","Fieldset","warnAboutMissingStyles"],"mappings":"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"}

package/dist/styles.css

@@ -31,40 +31,78 @@
   margin-left: 0.5rem;
 }/* DO NOT CHANGE!*/
 /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
-.eds-tag-chip {
-  cursor: default;
-  padding-right: 0.25rem;
+.eds-filter-chip {
+  cursor: pointer;
+  user-select: none;
+  padding-left: 0.25rem;
   width: fit-content;
 }
-.eds-tag-chip__close-button {
-  appearance: none;
-  background: none;
-  border: none;
-  border-radius: 50%;
-  color: #181c56;
-  cursor: pointer;
-  display: flex;
-  font-size: 0.875rem;
-  padding: 0.25rem;
-  margin-left: 0.25rem;
-  transition: box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
+.eds-filter-chip__input {
+  position: absolute;
+  opacity: 0;
+  height: 0;
+  width: 0;
 }
-.eds-contrast .eds-tag-chip__close-button {
-  color: #ffffff;
+.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon {
+  visibility: visible;
 }
-.eds-tag-chip__close-button:hover {
-  background: #babbcf;
+.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
+  stroke: #181c56;
+  animation: stroke ease-in-out 0.2s 0.1s forwards;
 }
-.eds-contrast .eds-tag-chip__close-button:hover {
-  background: #54568c;
+.eds-contrast .eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
+  stroke: #5ac39a;
 }
-.eds-tag-chip__close-button:focus {
-  outline-offset: 0.125rem;
+.eds-filter-chip:focus-within {
   outline: none;
   box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
+  outline-offset: 0.125rem;
 }
-.eds-contrast .eds-tag-chip__close-button:focus {
+.eds-contrast .eds-filter-chip:focus-within {
   box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
+}
+.eds-filter-chip:hover {
+  border-color: #181c56;
+}
+.eds-contrast .eds-filter-chip:hover {
+  background-color: #54568c;
+  border-color: #54568c;
+}
+.eds-filter-chip__icon {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  margin-right: 0.5rem;
+  height: 1.5rem;
+  width: 1.5rem;
+  border: 0.125rem solid transparent;
+  border-radius: 50%;
+  background-color: #ffffff;
+  color: #ffffff;
+}
+.eds-contrast .eds-filter-chip__icon {
+  background-color: #181c56;
+}
+.eds-filter-chip__icon .eds-filter-chip-icon {
+  height: 1rem;
+  width: 1rem;
+  visibility: hidden;
+}
+.eds-contrast .eds-filter-chip__icon .eds-filter-chip-icon {
+  color: #ffffff;
+}
+.eds-filter-chip__icon .eds-filter-chip-icon__path {
+  transform-origin: 50% 50%;
+  stroke-dasharray: 48;
+  stroke-dashoffset: 48;
+  stroke-width: 0.375rem;
+}
+
+@keyframes stroke {
+  100% {
+    stroke-dashoffset: 0;
+  }
 }/* DO NOT CHANGE!*/
 /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
 .eds-choice-chip {
@@ -161,78 +199,43 @@
 .eds-contrast .eds-action-chip:active {
   background-color: #292b6a;
   border-color: #292b6a;
+}
+.eds-contrast .eds-action-chip__loading-dots .eds-loading-dots__dot {
+  background-color: #ffffff;
 }/* DO NOT CHANGE!*/
 /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
-.eds-filter-chip {
-  cursor: pointer;
-  user-select: none;
-  padding-left: 0.25rem;
+.eds-tag-chip {
+  cursor: default;
+  padding-right: 0.25rem;
   width: fit-content;
 }
-.eds-filter-chip__input {
-  position: absolute;
-  opacity: 0;
-  height: 0;
-  width: 0;
+.eds-tag-chip__close-button {
+  appearance: none;
+  background: none;
+  border: none;
+  border-radius: 50%;
+  color: #181c56;
+  cursor: pointer;
+  display: flex;
+  font-size: 0.875rem;
+  padding: 0.25rem;
+  margin-left: 0.25rem;
+  transition: box-shadow 0.1s ease-in-out, background 0.1s ease-in-out;
 }
-.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon {
-  visibility: visible;
+.eds-contrast .eds-tag-chip__close-button {
+  color: #ffffff;
 }
-.eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
-  stroke: #181c56;
-  animation: stroke ease-in-out 0.2s 0.1s forwards;
+.eds-tag-chip__close-button:hover {
+  background: #babbcf;
 }
-.eds-contrast .eds-filter-chip__input:checked + .eds-filter-chip__icon .eds-filter-chip-icon__path {
-  stroke: #5ac39a;
+.eds-contrast .eds-tag-chip__close-button:hover {
+  background: #54568c;
 }
-.eds-filter-chip:focus-within {
+.eds-tag-chip__close-button:focus {
+  outline-offset: 0.125rem;
   outline: none;
   box-shadow: 0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #181c56;
-  outline-offset: 0.125rem;
 }
-.eds-contrast .eds-filter-chip:focus-within {
+.eds-contrast .eds-tag-chip__close-button:focus {
   box-shadow: 0 0 0 0.125rem #181c56, 0 0 0 0.25rem #ffffff;
-}
-.eds-filter-chip:hover {
-  border-color: #181c56;
-}
-.eds-contrast .eds-filter-chip:hover {
-  background-color: #54568c;
-  border-color: #54568c;
-}
-.eds-filter-chip__icon {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  position: relative;
-  margin-right: 0.5rem;
-  height: 1.5rem;
-  width: 1.5rem;
-  border: 0.125rem solid transparent;
-  border-radius: 50%;
-  background-color: #ffffff;
-  color: #ffffff;
-}
-.eds-contrast .eds-filter-chip__icon {
-  background-color: #181c56;
-}
-.eds-filter-chip__icon .eds-filter-chip-icon {
-  height: 1rem;
-  width: 1rem;
-  visibility: hidden;
-}
-.eds-contrast .eds-filter-chip__icon .eds-filter-chip-icon {
-  color: #ffffff;
-}
-.eds-filter-chip__icon .eds-filter-chip-icon__path {
-  transform-origin: 50% 50%;
-  stroke-dasharray: 48;
-  stroke-dashoffset: 48;
-  stroke-width: 0.375rem;
-}
-
-@keyframes stroke {
-  100% {
-    stroke-dashoffset: 0;
-  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@entur/chip",
-  "version": "0.4.22",
+  "version": "0.5.0",
   "license": "EUPL-1.2",
   "main": "dist/index.js",
   "module": "dist/chip.esm.js",
@@ -17,20 +17,20 @@
     "access": "public"
   },
   "scripts": {
-    "start": "tsdx watch --noClean",
-    "build": "tsdx build",
-    "test": "tsdx test --env=jsdom",
-    "lint": "tsdx lint"
+    "start": "dts watch --noClean",
+    "build": "dts build",
+    "test": "dts test --env=jsdom",
+    "lint": "dts lint"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0"
   },
   "dependencies": {
-    "@entur/form": "^5.2.1",
-    "@entur/tokens": "^3.3.0",
-    "@entur/utils": "^0.4.2",
+    "@entur/form": "^5.3.0",
+    "@entur/tokens": "^3.3.1",
+    "@entur/utils": "^0.4.3",
     "classnames": "^2.3.1"
   },
-  "gitHead": "6a15d9e27a27775ee3f86e1d3c09d0e9ce484749"
+  "gitHead": "c672c8396ce0c3d436746e4299680137488d579d"
 }