@iabbb/bds-react 0.38.6 → 0.39.0-alpha

package/ErrorSummary/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/ErrorSummary/utils.ts","../../src/ErrorSummary/ErrorSummary.tsx"],"sourcesContent":["export function getFragmentFromUrl(url: string) {\r\n  return url.includes('#') ? url.split('#').pop() : undefined;\r\n}\r\n\r\nexport function getAssociatedLegendOrLabel(input: HTMLElement) {\r\n  const fieldset = input.closest('fieldset');\r\n\r\n  if (fieldset) {\r\n    const legends = fieldset.getElementsByTagName('legend');\r\n\r\n    if (legends.length) {\r\n      const candidateLegend = legends[0];\r\n\r\n      // If the input type is radio or checkbox, always use the legend if there\r\n      // is one.\r\n      if (input instanceof HTMLInputElement && (input.type === 'checkbox' || input.type === 'radio')) {\r\n        return candidateLegend;\r\n      }\r\n\r\n      // For other input types, only scroll to the fieldset’s legend (instead of\r\n      // the label associated with the input) if the input would end up in the\r\n      // top half of the screen.\r\n      //\r\n      // This should avoid situations where the input either ends up off the\r\n      // screen, or obscured by a software keyboard.\r\n      const legendTop = candidateLegend.getBoundingClientRect().top;\r\n      const inputRect = input.getBoundingClientRect();\r\n\r\n      // If the browser doesn't support Element.getBoundingClientRect().height\r\n      // or window.innerHeight (like IE8), bail and just link to the label.\r\n      if (inputRect.height && window.innerHeight) {\r\n        const inputBottom = inputRect.top + inputRect.height;\r\n\r\n        if (inputBottom - legendTop < window.innerHeight / 2) {\r\n          return candidateLegend;\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  return document.querySelector(`label[for='${input.getAttribute('id')}']`) ?? input.closest('label');\r\n}\r\n","import * as React from 'react';\r\n\r\nimport { getAssociatedLegendOrLabel, getFragmentFromUrl } from './utils';\r\n\r\ndeclare global {\r\n  namespace JSX {\r\n    interface IntrinsicElements {\r\n      'bds-error-summary': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;\r\n    }\r\n  }\r\n}\r\n\r\nexport const FormErrorKey = '_form';\r\n\r\nconst FINAL_FORM_ERROR = 'FINAL_FORM/form-error';\r\n\r\nexport type ErrorSummaryProps = {\r\n  errors: Record<string, Array<string> | string> | null;\r\n  mapNameToId?: (name: string) => string;\r\n};\r\n\r\nexport default function BdsErrorSummary({\r\n  className,\r\n  errors,\r\n  mapNameToId = (name) => name,\r\n  ...props\r\n}: ErrorSummaryProps & React.ComponentPropsWithoutRef<'div'>) {\r\n  const headingId = React.useId();\r\n  const groupRef = React.useRef<HTMLElement>(null);\r\n\r\n  React.useEffect(() => {\r\n    if (!errors || Object.keys(errors).length === 0) return;\r\n    if (!groupRef.current) return;\r\n\r\n    groupRef.current.focus();\r\n  }, [errors]);\r\n\r\n  if (!errors || Object.keys(errors).length === 0) return null;\r\n\r\n  const handleLinkClick = (e) => {\r\n    const inputId = getFragmentFromUrl(e.currentTarget.href);\r\n\r\n    if (!inputId) {\r\n      return;\r\n    }\r\n\r\n    const input = document.getElementById(inputId);\r\n\r\n    if (!input) {\r\n      return;\r\n    }\r\n\r\n    const legendOrLabel = getAssociatedLegendOrLabel(input);\r\n\r\n    if (!legendOrLabel) {\r\n      return;\r\n    }\r\n\r\n    e.preventDefault();\r\n\r\n    legendOrLabel.scrollIntoView();\r\n    input.focus({ preventScroll: true });\r\n  };\r\n\r\n  return (\r\n    <bds-error-summary\r\n      className={['stack', className].filter((x) => x).join(' ')}\r\n      role=\"group\"\r\n      aria-labelledby={headingId}\r\n      ref={groupRef}\r\n      tabIndex={-1}\r\n      {...props}\r\n    >\r\n      <h2 className=\"bds-h5\" id={headingId}>\r\n        <svg\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          viewBox=\"0 0 512 512\"\r\n          aria-hidden=\"true\"\r\n          height=\"1em\"\r\n          width=\"1em\"\r\n          fill=\"currentColor\"\r\n        >\r\n          <path d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z\" />\r\n        </svg>\r\n        Issue\r\n      </h2>\r\n      <ul>\r\n        {Object.keys(errors).map((errorKey) => {\r\n          const message = errors[errorKey];\r\n          const isFormError = [FINAL_FORM_ERROR, FormErrorKey].includes(errorKey);\r\n\r\n          if (isFormError) {\r\n            return <li key={errorKey} dangerouslySetInnerHTML={{ __html: message }} />;\r\n          }\r\n\r\n          const isArrayField = Array.isArray(message);\r\n\r\n          const messages = isArrayField ? message : [message];\r\n\r\n          return (\r\n            <React.Fragment key={errorKey}>\r\n              {messages.map((fieldMessage, index) => {\r\n                const inputId = `${mapNameToId(errorKey)}${isArrayField ? `[${index}]` : ''}`;\r\n\r\n                return (\r\n                  <li key={inputId}>\r\n                    <a href={`#${inputId}`} onClick={handleLinkClick}>\r\n                      {fieldMessage}\r\n                      {messages.length > 1 ? ` (${index + 1} of ${messages.length})` : undefined}\r\n                    </a>\r\n                  </li>\r\n                );\r\n              })}\r\n            </React.Fragment>\r\n          );\r\n        })}\r\n      </ul>\r\n    </bds-error-summary>\r\n  );\r\n}\r\n"],"names":["getFragmentFromUrl","url","includes","split","pop","undefined","getAssociatedLegendOrLabel","input","_document$querySelect","fieldset","closest","legends","getElementsByTagName","length","candidateLegend","HTMLInputElement","type","legendTop","getBoundingClientRect","top","inputRect","height","window","innerHeight","inputBottom","document","querySelector","concat","getAttribute","FormErrorKey","FINAL_FORM_ERROR","BdsErrorSummary","_ref","className","errors","_ref$mapNameToId","mapNameToId","name","props","_objectWithoutProperties","_excluded","headingId","React","useId","groupRef","useRef","useEffect","Object","keys","current","focus","handleLinkClick","e","inputId","currentTarget","href","getElementById","legendOrLabel","preventDefault","scrollIntoView","preventScroll","createElement","_extends","filter","x","join","role","ref","tabIndex","id","xmlns","viewBox","width","fill","d","map","errorKey","message","isFormError","key","dangerouslySetInnerHTML","__html","isArrayField","Array","isArray","messages","Fragment","fieldMessage","index","onClick"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAO,SAASA,kBAAkBA,CAACC,GAAW,EAAE;AAC9C,EAAA,OAAOA,GAAG,CAACC,QAAQ,CAAC,GAAG,CAAC,GAAGD,GAAG,CAACE,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,EAAE,GAAGC,SAAS,CAAA;AAC7D,CAAA;AAEO,SAASC,0BAA0BA,CAACC,KAAkB,EAAE;AAAA,EAAA,IAAAC,qBAAA,CAAA;AAC7D,EAAA,IAAMC,QAAQ,GAAGF,KAAK,CAACG,OAAO,CAAC,UAAU,CAAC,CAAA;AAE1C,EAAA,IAAID,QAAQ,EAAE;AACZ,IAAA,IAAME,OAAO,GAAGF,QAAQ,CAACG,oBAAoB,CAAC,QAAQ,CAAC,CAAA;IAEvD,IAAID,OAAO,CAACE,MAAM,EAAE;AAClB,MAAA,IAAMC,eAAe,GAAGH,OAAO,CAAC,CAAC,CAAC,CAAA;;AAElC;AACA;AACA,MAAA,IAAIJ,KAAK,YAAYQ,gBAAgB,KAAKR,KAAK,CAACS,IAAI,KAAK,UAAU,IAAIT,KAAK,CAACS,IAAI,KAAK,OAAO,CAAC,EAAE;AAC9F,QAAA,OAAOF,eAAe,CAAA;AACxB,OAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;MACA,IAAMG,SAAS,GAAGH,eAAe,CAACI,qBAAqB,EAAE,CAACC,GAAG,CAAA;AAC7D,MAAA,IAAMC,SAAS,GAAGb,KAAK,CAACW,qBAAqB,EAAE,CAAA;;AAE/C;AACA;AACA,MAAA,IAAIE,SAAS,CAACC,MAAM,IAAIC,MAAM,CAACC,WAAW,EAAE;QAC1C,IAAMC,WAAW,GAAGJ,SAAS,CAACD,GAAG,GAAGC,SAAS,CAACC,MAAM,CAAA;QAEpD,IAAIG,WAAW,GAAGP,SAAS,GAAGK,MAAM,CAACC,WAAW,GAAG,CAAC,EAAE;AACpD,UAAA,OAAOT,eAAe,CAAA;AACxB,SAAA;AACF,OAAA;AACF,KAAA;AACF,GAAA;EAEA,OAAAN,CAAAA,qBAAA,GAAOiB,QAAQ,CAACC,aAAa,CAAAC,aAAAA,CAAAA,MAAA,CAAepB,KAAK,CAACqB,YAAY,CAAC,IAAI,CAAC,EAAI,IAAA,CAAA,CAAC,MAAApB,IAAAA,IAAAA,qBAAA,KAAAA,KAAAA,CAAAA,GAAAA,qBAAA,GAAID,KAAK,CAACG,OAAO,CAAC,OAAO,CAAC,CAAA;AACrG;;;AC7BO,IAAMmB,YAAY,GAAG,QAAO;AAEnC,IAAMC,gBAAgB,GAAG,uBAAuB,CAAA;AAOjC,SAASC,eAAeA,CAAAC,IAAA,EAKuB;AAAA,EAAA,IAJ5DC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,MAAM,GAAAF,IAAA,CAANE,MAAM;IAAAC,gBAAA,GAAAH,IAAA,CACNI,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAG,KAAA,CAAA,GAAA,UAACE,IAAI,EAAA;AAAA,MAAA,OAAKA,IAAI,CAAA;AAAA,KAAA,GAAAF,gBAAA;AACzBG,IAAAA,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA,CAAA;AAER,EAAA,IAAMC,SAAS,GAAGC,gBAAK,CAACC,KAAK,EAAE,CAAA;AAC/B,EAAA,IAAMC,QAAQ,GAAGF,gBAAK,CAACG,MAAM,CAAc,IAAI,CAAC,CAAA;EAEhDH,gBAAK,CAACI,SAAS,CAAC,YAAM;AACpB,IAAA,IAAI,CAACZ,MAAM,IAAIa,MAAM,CAACC,IAAI,CAACd,MAAM,CAAC,CAACrB,MAAM,KAAK,CAAC,EAAE,OAAA;AACjD,IAAA,IAAI,CAAC+B,QAAQ,CAACK,OAAO,EAAE,OAAA;AAEvBL,IAAAA,QAAQ,CAACK,OAAO,CAACC,KAAK,EAAE,CAAA;AAC1B,GAAC,EAAE,CAAChB,MAAM,CAAC,CAAC,CAAA;AAEZ,EAAA,IAAI,CAACA,MAAM,IAAIa,MAAM,CAACC,IAAI,CAACd,MAAM,CAAC,CAACrB,MAAM,KAAK,CAAC,EAAE,OAAO,IAAI,CAAA;AAE5D,EAAA,IAAMsC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,CAAC,EAAK;IAC7B,IAAMC,OAAO,GAAGrD,kBAAkB,CAACoD,CAAC,CAACE,aAAa,CAACC,IAAI,CAAC,CAAA;IAExD,IAAI,CAACF,OAAO,EAAE;AACZ,MAAA,OAAA;AACF,KAAA;AAEA,IAAA,IAAM9C,KAAK,GAAGkB,QAAQ,CAAC+B,cAAc,CAACH,OAAO,CAAC,CAAA;IAE9C,IAAI,CAAC9C,KAAK,EAAE;AACV,MAAA,OAAA;AACF,KAAA;AAEA,IAAA,IAAMkD,aAAa,GAAGnD,0BAA0B,CAACC,KAAK,CAAC,CAAA;IAEvD,IAAI,CAACkD,aAAa,EAAE;AAClB,MAAA,OAAA;AACF,KAAA;IAEAL,CAAC,CAACM,cAAc,EAAE,CAAA;IAElBD,aAAa,CAACE,cAAc,EAAE,CAAA;IAC9BpD,KAAK,CAAC2C,KAAK,CAAC;AAAEU,MAAAA,aAAa,EAAE,IAAA;AAAK,KAAC,CAAC,CAAA;GACrC,CAAA;AAED,EAAA,oBACElB,gBAAA,CAAAmB,aAAA,CAAA,mBAAA,EAAAC,QAAA,CAAA;IACE7B,SAAS,EAAE,CAAC,OAAO,EAAEA,SAAS,CAAC,CAAC8B,MAAM,CAAC,UAACC,CAAC,EAAA;AAAA,MAAA,OAAKA,CAAC,CAAA;AAAA,KAAA,CAAC,CAACC,IAAI,CAAC,GAAG,CAAE;AAC3DC,IAAAA,IAAI,EAAC,OAAO;AACZ,IAAA,iBAAA,EAAiBzB,SAAU;AAC3B0B,IAAAA,GAAG,EAAEvB,QAAS;AACdwB,IAAAA,QAAQ,EAAE,CAAC,CAAA;AAAE,GAAA,EACT9B,KAAK,CAAA,eAETI,gBAAA,CAAAmB,aAAA,CAAA,IAAA,EAAA;AAAI5B,IAAAA,SAAS,EAAC,QAAQ;AAACoC,IAAAA,EAAE,EAAE5B,SAAAA;GACzBC,eAAAA,gBAAA,CAAAmB,aAAA,CAAA,KAAA,EAAA;AACES,IAAAA,KAAK,EAAC,4BAA4B;AAClCC,IAAAA,OAAO,EAAC,aAAa;AACrB,IAAA,aAAA,EAAY,MAAM;AAClBlD,IAAAA,MAAM,EAAC,KAAK;AACZmD,IAAAA,KAAK,EAAC,KAAK;AACXC,IAAAA,IAAI,EAAC,cAAA;GAEL/B,eAAAA,gBAAA,CAAAmB,aAAA,CAAA,MAAA,EAAA;AAAMa,IAAAA,CAAC,EAAC,4UAAA;GAA8U,CACnV,CAAC,EAEJ,OAAA,CAAC,eACLhC,gBAAA,CAAAmB,aAAA,CACGd,IAAAA,EAAAA,IAAAA,EAAAA,MAAM,CAACC,IAAI,CAACd,MAAM,CAAC,CAACyC,GAAG,CAAC,UAACC,QAAQ,EAAK;AACrC,IAAA,IAAMC,OAAO,GAAG3C,MAAM,CAAC0C,QAAQ,CAAC,CAAA;IAChC,IAAME,WAAW,GAAG,CAAChD,gBAAgB,EAAED,YAAY,CAAC,CAAC3B,QAAQ,CAAC0E,QAAQ,CAAC,CAAA;AAEvE,IAAA,IAAIE,WAAW,EAAE;MACf,oBAAOpC,gBAAA,CAAAmB,aAAA,CAAA,IAAA,EAAA;AAAIkB,QAAAA,GAAG,EAAEH,QAAS;AAACI,QAAAA,uBAAuB,EAAE;AAAEC,UAAAA,MAAM,EAAEJ,OAAAA;AAAQ,SAAA;AAAE,OAAE,CAAC,CAAA;AAC5E,KAAA;AAEA,IAAA,IAAMK,YAAY,GAAGC,KAAK,CAACC,OAAO,CAACP,OAAO,CAAC,CAAA;IAE3C,IAAMQ,QAAQ,GAAGH,YAAY,GAAGL,OAAO,GAAG,CAACA,OAAO,CAAC,CAAA;AAEnD,IAAA,oBACEnC,gBAAA,CAAAmB,aAAA,CAACnB,gBAAK,CAAC4C,QAAQ,EAAA;AAACP,MAAAA,GAAG,EAAEH,QAAAA;KAClBS,EAAAA,QAAQ,CAACV,GAAG,CAAC,UAACY,YAAY,EAAEC,KAAK,EAAK;AACrC,MAAA,IAAMnC,OAAO,GAAA1B,EAAAA,CAAAA,MAAA,CAAMS,WAAW,CAACwC,QAAQ,CAAC,CAAA,CAAAjD,MAAA,CAAGuD,YAAY,GAAAvD,GAAAA,CAAAA,MAAA,CAAO6D,KAAK,EAAA,GAAA,CAAA,GAAM,EAAE,CAAE,CAAA;MAE7E,oBACE9C,gBAAA,CAAAmB,aAAA,CAAA,IAAA,EAAA;AAAIkB,QAAAA,GAAG,EAAE1B,OAAAA;OACPX,eAAAA,gBAAA,CAAAmB,aAAA,CAAA,GAAA,EAAA;AAAGN,QAAAA,IAAI,EAAA5B,GAAAA,CAAAA,MAAA,CAAM0B,OAAO,CAAG;AAACoC,QAAAA,OAAO,EAAEtC,eAAAA;OAC9BoC,EAAAA,YAAY,EACZF,QAAQ,CAACxE,MAAM,GAAG,CAAC,GAAAc,IAAAA,CAAAA,MAAA,CAAQ6D,KAAK,GAAG,CAAC,EAAA,MAAA,CAAA,CAAA7D,MAAA,CAAO0D,QAAQ,CAACxE,MAAM,EAAA,GAAA,CAAA,GAAMR,SAChE,CACD,CAAC,CAAA;AAET,KAAC,CACa,CAAC,CAAA;GAEpB,CACC,CACa,CAAC,CAAA;AAExB;;;;;"}

package/{src/ErrorSummary/index.js → ErrorSummary/index.d.ts}

@@ -1,2 +1,2 @@
-export { default } from './ErrorSummary';
-export * from './ErrorSummary';
+export { default } from './ErrorSummary';
+export * from './ErrorSummary';

package/ErrorSummary/index.mjs

@@ -0,0 +1,170 @@
+import * as React from 'react';
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : 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 = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
+function getFragmentFromUrl(url) {
+  return url.includes('#') ? url.split('#').pop() : undefined;
+}
+function getAssociatedLegendOrLabel(input) {
+  var _document$querySelect;
+  var fieldset = input.closest('fieldset');
+  if (fieldset) {
+    var legends = fieldset.getElementsByTagName('legend');
+    if (legends.length) {
+      var candidateLegend = legends[0];
+
+      // If the input type is radio or checkbox, always use the legend if there
+      // is one.
+      if (input instanceof HTMLInputElement && (input.type === 'checkbox' || input.type === 'radio')) {
+        return candidateLegend;
+      }
+
+      // For other input types, only scroll to the fieldset’s legend (instead of
+      // the label associated with the input) if the input would end up in the
+      // top half of the screen.
+      //
+      // This should avoid situations where the input either ends up off the
+      // screen, or obscured by a software keyboard.
+      var legendTop = candidateLegend.getBoundingClientRect().top;
+      var inputRect = input.getBoundingClientRect();
+
+      // If the browser doesn't support Element.getBoundingClientRect().height
+      // or window.innerHeight (like IE8), bail and just link to the label.
+      if (inputRect.height && window.innerHeight) {
+        var inputBottom = inputRect.top + inputRect.height;
+        if (inputBottom - legendTop < window.innerHeight / 2) {
+          return candidateLegend;
+        }
+      }
+    }
+  }
+  return (_document$querySelect = document.querySelector("label[for='".concat(input.getAttribute('id'), "']"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : input.closest('label');
+}
+
+var _excluded = ["className", "errors", "mapNameToId"];
+var FormErrorKey = '_form';
+var FINAL_FORM_ERROR = 'FINAL_FORM/form-error';
+function BdsErrorSummary(_ref) {
+  var className = _ref.className,
+    errors = _ref.errors,
+    _ref$mapNameToId = _ref.mapNameToId,
+    mapNameToId = _ref$mapNameToId === void 0 ? function (name) {
+      return name;
+    } : _ref$mapNameToId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var headingId = React.useId();
+  var groupRef = React.useRef(null);
+  React.useEffect(function () {
+    if (!errors || Object.keys(errors).length === 0) return;
+    if (!groupRef.current) return;
+    groupRef.current.focus();
+  }, [errors]);
+  if (!errors || Object.keys(errors).length === 0) return null;
+  var handleLinkClick = function handleLinkClick(e) {
+    var inputId = getFragmentFromUrl(e.currentTarget.href);
+    if (!inputId) {
+      return;
+    }
+    var input = document.getElementById(inputId);
+    if (!input) {
+      return;
+    }
+    var legendOrLabel = getAssociatedLegendOrLabel(input);
+    if (!legendOrLabel) {
+      return;
+    }
+    e.preventDefault();
+    legendOrLabel.scrollIntoView();
+    input.focus({
+      preventScroll: true
+    });
+  };
+  return /*#__PURE__*/React.createElement("bds-error-summary", _extends({
+    className: ['stack', className].filter(function (x) {
+      return x;
+    }).join(' '),
+    role: "group",
+    "aria-labelledby": headingId,
+    ref: groupRef,
+    tabIndex: -1
+  }, props), /*#__PURE__*/React.createElement("h2", {
+    className: "bds-h5",
+    id: headingId
+  }, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    "aria-hidden": "true",
+    height: "1em",
+    width: "1em",
+    fill: "currentColor"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z"
+  })), "Issue"), /*#__PURE__*/React.createElement("ul", null, Object.keys(errors).map(function (errorKey) {
+    var message = errors[errorKey];
+    var isFormError = [FINAL_FORM_ERROR, FormErrorKey].includes(errorKey);
+    if (isFormError) {
+      return /*#__PURE__*/React.createElement("li", {
+        key: errorKey,
+        dangerouslySetInnerHTML: {
+          __html: message
+        }
+      });
+    }
+    var isArrayField = Array.isArray(message);
+    var messages = isArrayField ? message : [message];
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: errorKey
+    }, messages.map(function (fieldMessage, index) {
+      var inputId = "".concat(mapNameToId(errorKey)).concat(isArrayField ? "[".concat(index, "]") : '');
+      return /*#__PURE__*/React.createElement("li", {
+        key: inputId
+      }, /*#__PURE__*/React.createElement("a", {
+        href: "#".concat(inputId),
+        onClick: handleLinkClick
+      }, fieldMessage, messages.length > 1 ? " (".concat(index + 1, " of ").concat(messages.length, ")") : undefined));
+    }));
+  })));
+}
+
+export { FormErrorKey, BdsErrorSummary as default };
+//# sourceMappingURL=index.mjs.map

package/ErrorSummary/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/ErrorSummary/utils.ts","../../src/ErrorSummary/ErrorSummary.tsx"],"sourcesContent":["export function getFragmentFromUrl(url: string) {\r\n  return url.includes('#') ? url.split('#').pop() : undefined;\r\n}\r\n\r\nexport function getAssociatedLegendOrLabel(input: HTMLElement) {\r\n  const fieldset = input.closest('fieldset');\r\n\r\n  if (fieldset) {\r\n    const legends = fieldset.getElementsByTagName('legend');\r\n\r\n    if (legends.length) {\r\n      const candidateLegend = legends[0];\r\n\r\n      // If the input type is radio or checkbox, always use the legend if there\r\n      // is one.\r\n      if (input instanceof HTMLInputElement && (input.type === 'checkbox' || input.type === 'radio')) {\r\n        return candidateLegend;\r\n      }\r\n\r\n      // For other input types, only scroll to the fieldset’s legend (instead of\r\n      // the label associated with the input) if the input would end up in the\r\n      // top half of the screen.\r\n      //\r\n      // This should avoid situations where the input either ends up off the\r\n      // screen, or obscured by a software keyboard.\r\n      const legendTop = candidateLegend.getBoundingClientRect().top;\r\n      const inputRect = input.getBoundingClientRect();\r\n\r\n      // If the browser doesn't support Element.getBoundingClientRect().height\r\n      // or window.innerHeight (like IE8), bail and just link to the label.\r\n      if (inputRect.height && window.innerHeight) {\r\n        const inputBottom = inputRect.top + inputRect.height;\r\n\r\n        if (inputBottom - legendTop < window.innerHeight / 2) {\r\n          return candidateLegend;\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  return document.querySelector(`label[for='${input.getAttribute('id')}']`) ?? input.closest('label');\r\n}\r\n","import * as React from 'react';\r\n\r\nimport { getAssociatedLegendOrLabel, getFragmentFromUrl } from './utils';\r\n\r\ndeclare global {\r\n  namespace JSX {\r\n    interface IntrinsicElements {\r\n      'bds-error-summary': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;\r\n    }\r\n  }\r\n}\r\n\r\nexport const FormErrorKey = '_form';\r\n\r\nconst FINAL_FORM_ERROR = 'FINAL_FORM/form-error';\r\n\r\nexport type ErrorSummaryProps = {\r\n  errors: Record<string, Array<string> | string> | null;\r\n  mapNameToId?: (name: string) => string;\r\n};\r\n\r\nexport default function BdsErrorSummary({\r\n  className,\r\n  errors,\r\n  mapNameToId = (name) => name,\r\n  ...props\r\n}: ErrorSummaryProps & React.ComponentPropsWithoutRef<'div'>) {\r\n  const headingId = React.useId();\r\n  const groupRef = React.useRef<HTMLElement>(null);\r\n\r\n  React.useEffect(() => {\r\n    if (!errors || Object.keys(errors).length === 0) return;\r\n    if (!groupRef.current) return;\r\n\r\n    groupRef.current.focus();\r\n  }, [errors]);\r\n\r\n  if (!errors || Object.keys(errors).length === 0) return null;\r\n\r\n  const handleLinkClick = (e) => {\r\n    const inputId = getFragmentFromUrl(e.currentTarget.href);\r\n\r\n    if (!inputId) {\r\n      return;\r\n    }\r\n\r\n    const input = document.getElementById(inputId);\r\n\r\n    if (!input) {\r\n      return;\r\n    }\r\n\r\n    const legendOrLabel = getAssociatedLegendOrLabel(input);\r\n\r\n    if (!legendOrLabel) {\r\n      return;\r\n    }\r\n\r\n    e.preventDefault();\r\n\r\n    legendOrLabel.scrollIntoView();\r\n    input.focus({ preventScroll: true });\r\n  };\r\n\r\n  return (\r\n    <bds-error-summary\r\n      className={['stack', className].filter((x) => x).join(' ')}\r\n      role=\"group\"\r\n      aria-labelledby={headingId}\r\n      ref={groupRef}\r\n      tabIndex={-1}\r\n      {...props}\r\n    >\r\n      <h2 className=\"bds-h5\" id={headingId}>\r\n        <svg\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          viewBox=\"0 0 512 512\"\r\n          aria-hidden=\"true\"\r\n          height=\"1em\"\r\n          width=\"1em\"\r\n          fill=\"currentColor\"\r\n        >\r\n          <path d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z\" />\r\n        </svg>\r\n        Issue\r\n      </h2>\r\n      <ul>\r\n        {Object.keys(errors).map((errorKey) => {\r\n          const message = errors[errorKey];\r\n          const isFormError = [FINAL_FORM_ERROR, FormErrorKey].includes(errorKey);\r\n\r\n          if (isFormError) {\r\n            return <li key={errorKey} dangerouslySetInnerHTML={{ __html: message }} />;\r\n          }\r\n\r\n          const isArrayField = Array.isArray(message);\r\n\r\n          const messages = isArrayField ? message : [message];\r\n\r\n          return (\r\n            <React.Fragment key={errorKey}>\r\n              {messages.map((fieldMessage, index) => {\r\n                const inputId = `${mapNameToId(errorKey)}${isArrayField ? `[${index}]` : ''}`;\r\n\r\n                return (\r\n                  <li key={inputId}>\r\n                    <a href={`#${inputId}`} onClick={handleLinkClick}>\r\n                      {fieldMessage}\r\n                      {messages.length > 1 ? ` (${index + 1} of ${messages.length})` : undefined}\r\n                    </a>\r\n                  </li>\r\n                );\r\n              })}\r\n            </React.Fragment>\r\n          );\r\n        })}\r\n      </ul>\r\n    </bds-error-summary>\r\n  );\r\n}\r\n"],"names":["getFragmentFromUrl","url","includes","split","pop","undefined","getAssociatedLegendOrLabel","input","_document$querySelect","fieldset","closest","legends","getElementsByTagName","length","candidateLegend","HTMLInputElement","type","legendTop","getBoundingClientRect","top","inputRect","height","window","innerHeight","inputBottom","document","querySelector","concat","getAttribute","FormErrorKey","FINAL_FORM_ERROR","BdsErrorSummary","_ref","className","errors","_ref$mapNameToId","mapNameToId","name","props","_objectWithoutProperties","_excluded","headingId","React","useId","groupRef","useRef","useEffect","Object","keys","current","focus","handleLinkClick","e","inputId","currentTarget","href","getElementById","legendOrLabel","preventDefault","scrollIntoView","preventScroll","createElement","_extends","filter","x","join","role","ref","tabIndex","id","xmlns","viewBox","width","fill","d","map","errorKey","message","isFormError","key","dangerouslySetInnerHTML","__html","isArrayField","Array","isArray","messages","Fragment","fieldMessage","index","onClick"],"mappings":"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"}

package/ErrorSummary/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@iabbb/bds-react/ErrorSummary",
+  "private": true,
+  "main": "../index.cjs",
+  "module": "./index.mjs",
+  "types": "./index.d.ts"
+}

package/ErrorSummary/utils.d.ts

@@ -0,0 +1,2 @@
+export declare function getFragmentFromUrl(url: string): string | undefined;
+export declare function getAssociatedLegendOrLabel(input: HTMLElement): Element | null;

package/FieldTextInput/FieldTextInput.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+export declare type FieldTextInputProps<C> = {
+    as?: C;
+    error?: string;
+    hint?: string;
+    id?: string;
+    isOptional?: boolean;
+    label: string;
+};
+export default function FieldTextInput<C extends React.ElementType>({ as, error, hint, id, isOptional, label, ...props }: FieldTextInputProps<C> & React.ComponentPropsWithoutRef<C>): React.JSX.Element;

package/FieldTextInput/index.cjs

@@ -0,0 +1,109 @@
+'use strict';
+
+var React = require('react');
+
+function _interopNamespaceDefault(e) {
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : 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 = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
+var _excluded = ["as", "error", "hint", "id", "isOptional", "label"];
+function FieldTextInput(_ref) {
+  var _id;
+  var as = _ref.as,
+    error = _ref.error,
+    hint = _ref.hint,
+    id = _ref.id,
+    _ref$isOptional = _ref.isOptional,
+    isOptional = _ref$isOptional === void 0 ? false : _ref$isOptional,
+    label = _ref.label,
+    props = _objectWithoutProperties(_ref, _excluded);
+  id = (_id = id) !== null && _id !== void 0 ? _id : props.name;
+  var errorId = React__namespace.useId();
+  var hintId = React__namespace.useId();
+  var InputComponent = as !== null && as !== void 0 ? as : 'input';
+  return /*#__PURE__*/React__namespace.createElement("div", {
+    className: "bds-text-input stack"
+  }, /*#__PURE__*/React__namespace.createElement("label", {
+    htmlFor: id
+  }, label, isOptional && ' (optional)'), hint && /*#__PURE__*/React__namespace.createElement("span", {
+    className: "bds-hint",
+    id: hintId
+  }, hint), error && /*#__PURE__*/React__namespace.createElement("span", {
+    className: "bds-error",
+    id: errorId
+  }, /*#__PURE__*/React__namespace.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    "aria-hidden": "true",
+    height: "1em",
+    width: "1em",
+    fill: "currentColor"
+  }, /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z"
+  })), error), /*#__PURE__*/React__namespace.createElement(InputComponent, _extends({
+    "aria-invalid": error ? true : undefined,
+    "aria-describedby": error && hint ? "".concat(hintId, " ").concat(errorId) : error ? errorId : hint ? hintId : undefined,
+    "aria-required": isOptional ? undefined : true,
+    id: id
+  }, props)));
+}
+
+module.exports = FieldTextInput;
+//# sourceMappingURL=index.cjs.map

package/FieldTextInput/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/FieldTextInput/FieldTextInput.tsx"],"sourcesContent":["import * as React from 'react';\r\n\r\nexport type FieldTextInputProps<C> = {\r\n  as?: C;\r\n  error?: string;\r\n  hint?: string;\r\n  id?: string;\r\n  isOptional?: boolean;\r\n  label: string;\r\n};\r\n\r\nexport default function FieldTextInput<C extends React.ElementType>({\r\n  as,\r\n  error,\r\n  hint,\r\n  id,\r\n  isOptional = false,\r\n  label,\r\n  ...props\r\n}: FieldTextInputProps<C> & React.ComponentPropsWithoutRef<C>) {\r\n  id = id ?? props.name;\r\n\r\n  const errorId = React.useId();\r\n  const hintId = React.useId();\r\n\r\n  const InputComponent = as ?? 'input';\r\n\r\n  return (\r\n    <div className=\"bds-text-input stack\">\r\n      <label htmlFor={id}>\r\n        {label}\r\n        {isOptional && ' (optional)'}\r\n      </label>\r\n      {hint && (\r\n        <span className=\"bds-hint\" id={hintId}>\r\n          {hint}\r\n        </span>\r\n      )}\r\n      {error && (\r\n        <span className=\"bds-error\" id={errorId}>\r\n          <svg\r\n            xmlns=\"http://www.w3.org/2000/svg\"\r\n            viewBox=\"0 0 512 512\"\r\n            aria-hidden=\"true\"\r\n            height=\"1em\"\r\n            width=\"1em\"\r\n            fill=\"currentColor\"\r\n          >\r\n            <path d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z\" />\r\n          </svg>\r\n          {error}\r\n        </span>\r\n      )}\r\n      <InputComponent\r\n        aria-invalid={error ? true : undefined}\r\n        aria-describedby={error && hint ? `${hintId} ${errorId}` : error ? errorId : hint ? hintId : undefined}\r\n        aria-required={isOptional ? undefined : true}\r\n        id={id}\r\n        {...props}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n"],"names":["FieldTextInput","_ref","_id","as","error","hint","id","_ref$isOptional","isOptional","label","props","_objectWithoutProperties","_excluded","name","errorId","React","useId","hintId","InputComponent","createElement","className","htmlFor","xmlns","viewBox","height","width","fill","d","_extends","undefined","concat"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWe,SAASA,cAAcA,CAAAC,IAAA,EAQyB;AAAA,EAAA,IAAAC,GAAA,CAAA;AAAA,EAAA,IAP7DC,EAAE,GAAAF,IAAA,CAAFE,EAAE;IACFC,KAAK,GAAAH,IAAA,CAALG,KAAK;IACLC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IACJC,EAAE,GAAAL,IAAA,CAAFK,EAAE;IAAAC,eAAA,GAAAN,IAAA,CACFO,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,eAAA;IAClBE,KAAK,GAAAR,IAAA,CAALQ,KAAK;AACFC,IAAAA,KAAK,GAAAC,wBAAA,CAAAV,IAAA,EAAAW,SAAA,CAAA,CAAA;EAERN,EAAE,GAAA,CAAAJ,GAAA,GAAGI,EAAE,MAAA,IAAA,IAAAJ,GAAA,KAAA,KAAA,CAAA,GAAAA,GAAA,GAAIQ,KAAK,CAACG,IAAI,CAAA;AAErB,EAAA,IAAMC,OAAO,GAAGC,gBAAK,CAACC,KAAK,EAAE,CAAA;AAC7B,EAAA,IAAMC,MAAM,GAAGF,gBAAK,CAACC,KAAK,EAAE,CAAA;EAE5B,IAAME,cAAc,GAAGf,EAAE,KAAA,IAAA,IAAFA,EAAE,KAAFA,KAAAA,CAAAA,GAAAA,EAAE,GAAI,OAAO,CAAA;EAEpC,oBACEY,gBAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,sBAAA;GACbL,eAAAA,gBAAA,CAAAI,aAAA,CAAA,OAAA,EAAA;AAAOE,IAAAA,OAAO,EAAEf,EAAAA;GACbG,EAAAA,KAAK,EACLD,UAAU,IAAI,aACV,CAAC,EACPH,IAAI,iBACHU,gBAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC,UAAU;AAACd,IAAAA,EAAE,EAAEW,MAAAA;AAAO,GAAA,EACnCZ,IACG,CACP,EACAD,KAAK,iBACJW,gBAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC,WAAW;AAACd,IAAAA,EAAE,EAAEQ,OAAAA;GAC9BC,eAAAA,gBAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;AACEG,IAAAA,KAAK,EAAC,4BAA4B;AAClCC,IAAAA,OAAO,EAAC,aAAa;AACrB,IAAA,aAAA,EAAY,MAAM;AAClBC,IAAAA,MAAM,EAAC,KAAK;AACZC,IAAAA,KAAK,EAAC,KAAK;AACXC,IAAAA,IAAI,EAAC,cAAA;GAELX,eAAAA,gBAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMQ,IAAAA,CAAC,EAAC,4UAAA;AAA4U,GAAE,CACnV,CAAC,EACLvB,KACG,CACP,eACDW,gBAAA,CAAAI,aAAA,CAACD,cAAc,EAAAU,QAAA,CAAA;AACb,IAAA,cAAA,EAAcxB,KAAK,GAAG,IAAI,GAAGyB,SAAU;IACvC,kBAAkBzB,EAAAA,KAAK,IAAIC,IAAI,GAAA,EAAA,CAAAyB,MAAA,CAAMb,MAAM,OAAAa,MAAA,CAAIhB,OAAO,CAAKV,GAAAA,KAAK,GAAGU,OAAO,GAAGT,IAAI,GAAGY,MAAM,GAAGY,SAAU;AACvG,IAAA,eAAA,EAAerB,UAAU,GAAGqB,SAAS,GAAG,IAAK;AAC7CvB,IAAAA,EAAE,EAAEA,EAAAA;GACAI,EAAAA,KAAK,CACV,CACE,CAAC,CAAA;AAEV;;;;"}

package/{src/FieldTextInput/index.js → FieldTextInput/index.d.ts}

@@ -1 +1 @@
-export { default } from './FieldTextInput';
+export { default } from './FieldTextInput';

package/FieldTextInput/index.mjs

@@ -0,0 +1,88 @@
+import * as React from 'react';
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : 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 = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
+var _excluded = ["as", "error", "hint", "id", "isOptional", "label"];
+function FieldTextInput(_ref) {
+  var _id;
+  var as = _ref.as,
+    error = _ref.error,
+    hint = _ref.hint,
+    id = _ref.id,
+    _ref$isOptional = _ref.isOptional,
+    isOptional = _ref$isOptional === void 0 ? false : _ref$isOptional,
+    label = _ref.label,
+    props = _objectWithoutProperties(_ref, _excluded);
+  id = (_id = id) !== null && _id !== void 0 ? _id : props.name;
+  var errorId = React.useId();
+  var hintId = React.useId();
+  var InputComponent = as !== null && as !== void 0 ? as : 'input';
+  return /*#__PURE__*/React.createElement("div", {
+    className: "bds-text-input stack"
+  }, /*#__PURE__*/React.createElement("label", {
+    htmlFor: id
+  }, label, isOptional && ' (optional)'), hint && /*#__PURE__*/React.createElement("span", {
+    className: "bds-hint",
+    id: hintId
+  }, hint), error && /*#__PURE__*/React.createElement("span", {
+    className: "bds-error",
+    id: errorId
+  }, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    "aria-hidden": "true",
+    height: "1em",
+    width: "1em",
+    fill: "currentColor"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z"
+  })), error), /*#__PURE__*/React.createElement(InputComponent, _extends({
+    "aria-invalid": error ? true : undefined,
+    "aria-describedby": error && hint ? "".concat(hintId, " ").concat(errorId) : error ? errorId : hint ? hintId : undefined,
+    "aria-required": isOptional ? undefined : true,
+    id: id
+  }, props)));
+}
+
+export { FieldTextInput as default };
+//# sourceMappingURL=index.mjs.map

package/FieldTextInput/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/FieldTextInput/FieldTextInput.tsx"],"sourcesContent":["import * as React from 'react';\r\n\r\nexport type FieldTextInputProps<C> = {\r\n  as?: C;\r\n  error?: string;\r\n  hint?: string;\r\n  id?: string;\r\n  isOptional?: boolean;\r\n  label: string;\r\n};\r\n\r\nexport default function FieldTextInput<C extends React.ElementType>({\r\n  as,\r\n  error,\r\n  hint,\r\n  id,\r\n  isOptional = false,\r\n  label,\r\n  ...props\r\n}: FieldTextInputProps<C> & React.ComponentPropsWithoutRef<C>) {\r\n  id = id ?? props.name;\r\n\r\n  const errorId = React.useId();\r\n  const hintId = React.useId();\r\n\r\n  const InputComponent = as ?? 'input';\r\n\r\n  return (\r\n    <div className=\"bds-text-input stack\">\r\n      <label htmlFor={id}>\r\n        {label}\r\n        {isOptional && ' (optional)'}\r\n      </label>\r\n      {hint && (\r\n        <span className=\"bds-hint\" id={hintId}>\r\n          {hint}\r\n        </span>\r\n      )}\r\n      {error && (\r\n        <span className=\"bds-error\" id={errorId}>\r\n          <svg\r\n            xmlns=\"http://www.w3.org/2000/svg\"\r\n            viewBox=\"0 0 512 512\"\r\n            aria-hidden=\"true\"\r\n            height=\"1em\"\r\n            width=\"1em\"\r\n            fill=\"currentColor\"\r\n          >\r\n            <path d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z\" />\r\n          </svg>\r\n          {error}\r\n        </span>\r\n      )}\r\n      <InputComponent\r\n        aria-invalid={error ? true : undefined}\r\n        aria-describedby={error && hint ? `${hintId} ${errorId}` : error ? errorId : hint ? hintId : undefined}\r\n        aria-required={isOptional ? undefined : true}\r\n        id={id}\r\n        {...props}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n"],"names":["FieldTextInput","_ref","_id","as","error","hint","id","_ref$isOptional","isOptional","label","props","_objectWithoutProperties","_excluded","name","errorId","React","useId","hintId","InputComponent","createElement","className","htmlFor","xmlns","viewBox","height","width","fill","d","_extends","undefined","concat"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWe,SAASA,cAAcA,CAAAC,IAAA,EAQyB;AAAA,EAAA,IAAAC,GAAA,CAAA;AAAA,EAAA,IAP7DC,EAAE,GAAAF,IAAA,CAAFE,EAAE;IACFC,KAAK,GAAAH,IAAA,CAALG,KAAK;IACLC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IACJC,EAAE,GAAAL,IAAA,CAAFK,EAAE;IAAAC,eAAA,GAAAN,IAAA,CACFO,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,eAAA;IAClBE,KAAK,GAAAR,IAAA,CAALQ,KAAK;AACFC,IAAAA,KAAK,GAAAC,wBAAA,CAAAV,IAAA,EAAAW,SAAA,CAAA,CAAA;EAERN,EAAE,GAAA,CAAAJ,GAAA,GAAGI,EAAE,MAAA,IAAA,IAAAJ,GAAA,KAAA,KAAA,CAAA,GAAAA,GAAA,GAAIQ,KAAK,CAACG,IAAI,CAAA;AAErB,EAAA,IAAMC,OAAO,GAAGC,KAAK,CAACC,KAAK,EAAE,CAAA;AAC7B,EAAA,IAAMC,MAAM,GAAGF,KAAK,CAACC,KAAK,EAAE,CAAA;EAE5B,IAAME,cAAc,GAAGf,EAAE,KAAA,IAAA,IAAFA,EAAE,KAAFA,KAAAA,CAAAA,GAAAA,EAAE,GAAI,OAAO,CAAA;EAEpC,oBACEY,KAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,sBAAA;GACbL,eAAAA,KAAA,CAAAI,aAAA,CAAA,OAAA,EAAA;AAAOE,IAAAA,OAAO,EAAEf,EAAAA;GACbG,EAAAA,KAAK,EACLD,UAAU,IAAI,aACV,CAAC,EACPH,IAAI,iBACHU,KAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC,UAAU;AAACd,IAAAA,EAAE,EAAEW,MAAAA;AAAO,GAAA,EACnCZ,IACG,CACP,EACAD,KAAK,iBACJW,KAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC,WAAW;AAACd,IAAAA,EAAE,EAAEQ,OAAAA;GAC9BC,eAAAA,KAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;AACEG,IAAAA,KAAK,EAAC,4BAA4B;AAClCC,IAAAA,OAAO,EAAC,aAAa;AACrB,IAAA,aAAA,EAAY,MAAM;AAClBC,IAAAA,MAAM,EAAC,KAAK;AACZC,IAAAA,KAAK,EAAC,KAAK;AACXC,IAAAA,IAAI,EAAC,cAAA;GAELX,eAAAA,KAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMQ,IAAAA,CAAC,EAAC,4UAAA;AAA4U,GAAE,CACnV,CAAC,EACLvB,KACG,CACP,eACDW,KAAA,CAAAI,aAAA,CAACD,cAAc,EAAAU,QAAA,CAAA;AACb,IAAA,cAAA,EAAcxB,KAAK,GAAG,IAAI,GAAGyB,SAAU;IACvC,kBAAkBzB,EAAAA,KAAK,IAAIC,IAAI,GAAA,EAAA,CAAAyB,MAAA,CAAMb,MAAM,OAAAa,MAAA,CAAIhB,OAAO,CAAKV,GAAAA,KAAK,GAAGU,OAAO,GAAGT,IAAI,GAAGY,MAAM,GAAGY,SAAU;AACvG,IAAA,eAAA,EAAerB,UAAU,GAAGqB,SAAS,GAAG,IAAK;AAC7CvB,IAAAA,EAAE,EAAEA,EAAAA;GACAI,EAAAA,KAAK,CACV,CACE,CAAC,CAAA;AAEV;;;;"}

package/FieldTextInput/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@iabbb/bds-react/FieldTextInput",
+  "private": true,
+  "main": "../index.cjs",
+  "module": "./index.mjs",
+  "types": "./index.d.ts"
+}

package/Pagination/Pagination.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+export declare type PaginationProps = {
+    buildPageUrl: (page: number) => string;
+    currentPage: number;
+    onPageClick?: (page: number) => void;
+    totalPages: number;
+};
+export default function Pagination({ buildPageUrl, className, currentPage, onPageClick, totalPages, ...props }: PaginationProps & React.ComponentPropsWithoutRef<'nav'>): React.JSX.Element;