@dnb/eufemia 10.69.0 → 10.70.0

package/cjs/components/date-picker/hooks/useViews.js

@@ -10,7 +10,7 @@ require("core-js/modules/web.dom-collections.iterator.js");
 var _addMonths = _interopRequireDefault(require("date-fns/addMonths"));
 var _react = require("react");
 const _excluded = ["isRange"],
-  _excluded2 = ["views", "isRange"];
+  _excluded2 = ["isRange"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -25,54 +25,68 @@ function useViews(_ref) {
     } = _ref,
     dates = _objectWithoutProperties(_ref, _excluded);
   const [previousDates, setPreviousDates] = (0, _react.useState)(dates);
-  const [views, setViews] = (0, _react.useState)(getViews(_objectSpread(_objectSpread({
-    views: undefined
-  }, dates), {}, {
+  const [views, setViews] = (0, _react.useState)(getViews(_objectSpread(_objectSpread({}, dates), {}, {
     isRange
   })));
-  const forceViewChange = (0, _react.useRef)(false);
+  const hasClickedCalendarDay = (0, _react.useRef)(false);
   const hasDateChanges = (0, _react.useMemo)(() => Object.keys(dates).some(date => previousDates[date] !== dates[date]), [dates, previousDates]);
+  const setHasClickedCalendarDay = (0, _react.useCallback)(hasClicked => hasClickedCalendarDay.current = hasClicked, []);
   if (hasDateChanges) {
-    const currentViews = Array.isArray(views) ? views.length > 1 ? views : views[0] : views;
-    if (forceViewChange.current || !isRange) {
-      setViews(getViews(_objectSpread(_objectSpread({}, dates), {}, {
-        views: currentViews,
+    setPreviousDates(dates);
+    if (hasClickedCalendarDay.current) {
+      setHasClickedCalendarDay(false);
+    } else {
+      const updatedViews = getViews(_objectSpread(_objectSpread({}, dates), {}, {
         isRange
-      })));
-      forceViewChange.current = false;
+      }));
+      setViews(updatedViews);
     }
-    setPreviousDates(dates);
   }
   function updateViews(views) {
     let cb = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
     setViews(views);
     cb === null || cb === void 0 ? void 0 : cb();
   }
-  function forceViewMonthChange() {
-    forceViewChange.current = true;
-  }
   return {
     views,
     setViews: updateViews,
-    forceViewMonthChange
+    setHasClickedCalendarDay
   };
 }
 function getViews(_ref2) {
   let {
-      views,
       isRange
     } = _ref2,
     dates = _objectWithoutProperties(_ref2, _excluded2);
-  return (Array.isArray(views) ? views : Array(isRange ? 2 : views).fill(1)).map((view, nr) => ({
-    month: getMonthView(_objectSpread({}, dates), nr),
-    nr
-  }));
+  return isRange ? [{
+    nr: 0,
+    month: getMonthView({
+      months: dates,
+      nr: 0
+    })
+  }, {
+    nr: 1,
+    month: getMonthView({
+      months: dates,
+      nr: 1
+    })
+  }] : [{
+    nr: 0,
+    month: getMonthView({
+      months: dates,
+      nr: 0
+    })
+  }];
 }
-function getMonthView(_ref3, nr) {
+function getMonthView(_ref3) {
   let {
+    months,
+    nr
+  } = _ref3;
+  const {
     startMonth,
     endMonth
-  } = _ref3;
+  } = months;
   if (startMonth && nr === 0) {
     return startMonth;
   }

package/cjs/components/date-picker/hooks/useViews.js.map

@@ -1 +1 @@
-{"version":3,"file":"useViews.js","names":["_addMonths","_interopRequireDefault","require","_react","_excluded","_excluded2","e","__esModule","default","ownKeys","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","_toPropertyKey","value","configurable","writable","i","_toPrimitive","Symbol","toPrimitive","call","TypeError","String","Number","_objectWithoutProperties","_objectWithoutPropertiesLoose","n","indexOf","propertyIsEnumerable","hasOwnProperty","useViews","_ref","isRange","dates","previousDates","setPreviousDates","useState","views","setViews","getViews","undefined","forceViewChange","useRef","hasDateChanges","useMemo","some","date","currentViews","Array","isArray","current","updateViews","cb","forceViewMonthChange","_ref2","fill","map","view","nr","month","getMonthView","_ref3","startMonth","endMonth","fallbackMonth","Date","addMonths"],"sources":["../../../../../src/components/date-picker/hooks/useViews.ts"],"sourcesContent":["import addMonths from 'date-fns/addMonths'\nimport { useMemo, useRef, useState } from 'react'\nimport { DatePickerDates } from './useDates'\n\nexport type CalendarView = { nr: number; month?: Date }\n\nexport type ViewDates = {\n  startMonth?: DatePickerDates['startMonth']\n  endMonth?: DatePickerDates['endMonth']\n}\n\nexport type UseViewsParams = ViewDates & {\n  isRange?: boolean\n}\n\nexport default function useViews({ isRange, ...dates }: UseViewsParams) {\n  const [previousDates, setPreviousDates] = useState(dates)\n  const [views, setViews] = useState<Array<CalendarView>>(\n    getViews({ views: undefined, ...dates, isRange })\n  )\n\n  const forceViewChange = useRef(false)\n\n  const hasDateChanges = useMemo(\n    () =>\n      Object.keys(dates).some(\n        (date) => previousDates[date] !== dates[date]\n      ),\n    [dates, previousDates]\n  )\n\n  if (hasDateChanges) {\n    const currentViews = Array.isArray(views)\n      ? views.length > 1\n        ? views\n        : views[0]\n      : views\n\n    // Maintain range views unless forced to change by shortcut or keyboard navigation\n    if (forceViewChange.current || !isRange) {\n      setViews(getViews({ ...dates, views: currentViews, isRange }))\n      forceViewChange.current = false\n    }\n\n    setPreviousDates(dates)\n  }\n\n  function updateViews(\n    views: Array<CalendarView>,\n    cb: (...args: unknown[]) => void = null\n  ) {\n    setViews(views)\n    cb?.()\n  }\n\n  function forceViewMonthChange() {\n    forceViewChange.current = true\n  }\n\n  return {\n    views,\n    setViews: updateViews,\n    forceViewMonthChange,\n  } as const\n}\n\nexport function getViews({\n  views,\n  isRange,\n  ...dates\n}: ViewDates &\n  UseViewsParams & {\n    views?: CalendarView | Array<CalendarView>\n  }): Array<CalendarView> {\n  // fill the views with the calendar data getMonth()\n  return (\n    Array.isArray(views)\n      ? views\n      : Array(\n          isRange\n            ? 2 // set default range calendars\n            : views\n        ).fill(1)\n  ).map((view, nr) => ({\n    month: getMonthView({ ...dates }, nr),\n    nr,\n  }))\n}\n\nfunction getMonthView(\n  { startMonth, endMonth }: ViewDates,\n  nr: CalendarView['nr']\n) {\n  if (startMonth && nr === 0) {\n    return startMonth\n  }\n\n  if (endMonth && nr === 1) {\n    return endMonth\n  }\n\n  // Here we add that default offset to every new calendar added,\n  // the first will get 0, the next one 1, and so forth\n  const fallbackMonth = startMonth || new Date()\n  return addMonths(fallbackMonth, nr)\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"useViews.js","names":["_addMonths","_interopRequireDefault","require","_react","_excluded","_excluded2","e","__esModule","default","ownKeys","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","_toPropertyKey","value","configurable","writable","i","_toPrimitive","Symbol","toPrimitive","call","TypeError","String","Number","_objectWithoutProperties","_objectWithoutPropertiesLoose","n","indexOf","propertyIsEnumerable","hasOwnProperty","useViews","_ref","isRange","dates","previousDates","setPreviousDates","useState","views","setViews","getViews","hasClickedCalendarDay","useRef","hasDateChanges","useMemo","some","date","setHasClickedCalendarDay","useCallback","hasClicked","current","updatedViews","updateViews","cb","undefined","_ref2","nr","month","getMonthView","months","_ref3","startMonth","endMonth","fallbackMonth","Date","addMonths"],"sources":["../../../../../src/components/date-picker/hooks/useViews.ts"],"sourcesContent":["import addMonths from 'date-fns/addMonths'\nimport { useCallback, useMemo, useRef, useState } from 'react'\nimport { DatePickerDates } from './useDates'\n\nexport type CalendarView = { nr: number; month?: Date }\n\nexport type ViewDates = {\n  startMonth?: DatePickerDates['startMonth']\n  endMonth?: DatePickerDates['endMonth']\n}\n\nexport type UseViewsParams = ViewDates & {\n  isRange?: boolean\n}\n\nexport default function useViews({ isRange, ...dates }: UseViewsParams) {\n  const [previousDates, setPreviousDates] = useState(dates)\n  const [views, setViews] = useState<Array<CalendarView>>(\n    getViews({ ...dates, isRange })\n  )\n\n  const hasClickedCalendarDay = useRef<boolean>(false)\n\n  const hasDateChanges = useMemo(\n    () =>\n      Object.keys(dates).some(\n        (date) => previousDates[date] !== dates[date]\n      ),\n    [dates, previousDates]\n  )\n\n  const setHasClickedCalendarDay = useCallback(\n    (hasClicked: boolean) => (hasClickedCalendarDay.current = hasClicked),\n    []\n  )\n\n  if (hasDateChanges) {\n    setPreviousDates(dates)\n\n    // Stop here if the user has clicked a day in the calendar, as we don't want update the views then\n    if (hasClickedCalendarDay.current) {\n      setHasClickedCalendarDay(false)\n    } else {\n      const updatedViews = getViews({\n        ...dates,\n        isRange,\n      })\n\n      setViews(updatedViews)\n    }\n  }\n\n  function updateViews(\n    views: Array<CalendarView>,\n    cb: (...args: unknown[]) => void = null\n  ) {\n    setViews(views)\n    cb?.()\n  }\n\n  return {\n    views,\n    setViews: updateViews,\n    setHasClickedCalendarDay,\n  } as const\n}\n\nexport function getViews({\n  isRange,\n  ...dates\n}: ViewDates & UseViewsParams): Array<CalendarView> {\n  return isRange\n    ? [\n        { nr: 0, month: getMonthView({ months: dates, nr: 0 }) },\n        { nr: 1, month: getMonthView({ months: dates, nr: 1 }) },\n      ]\n    : [{ nr: 0, month: getMonthView({ months: dates, nr: 0 }) }]\n}\n\nfunction getMonthView({ months, nr }: { months: ViewDates; nr: number }) {\n  const { startMonth, endMonth } = months\n\n  if (startMonth && nr === 0) {\n    return startMonth\n  }\n\n  if (endMonth && nr === 1) {\n    return endMonth\n  }\n\n  // Here we add that default offset to every new calendar added,\n  // the first will get 0, the next one 1, and so forth\n  const fallbackMonth = startMonth || new Date()\n  return addMonths(fallbackMonth, nr)\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/dialog/DialogDocs.d.ts

@@ -1,2 +1,3 @@
 import { PropertiesTableProps } from '../../shared/types';
 export declare const DialogProperties: PropertiesTableProps;
+export declare const DialogEvents: PropertiesTableProps;

package/cjs/components/dialog/DialogDocs.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DialogProperties = void 0;
+exports.DialogProperties = exports.DialogEvents = void 0;
 const DialogProperties = exports.DialogProperties = {
   variant: {
     doc: 'The dialog variant. Can either be `information` or `confirmation`. Defaults to `information`.',
@@ -116,4 +116,16 @@ const DialogProperties = exports.DialogProperties = {
     status: 'optional'
   }
 };
+const DialogEvents = exports.DialogEvents = {
+  onConfirm: {
+    doc: 'For variant confirmation, handle the confirm action click. Provided with the mouse event and the Modal function `close` as arguments.',
+    type: 'function',
+    status: 'optional'
+  },
+  onDecline: {
+    doc: 'For variant confirmation, handle the decline action click. Provided with the mouse event and the Modal function `close` as arguments.',
+    type: 'function',
+    status: 'optional'
+  }
+};
 //# sourceMappingURL=DialogDocs.js.map

package/cjs/components/dialog/DialogDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogDocs.js","names":["DialogProperties","exports","variant","doc","type","status","title","minWidth","maxWidth","className","spacing","preventCoreStyle","navContent","headerContent","modalContent","description","verticalAlignment","alignContent","fullscreen","icon","confirmType","declineText","confirmText","hideDecline","hideConfirm","scrollRef","contentRef"],"sources":["../../../../src/components/dialog/DialogDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const DialogProperties: PropertiesTableProps = {\n  variant: {\n    doc: 'The dialog variant. Can either be `information` or `confirmation`. Defaults to `information`.',\n    type: 'string',\n    status: 'optional',\n  },\n  title: {\n    doc: 'The dialog title. Displays on the very top of the content.',\n    type: 'string',\n    status: 'optional',\n  },\n  minWidth: {\n    doc: \"The minimum Dialog content width, defined by a CSS width value like `50vw` (50% of the viewport). Be careful on using fixed `minWidth` so you don't break responsiveness. Defaults to `30rem` (average width is set to `60vw`).\",\n    type: 'string',\n    status: 'optional',\n  },\n  maxWidth: {\n    doc: 'The maximum Dialog content width, defined by a CSS width value like `20rem`. Defaults to `60rem` (average width is set to `60vw`).',\n    type: 'string',\n    status: 'optional',\n  },\n  className: {\n    doc: 'Give the Dialog content a class name (maps to `dnb-dialog`).',\n    type: 'string',\n    status: 'optional',\n  },\n  spacing: {\n    doc: 'If set to `false` then the dialog content will be shown without any spacing. Defaults to `true`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  preventCoreStyle: {\n    doc: 'By default the dialog content gets added the core style class `dnb-core-style`. Use `false` to disable this behavior.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  navContent: {\n    doc: 'The content which will appear in the navigation, above the header, and side-by-side the close button.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  headerContent: {\n    doc: 'The content which will appear in the header of the dialog.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  modalContent: {\n    doc: 'The content which will appear when triggering the dialog.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  description: {\n    doc: 'A description will be positioned below the title, but before the content. Used for Dialog variant `confirmation` to further describe what the actions will do.',\n    type: 'string',\n    status: 'optional',\n  },\n  verticalAlignment: {\n    doc: 'Define the vertical alignment of the container. Can be set to `top` or `center`. Defaults to `center`.',\n    type: 'string',\n    status: 'optional',\n  },\n  alignContent: {\n    doc: 'Define the inner horizontal alignment of the content. Can be set to `left`, `center`, `right` and `centered`. If `centered`, then the content will also be centered vertically. Defaults to `left`.',\n    type: 'string',\n    status: 'optional',\n  },\n  fullscreen: {\n    doc: 'If set to `true` then the dialog content will be shown as fullscreen, without showing the original content behind. Can be set to `false` to omit the auto fullscreen. Defaults to `auto`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  icon: {\n    doc: 'An icon to display at the top of the component. Should be of size medium, so make sure you import the `_medium` version of the Eufemia icon.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  confirmType: {\n    doc: 'For variant confirmation, the dialog is either an informational (`info`) or a warning (`warning`) message. Defaults to `info`.',\n    type: 'string',\n    status: 'optional',\n  },\n  declineText: {\n    doc: 'For dialog actions, give a custom text for the decline button.',\n    type: 'string',\n    status: 'optional',\n  },\n  confirmText: {\n    doc: 'For dialog actions, give a custom text for the confirmation button.',\n    type: 'string',\n    status: 'optional',\n  },\n  hideDecline: {\n    doc: 'For variant confirmation, hide the default decline button and only show the confirmation button.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  hideConfirm: {\n    doc: 'For variant confirmation, hide the default confirm button and only show the decline button.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  scrollRef: {\n    doc: 'To get the scroll Element, pass in your own React ref.',\n    type: 'React.Ref',\n    status: 'optional',\n  },\n  contentRef: {\n    doc: 'To get the inner content Element, pass in your own React ref.',\n    type: 'React.Ref',\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,gBAAsC,GAAAC,OAAA,CAAAD,gBAAA,GAAG;EACpDE,OAAO,EAAE;IACPC,GAAG,EAAE,+FAA+F;IACpGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,4DAA4D;IACjEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,QAAQ,EAAE;IACRJ,GAAG,EAAE,iOAAiO;IACtOC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,QAAQ,EAAE;IACRL,GAAG,EAAE,oIAAoI;IACzIC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,SAAS,EAAE;IACTN,GAAG,EAAE,8DAA8D;IACnEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,OAAO,EAAE;IACPP,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,gBAAgB,EAAE;IAChBR,GAAG,EAAE,uHAAuH;IAC5HC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,UAAU,EAAE;IACVT,GAAG,EAAE,uGAAuG;IAC5GC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDQ,aAAa,EAAE;IACbV,GAAG,EAAE,4DAA4D;IACjEC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDS,YAAY,EAAE;IACZX,GAAG,EAAE,2DAA2D;IAChEC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDU,WAAW,EAAE;IACXZ,GAAG,EAAE,gKAAgK;IACrKC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDW,iBAAiB,EAAE;IACjBb,GAAG,EAAE,wGAAwG;IAC7GC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDY,YAAY,EAAE;IACZd,GAAG,EAAE,qMAAqM;IAC1MC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDa,UAAU,EAAE;IACVf,GAAG,EAAE,2LAA2L;IAChMC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDc,IAAI,EAAE;IACJhB,GAAG,EAAE,8IAA8I;IACnJC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDe,WAAW,EAAE;IACXjB,GAAG,EAAE,gIAAgI;IACrIC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDgB,WAAW,EAAE;IACXlB,GAAG,EAAE,gEAAgE;IACrEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDiB,WAAW,EAAE;IACXnB,GAAG,EAAE,qEAAqE;IAC1EC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDkB,WAAW,EAAE;IACXpB,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDmB,WAAW,EAAE;IACXrB,GAAG,EAAE,6FAA6F;IAClGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDoB,SAAS,EAAE;IACTtB,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,WAAW;IACjBC,MAAM,EAAE;EACV,CAAC;EACDqB,UAAU,EAAE;IACVvB,GAAG,EAAE,+DAA+D;IACpEC,IAAI,EAAE,WAAW;IACjBC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}
+{"version":3,"file":"DialogDocs.js","names":["DialogProperties","exports","variant","doc","type","status","title","minWidth","maxWidth","className","spacing","preventCoreStyle","navContent","headerContent","modalContent","description","verticalAlignment","alignContent","fullscreen","icon","confirmType","declineText","confirmText","hideDecline","hideConfirm","scrollRef","contentRef","DialogEvents","onConfirm","onDecline"],"sources":["../../../../src/components/dialog/DialogDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const DialogProperties: PropertiesTableProps = {\n  variant: {\n    doc: 'The dialog variant. Can either be `information` or `confirmation`. Defaults to `information`.',\n    type: 'string',\n    status: 'optional',\n  },\n  title: {\n    doc: 'The dialog title. Displays on the very top of the content.',\n    type: 'string',\n    status: 'optional',\n  },\n  minWidth: {\n    doc: \"The minimum Dialog content width, defined by a CSS width value like `50vw` (50% of the viewport). Be careful on using fixed `minWidth` so you don't break responsiveness. Defaults to `30rem` (average width is set to `60vw`).\",\n    type: 'string',\n    status: 'optional',\n  },\n  maxWidth: {\n    doc: 'The maximum Dialog content width, defined by a CSS width value like `20rem`. Defaults to `60rem` (average width is set to `60vw`).',\n    type: 'string',\n    status: 'optional',\n  },\n  className: {\n    doc: 'Give the Dialog content a class name (maps to `dnb-dialog`).',\n    type: 'string',\n    status: 'optional',\n  },\n  spacing: {\n    doc: 'If set to `false` then the dialog content will be shown without any spacing. Defaults to `true`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  preventCoreStyle: {\n    doc: 'By default the dialog content gets added the core style class `dnb-core-style`. Use `false` to disable this behavior.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  navContent: {\n    doc: 'The content which will appear in the navigation, above the header, and side-by-side the close button.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  headerContent: {\n    doc: 'The content which will appear in the header of the dialog.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  modalContent: {\n    doc: 'The content which will appear when triggering the dialog.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  description: {\n    doc: 'A description will be positioned below the title, but before the content. Used for Dialog variant `confirmation` to further describe what the actions will do.',\n    type: 'string',\n    status: 'optional',\n  },\n  verticalAlignment: {\n    doc: 'Define the vertical alignment of the container. Can be set to `top` or `center`. Defaults to `center`.',\n    type: 'string',\n    status: 'optional',\n  },\n  alignContent: {\n    doc: 'Define the inner horizontal alignment of the content. Can be set to `left`, `center`, `right` and `centered`. If `centered`, then the content will also be centered vertically. Defaults to `left`.',\n    type: 'string',\n    status: 'optional',\n  },\n  fullscreen: {\n    doc: 'If set to `true` then the dialog content will be shown as fullscreen, without showing the original content behind. Can be set to `false` to omit the auto fullscreen. Defaults to `auto`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  icon: {\n    doc: 'An icon to display at the top of the component. Should be of size medium, so make sure you import the `_medium` version of the Eufemia icon.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  confirmType: {\n    doc: 'For variant confirmation, the dialog is either an informational (`info`) or a warning (`warning`) message. Defaults to `info`.',\n    type: 'string',\n    status: 'optional',\n  },\n  declineText: {\n    doc: 'For dialog actions, give a custom text for the decline button.',\n    type: 'string',\n    status: 'optional',\n  },\n  confirmText: {\n    doc: 'For dialog actions, give a custom text for the confirmation button.',\n    type: 'string',\n    status: 'optional',\n  },\n  hideDecline: {\n    doc: 'For variant confirmation, hide the default decline button and only show the confirmation button.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  hideConfirm: {\n    doc: 'For variant confirmation, hide the default confirm button and only show the decline button.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  scrollRef: {\n    doc: 'To get the scroll Element, pass in your own React ref.',\n    type: 'React.Ref',\n    status: 'optional',\n  },\n  contentRef: {\n    doc: 'To get the inner content Element, pass in your own React ref.',\n    type: 'React.Ref',\n    status: 'optional',\n  },\n}\n\nexport const DialogEvents: PropertiesTableProps = {\n  onConfirm: {\n    doc: 'For variant confirmation, handle the confirm action click. Provided with the mouse event and the Modal function `close` as arguments.',\n    type: 'function',\n    status: 'optional',\n  },\n  onDecline: {\n    doc: 'For variant confirmation, handle the decline action click. Provided with the mouse event and the Modal function `close` as arguments.',\n    type: 'function',\n    status: 'optional',\n  },\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/drawer/DrawerDocs.d.ts

@@ -0,0 +1,2 @@
+import { PropertiesTableProps } from '../../shared/types';
+export declare const DrawerProperties: PropertiesTableProps;

package/cjs/components/drawer/DrawerDocs.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DrawerProperties = void 0;
+const DrawerProperties = exports.DrawerProperties = {
+  containerPlacement: {
+    doc: 'Defines on what side the Drawer should be opened. Can be set to `left`, `right`, `top` and `bottom`. Defaults to `right`.',
+    type: ['left', 'right', 'top', 'bottom'],
+    status: 'optional'
+  },
+  title: {
+    doc: 'The drawer title. Displays on the very top of the content.',
+    type: 'React.ReactNode',
+    status: 'optional'
+  },
+  minWidth: {
+    doc: "The minimum Drawer content width, defined by a CSS width value like `50vw` (50% of the viewport). Be careful on using fixed `minWidth` so you don't break responsiveness. Defaults to `30rem` (average width is set to `60vw`).",
+    type: ['string', 'number'],
+    status: 'optional'
+  },
+  maxWidth: {
+    doc: 'The maximum Drawer content width, defined by a CSS width value like `20rem`. Defaults to `60rem` (average width is set to `60vw`).',
+    type: ['string', 'number'],
+    status: 'optional'
+  },
+  className: {
+    doc: 'Give the Drawer content a class name (maps to `dnb-drawer`).',
+    type: 'string',
+    status: 'optional'
+  },
+  spacing: {
+    doc: 'If set to `false` then the drawer content will be shown without any spacing. Defaults to `true`. ',
+    type: 'boolean',
+    status: 'optional'
+  },
+  preventCoreStyle: {
+    doc: 'By default the drawer content gets added the core style class `dnb-core-style`. Use `false` to disable this behavior.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  navContent: {
+    doc: 'The content which will appear in the navigation, above the header, and side-by-side the close button.',
+    type: 'React.ReactNode',
+    status: 'optional'
+  },
+  headerContent: {
+    doc: 'The content which will appear in the header of the drawer.',
+    type: 'React.ReactNode',
+    status: 'optional'
+  },
+  modalContent: {
+    doc: 'The content which will appear when triggering the drawer.',
+    type: 'React.ReactNode',
+    status: 'optional'
+  },
+  alignContent: {
+    doc: 'Define the inner horizontal alignment of the content. Can be set to `left`, `center`, `right` and `centered`. If `centered`, then the content will also be centered vertically. Defaults to `left`.',
+    type: ['left', 'right', 'centered', 'center'],
+    status: 'optional'
+  },
+  fullscreen: {
+    doc: 'If set to `true` then the drawer content will be shown as fullscreen, without showing the original content behind. Can be set to `false` to omit the auto fullscreen. Defaults to `auto`. ',
+    type: ['boolean', 'string'],
+    status: 'optional'
+  }
+};
+//# sourceMappingURL=DrawerDocs.js.map

package/cjs/components/drawer/DrawerDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerDocs.js","names":["DrawerProperties","exports","containerPlacement","doc","type","status","title","minWidth","maxWidth","className","spacing","preventCoreStyle","navContent","headerContent","modalContent","alignContent","fullscreen"],"sources":["../../../../src/components/drawer/DrawerDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const DrawerProperties: PropertiesTableProps = {\n  containerPlacement: {\n    doc: 'Defines on what side the Drawer should be opened. Can be set to `left`, `right`, `top` and `bottom`. Defaults to `right`.',\n    type: ['left', 'right', 'top', 'bottom'],\n    status: 'optional',\n  },\n  title: {\n    doc: 'The drawer title. Displays on the very top of the content.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  minWidth: {\n    doc: \"The minimum Drawer content width, defined by a CSS width value like `50vw` (50% of the viewport). Be careful on using fixed `minWidth` so you don't break responsiveness. Defaults to `30rem` (average width is set to `60vw`).\",\n    type: ['string', 'number'],\n    status: 'optional',\n  },\n  maxWidth: {\n    doc: 'The maximum Drawer content width, defined by a CSS width value like `20rem`. Defaults to `60rem` (average width is set to `60vw`).',\n    type: ['string', 'number'],\n    status: 'optional',\n  },\n  className: {\n    doc: 'Give the Drawer content a class name (maps to `dnb-drawer`).',\n    type: 'string',\n    status: 'optional',\n  },\n  spacing: {\n    doc: 'If set to `false` then the drawer content will be shown without any spacing. Defaults to `true`. ',\n    type: 'boolean',\n    status: 'optional',\n  },\n  preventCoreStyle: {\n    doc: 'By default the drawer content gets added the core style class `dnb-core-style`. Use `false` to disable this behavior.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  navContent: {\n    doc: 'The content which will appear in the navigation, above the header, and side-by-side the close button.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  headerContent: {\n    doc: 'The content which will appear in the header of the drawer.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  modalContent: {\n    doc: 'The content which will appear when triggering the drawer.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  alignContent: {\n    doc: 'Define the inner horizontal alignment of the content. Can be set to `left`, `center`, `right` and `centered`. If `centered`, then the content will also be centered vertically. Defaults to `left`.',\n    type: ['left', 'right', 'centered', 'center'],\n    status: 'optional',\n  },\n  fullscreen: {\n    doc: 'If set to `true` then the drawer content will be shown as fullscreen, without showing the original content behind. Can be set to `false` to omit the auto fullscreen. Defaults to `auto`. ',\n    type: ['boolean', 'string'],\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,gBAAsC,GAAAC,OAAA,CAAAD,gBAAA,GAAG;EACpDE,kBAAkB,EAAE;IAClBC,GAAG,EAAE,2HAA2H;IAChIC,IAAI,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC;IACxCC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,4DAA4D;IACjEC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDE,QAAQ,EAAE;IACRJ,GAAG,EAAE,iOAAiO;IACtOC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV,CAAC;EACDG,QAAQ,EAAE;IACRL,GAAG,EAAE,oIAAoI;IACzIC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV,CAAC;EACDI,SAAS,EAAE;IACTN,GAAG,EAAE,8DAA8D;IACnEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,OAAO,EAAE;IACPP,GAAG,EAAE,mGAAmG;IACxGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,gBAAgB,EAAE;IAChBR,GAAG,EAAE,uHAAuH;IAC5HC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,UAAU,EAAE;IACVT,GAAG,EAAE,uGAAuG;IAC5GC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDQ,aAAa,EAAE;IACbV,GAAG,EAAE,4DAA4D;IACjEC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDS,YAAY,EAAE;IACZX,GAAG,EAAE,2DAA2D;IAChEC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDU,YAAY,EAAE;IACZZ,GAAG,EAAE,qMAAqM;IAC1MC,IAAI,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC;IAC7CC,MAAM,EAAE;EACV,CAAC;EACDW,UAAU,EAAE;IACVb,GAAG,EAAE,4LAA4L;IACjMC,IAAI,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC;IAC3BC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}

package/cjs/components/dropdown/DropdownDocs.d.ts

@@ -0,0 +1,2 @@
+import { PropertiesTableProps } from '../../shared/types';
+export declare const DropdownEvents: PropertiesTableProps;

package/cjs/components/dropdown/DropdownDocs.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DropdownEvents = void 0;
+const DropdownEvents = exports.DropdownEvents = {
+  on_change: {
+    doc: 'will be called on state changes made by the user. Returns an object with the new selected `data` item `{ data, event, attributes, value }`.',
+    type: 'function',
+    status: 'optional'
+  },
+  on_select: {
+    doc: 'will be called once the user focuses or selects an item by a click or keyboard navigation. Returns an object with the new selected `data` item `{ data, event, attributes, value, active_item }`. The **active_item** property is the currently selected item by keyboard navigation.',
+    type: 'function',
+    status: 'optional'
+  },
+  on_show: {
+    doc: 'will be called once the user presses the dropdown. Returns the data item `{ data, attributes }`.',
+    type: 'function',
+    status: 'optional'
+  },
+  on_hide: {
+    doc: 'will be called once the user presses the dropdown again, or clicks somewhere else. Returns the data item `{ data, attributes }`.',
+    type: 'function',
+    status: 'optional'
+  }
+};
+//# sourceMappingURL=DropdownDocs.js.map

package/cjs/components/dropdown/DropdownDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownDocs.js","names":["DropdownEvents","exports","on_change","doc","type","status","on_select","on_show","on_hide"],"sources":["../../../../src/components/dropdown/DropdownDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const DropdownEvents: PropertiesTableProps = {\n  on_change: {\n    doc: 'will be called on state changes made by the user. Returns an object with the new selected `data` item `{ data, event, attributes, value }`.',\n    type: 'function',\n    status: 'optional',\n  },\n  on_select: {\n    doc: 'will be called once the user focuses or selects an item by a click or keyboard navigation. Returns an object with the new selected `data` item `{ data, event, attributes, value, active_item }`. The **active_item** property is the currently selected item by keyboard navigation.',\n    type: 'function',\n    status: 'optional',\n  },\n  on_show: {\n    doc: 'will be called once the user presses the dropdown. Returns the data item `{ data, attributes }`.',\n    type: 'function',\n    status: 'optional',\n  },\n  on_hide: {\n    doc: 'will be called once the user presses the dropdown again, or clicks somewhere else. Returns the data item `{ data, attributes }`.',\n    type: 'function',\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,cAAoC,GAAAC,OAAA,CAAAD,cAAA,GAAG;EAClDE,SAAS,EAAE;IACTC,GAAG,EAAE,6IAA6I;IAClJC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDC,SAAS,EAAE;IACTH,GAAG,EAAE,uRAAuR;IAC5RC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDE,OAAO,EAAE;IACPJ,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDG,OAAO,EAAE;IACPL,GAAG,EAAE,kIAAkI;IACvIC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}

package/cjs/components/form-label/FormLabelDocs.d.ts

@@ -0,0 +1,2 @@
+import { PropertiesTableProps } from '../../shared/types';
+export declare const FormLabelProperties: PropertiesTableProps;

package/cjs/components/form-label/FormLabelDocs.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FormLabelProperties = void 0;
+const FormLabelProperties = exports.FormLabelProperties = {
+  forId: {
+    doc: 'the same unique `id` like the linked HTML element has.',
+    type: 'string',
+    status: 'required'
+  },
+  text: {
+    doc: 'the `text` of the label. You can use `children` as well.',
+    type: 'React.ReactNode',
+    status: 'optional'
+  },
+  srOnly: {
+    doc: 'when `true`, the label will be invisible and only accessible for screen readers.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  vertical: {
+    doc: 'if set to `true`, will do the same as `label_direction` when set to **vertical**.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  size: {
+    doc: 'define one of the following [heading sizes](/uilib/elements/heading/): `medium` or `large`.',
+    type: ['medium', 'large'],
+    status: 'optional'
+  },
+  skeleton: {
+    doc: 'If set to `true`, an overlaying skeleton with animation will be shown.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  disabled: {
+    doc: 'if set to `true`, the label will behave as not interactive.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  element: {
+    doc: 'defines the HTML element used. Defaults to `label`.',
+    type: 'React.Element',
+    status: 'optional'
+  },
+  innerRef: {
+    doc: 'attach a React Ref to the inner label `element`.',
+    type: 'React.Ref',
+    status: 'optional'
+  },
+  '[Space](/uilib/layout/space/properties)': {
+    doc: 'Spacing properties like `top` or `bottom` are supported.',
+    type: ['string', 'object'],
+    status: 'optional'
+  }
+};
+//# sourceMappingURL=FormLabelDocs.js.map

package/cjs/components/form-label/FormLabelDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLabelDocs.js","names":["FormLabelProperties","exports","forId","doc","type","status","text","srOnly","vertical","size","skeleton","disabled","element","innerRef"],"sources":["../../../../src/components/form-label/FormLabelDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const FormLabelProperties: PropertiesTableProps = {\n  forId: {\n    doc: 'the same unique `id` like the linked HTML element has.',\n    type: 'string',\n    status: 'required',\n  },\n  text: {\n    doc: 'the `text` of the label. You can use `children` as well.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  srOnly: {\n    doc: 'when `true`, the label will be invisible and only accessible for screen readers.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  vertical: {\n    doc: 'if set to `true`, will do the same as `label_direction` when set to **vertical**.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  size: {\n    doc: 'define one of the following [heading sizes](/uilib/elements/heading/): `medium` or `large`.',\n    type: ['medium', 'large'],\n    status: 'optional',\n  },\n  skeleton: {\n    doc: 'If set to `true`, an overlaying skeleton with animation will be shown.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  disabled: {\n    doc: 'if set to `true`, the label will behave as not interactive.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  element: {\n    doc: 'defines the HTML element used. Defaults to `label`.',\n    type: 'React.Element',\n    status: 'optional',\n  },\n  innerRef: {\n    doc: 'attach a React Ref to the inner label `element`.',\n    type: 'React.Ref',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,mBAAyC,GAAAC,OAAA,CAAAD,mBAAA,GAAG;EACvDE,KAAK,EAAE;IACLC,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,IAAI,EAAE;IACJH,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDE,MAAM,EAAE;IACNJ,GAAG,EAAE,kFAAkF;IACvFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDG,QAAQ,EAAE;IACRL,GAAG,EAAE,mFAAmF;IACxFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDI,IAAI,EAAE;IACJN,GAAG,EAAE,6FAA6F;IAClGC,IAAI,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;IACzBC,MAAM,EAAE;EACV,CAAC;EACDK,QAAQ,EAAE;IACRP,GAAG,EAAE,wEAAwE;IAC7EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,QAAQ,EAAE;IACRR,GAAG,EAAE,6DAA6D;IAClEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,OAAO,EAAE;IACPT,GAAG,EAAE,qDAAqD;IAC1DC,IAAI,EAAE,eAAe;IACrBC,MAAM,EAAE;EACV,CAAC;EACDQ,QAAQ,EAAE;IACRV,GAAG,EAAE,kDAAkD;IACvDC,IAAI,EAAE,WAAW;IACjBC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}

package/cjs/components/form-row/FormRow.d.ts

@@ -14,23 +14,68 @@ export interface FormRowProps
   extends Omit<React.HTMLProps<HTMLElement>, 'ref'>,
     SpacingProps {
   id?: string;
+  /**
+   * use either the `label` property or provide a custom one.
+   */
   label?: React.ReactNode;
+  /**
+   * use `label_direction="vertical"` to change the label/legend layout direction. Defaults to `horizontal`.
+   */
   label_direction?: FormLabelLabelDirection;
+  /**
+   * use `true` to make the label only readable by screen readers.
+   */
   label_sr_only?: boolean;
   label_id?: string;
+  /**
+   * if you need to style the "legend", then you can either send in a custom Component, like `label={ <H2> }`, or define your styling class with the `label_class` property.
+   */
   label_class?: string;
   no_label?: boolean;
+  /**
+   * if set to `true`, then the internal `legend` element will be a `label` instead, and no `<fieldset>` is used. Keep in mind, that `<legend>` and `<fieldset>` **is only used if a `label` is provided**. Defaults to `false`.
+   */
   no_fieldset?: boolean;
+  /**
+   * Send along a different locale to all nested components.
+   */
   locale?: InternalLocale;
+  /**
+   * forces the content of a FormRow to wrap. Make sure you always define spacing as `right="..."` and not `left`, this way components will align left once they wrap. Defaults to `false`.
+   */
   wrap?: boolean;
+  /**
+   * to define the layout direction on how the next component should be placed on. Can be either `vertical` or `horizontal`. Defaults to `horizontal`.
+   */
   direction?: FormRowDirection;
+  /**
+   * will force both `direction` and `label_direction` to be **vertical** if set to `true`
+   */
   vertical?: boolean;
+  /**
+   * will center all children vertically as long as the screen does not hit a mobile width.
+   */
   centered?: boolean;
+  /**
+   * to enable the visual helper `.dnb-section` class. Use a supported modifier from the [Section component](/uilib/components/section/properties). Defaults to `null`.
+   */
   section_style?: SectionStyleTypes;
+  /**
+   * to modify the `spacing`. Use a supported modifier from the [Section component](/uilib/components/section/properties). Defaults to `null`.
+   */
   section_spacing?: SectionSpacing;
   globalStatus?: GlobalStatusConfigObject;
+  /**
+   * to force responsiveness on form components (like [Input](/uilib/components/input) and their labels ([FormLabel](/uilib/components/form-label)), set the property to `true`. Defaults to `false`.
+   */
   responsive?: boolean;
+  /**
+   * if set to `true`, every component inside will be disabled. Defaults to `false`.
+   */
   disabled?: boolean;
+  /**
+   * If set to `true`, an overlaying skeleton with animation will be shown.
+   */
   skeleton?: SkeletonShow;
   skipContentWrapperIfNested?: boolean;
   className?: string;

package/cjs/components/form-row/FormRowDocs.d.ts

@@ -0,0 +1,2 @@
+import { PropertiesTableProps } from '../../shared/types';
+export declare const FormRowProperties: PropertiesTableProps;

package/cjs/components/form-row/FormRowDocs.js

@@ -0,0 +1,89 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FormRowProperties = void 0;
+const FormRowProperties = exports.FormRowProperties = {
+  label: {
+    doc: 'use either the `label` property or provide a custom one.',
+    type: 'React.ReactNode',
+    status: 'optional'
+  },
+  label_direction: {
+    doc: 'use `label_direction="vertical"` to change the label/legend layout direction. Defaults to `horizontal`.',
+    type: ['vertical', 'horizontal'],
+    status: 'optional'
+  },
+  label_sr_only: {
+    doc: 'use `true` to make the label only readable by screen readers.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  direction: {
+    doc: 'to define the layout direction on how the next component should be placed on. Can be either `vertical` or `horizontal`. Defaults to `horizontal`.',
+    type: ['vertical', 'horizontal'],
+    status: 'optional'
+  },
+  vertical: {
+    doc: 'will force both `direction` and `label_direction` to be **vertical** if set to `true`',
+    type: 'boolean',
+    status: 'optional'
+  },
+  centered: {
+    doc: 'will center all children vertically as long as the screen does not hit a mobile width.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  wrap: {
+    doc: 'forces the content of a FormRow to wrap. Make sure you always define spacing as `right="..."` and not `left`, this way components will align left once they wrap. Defaults to `false`.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  responsive: {
+    doc: 'to force responsiveness on form components (like [Input](/uilib/components/input) and their labels ([FormLabel](/uilib/components/form-label)), set the property to `true`. Defaults to `false`.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  section_style: {
+    doc: 'to enable the visual helper `.dnb-section` class. Use a supported modifier from the [Section component](/uilib/components/section/properties). Defaults to `null`.',
+    type: ['divider', 'white', 'transparent'],
+    status: 'optional'
+  },
+  section_spacing: {
+    doc: 'to modify the `spacing`. Use a supported modifier from the [Section component](/uilib/components/section/properties). Defaults to `null`.',
+    type: ['x-small', 'small', 'medium', 'large', 'x-large', 'xx-large'],
+    status: 'optional'
+  },
+  no_fieldset: {
+    doc: 'if set to `true`, then the internal `legend` element will be a `label` instead, and no `<fieldset>` is used. Keep in mind, that `<legend>` and `<fieldset>` **is only used if a `label` is provided**. Defaults to `false`.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  label_class: {
+    doc: 'if you need to style the "legend", then you can either send in a custom Component, like `label={ <H2> }`, or define your styling class with the `label_class` property.',
+    type: 'string',
+    status: 'optional'
+  },
+  locale: {
+    doc: 'Send along a different locale to all nested components.',
+    type: 'string',
+    status: 'optional'
+  },
+  disabled: {
+    doc: 'if set to `true`, every component inside will be disabled. Defaults to `false`.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  skeleton: {
+    doc: 'If set to `true`, an overlaying skeleton with animation will be shown.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  '[Space](/uilib/layout/space/properties)': {
+    doc: 'Spacing properties like `top` or `bottom` are supported.',
+    type: ['string', 'object'],
+    status: 'optional'
+  }
+};
+//# sourceMappingURL=FormRowDocs.js.map

package/cjs/components/form-row/FormRowDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRowDocs.js","names":["FormRowProperties","exports","label","doc","type","status","label_direction","label_sr_only","direction","vertical","centered","wrap","responsive","section_style","section_spacing","no_fieldset","label_class","locale","disabled","skeleton"],"sources":["../../../../src/components/form-row/FormRowDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const FormRowProperties: PropertiesTableProps = {\n  label: {\n    doc: 'use either the `label` property or provide a custom one.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  label_direction: {\n    doc: 'use `label_direction=\"vertical\"` to change the label/legend layout direction. Defaults to `horizontal`.',\n    type: ['vertical', 'horizontal'],\n    status: 'optional',\n  },\n  label_sr_only: {\n    doc: 'use `true` to make the label only readable by screen readers.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  direction: {\n    doc: 'to define the layout direction on how the next component should be placed on. Can be either `vertical` or `horizontal`. Defaults to `horizontal`.',\n    type: ['vertical', 'horizontal'],\n    status: 'optional',\n  },\n  vertical: {\n    doc: 'will force both `direction` and `label_direction` to be **vertical** if set to `true`',\n    type: 'boolean',\n    status: 'optional',\n  },\n  centered: {\n    doc: 'will center all children vertically as long as the screen does not hit a mobile width.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  wrap: {\n    doc: 'forces the content of a FormRow to wrap. Make sure you always define spacing as `right=\"...\"` and not `left`, this way components will align left once they wrap. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  responsive: {\n    doc: 'to force responsiveness on form components (like [Input](/uilib/components/input) and their labels ([FormLabel](/uilib/components/form-label)), set the property to `true`. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  section_style: {\n    doc: 'to enable the visual helper `.dnb-section` class. Use a supported modifier from the [Section component](/uilib/components/section/properties). Defaults to `null`.',\n    type: ['divider', 'white', 'transparent'],\n    status: 'optional',\n  },\n  section_spacing: {\n    doc: 'to modify the `spacing`. Use a supported modifier from the [Section component](/uilib/components/section/properties). Defaults to `null`.',\n    type: ['x-small', 'small', 'medium', 'large', 'x-large', 'xx-large'],\n    status: 'optional',\n  },\n  no_fieldset: {\n    doc: 'if set to `true`, then the internal `legend` element will be a `label` instead, and no `<fieldset>` is used. Keep in mind, that `<legend>` and `<fieldset>` **is only used if a `label` is provided**. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  label_class: {\n    doc: 'if you need to style the \"legend\", then you can either send in a custom Component, like `label={ <H2> }`, or define your styling class with the `label_class` property.',\n    type: 'string',\n    status: 'optional',\n  },\n  locale: {\n    doc: 'Send along a different locale to all nested components.',\n    type: 'string',\n    status: 'optional',\n  },\n  disabled: {\n    doc: 'if set to `true`, every component inside will be disabled. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  skeleton: {\n    doc: 'If set to `true`, an overlaying skeleton with animation will be shown.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,iBAAuC,GAAAC,OAAA,CAAAD,iBAAA,GAAG;EACrDE,KAAK,EAAE;IACLC,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDC,eAAe,EAAE;IACfH,GAAG,EAAE,yGAAyG;IAC9GC,IAAI,EAAE,CAAC,UAAU,EAAE,YAAY,CAAC;IAChCC,MAAM,EAAE;EACV,CAAC;EACDE,aAAa,EAAE;IACbJ,GAAG,EAAE,+DAA+D;IACpEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDG,SAAS,EAAE;IACTL,GAAG,EAAE,mJAAmJ;IACxJC,IAAI,EAAE,CAAC,UAAU,EAAE,YAAY,CAAC;IAChCC,MAAM,EAAE;EACV,CAAC;EACDI,QAAQ,EAAE;IACRN,GAAG,EAAE,uFAAuF;IAC5FC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDK,QAAQ,EAAE;IACRP,GAAG,EAAE,wFAAwF;IAC7FC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,IAAI,EAAE;IACJR,GAAG,EAAE,wLAAwL;IAC7LC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,UAAU,EAAE;IACVT,GAAG,EAAE,kMAAkM;IACvMC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDQ,aAAa,EAAE;IACbV,GAAG,EAAE,oKAAoK;IACzKC,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,aAAa,CAAC;IACzCC,MAAM,EAAE;EACV,CAAC;EACDS,eAAe,EAAE;IACfX,GAAG,EAAE,2IAA2I;IAChJC,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,CAAC;IACpEC,MAAM,EAAE;EACV,CAAC;EACDU,WAAW,EAAE;IACXZ,GAAG,EAAE,6NAA6N;IAClOC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDW,WAAW,EAAE;IACXb,GAAG,EAAE,yKAAyK;IAC9KC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDY,MAAM,EAAE;IACNd,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDa,QAAQ,EAAE;IACRf,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDc,QAAQ,EAAE;IACRhB,GAAG,EAAE,wEAAwE;IAC7EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}

package/cjs/components/form-set/FormSet.d.ts

@@ -13,10 +13,25 @@ export type FormSetChildren =
 export interface FormSetProps
   extends Omit<React.HTMLProps<HTMLElement>, 'ref'>,
     SpacingProps {
+  /**
+   * define what HTML element should be used. Defaults to `<form>`.
+   */
   element?: string;
+  /**
+   * if set to `true`, then a `div` HTML element will be used instead of `form`. Defaults to `false`.
+   */
   no_form?: boolean;
+  /**
+   * if set to `true`, every component inside will be disabled. Defaults to `false`.
+   */
   disabled?: boolean;
+  /**
+   * if set to `true`, it enables skeleton for nested components. Defaults to `false`.
+   */
   skeleton?: SkeletonShow;
+  /**
+   * if set to `true`, components inside can't cause a page refresh. The event `on_submit` will still be triggered. Defaults to `false`.
+   */
   prevent_submit?: boolean;
   id?: string;
   label?: React.ReactNode;
@@ -26,6 +41,9 @@ export interface FormSetProps
   label_class?: string;
   no_label?: boolean;
   no_fieldset?: boolean;
+  /**
+   * Send along a different locale to all nested components.
+   */
   locale?: InternalLocale;
   wrap?: boolean;
   direction?: FormSetDirection;