@ory/elements-react 1.0.0-next.2 → 1.0.0-next.4

package/dist/theme/default/index.d.mts

@@ -63,7 +63,7 @@ type HeadlessFormProps = ComponentPropsWithoutRef<"form"> & {
 type HeadlessInputProps = {
     attributes: UiNodeInputAttributes;
     node: UiNode;
-    onClick: MouseEventHandler;
+    onClick?: MouseEventHandler;
 };
 type OryFlowComponents = OryFormComponents & OryCardComponents;
 

package/dist/theme/default/index.d.ts

@@ -63,7 +63,7 @@ type HeadlessFormProps = ComponentPropsWithoutRef<"form"> & {
 type HeadlessInputProps = {
     attributes: UiNodeInputAttributes;
     node: UiNode;
-    onClick: MouseEventHandler;
+    onClick?: MouseEventHandler;
 };
 type OryFlowComponents = OryFormComponents & OryCardComponents;
 

package/dist/theme/default/index.js

@@ -213,7 +213,7 @@ var require_react_is_development = __commonJS({
         var ContextProvider = REACT_PROVIDER_TYPE;
         var Element = REACT_ELEMENT_TYPE;
         var ForwardRef = REACT_FORWARD_REF_TYPE;
-        var Fragment6 = REACT_FRAGMENT_TYPE;
+        var Fragment7 = REACT_FRAGMENT_TYPE;
         var Lazy = REACT_LAZY_TYPE;
         var Memo = REACT_MEMO_TYPE;
         var Portal = REACT_PORTAL_TYPE;
@@ -272,7 +272,7 @@ var require_react_is_development = __commonJS({
         exports2.ContextProvider = ContextProvider;
         exports2.Element = Element;
         exports2.ForwardRef = ForwardRef;
-        exports2.Fragment = Fragment6;
+        exports2.Fragment = Fragment7;
         exports2.Lazy = Lazy;
         exports2.Memo = Memo;
         exports2.Portal = Portal;
@@ -622,9 +622,11 @@ function parseDateTimeSkeleton(skeleton) {
   skeleton.replace(DATE_TIME_REGEX, function(match) {
     var len = match.length;
     switch (match[0]) {
+      // Era
       case "G":
         result.era = len === 4 ? "long" : len === 5 ? "narrow" : "short";
         break;
+      // Year
       case "y":
         result.year = len === 2 ? "2-digit" : "numeric";
         break;
@@ -633,13 +635,16 @@ function parseDateTimeSkeleton(skeleton) {
       case "U":
       case "r":
         throw new RangeError("`Y/u/U/r` (year) patterns are not supported, use `y` instead");
+      // Quarter
       case "q":
       case "Q":
         throw new RangeError("`q/Q` (quarter) patterns are not supported");
+      // Month
       case "M":
       case "L":
         result.month = ["numeric", "2-digit", "short", "long", "narrow"][len - 1];
         break;
+      // Week
       case "w":
       case "W":
         throw new RangeError("`w/W` (week) patterns are not supported");
@@ -650,6 +655,7 @@ function parseDateTimeSkeleton(skeleton) {
       case "F":
       case "g":
         throw new RangeError("`D/F/g` (day) patterns are not supported, use `d` instead");
+      // Weekday
       case "E":
         result.weekday = len === 4 ? "short" : len === 5 ? "narrow" : "short";
         break;
@@ -665,12 +671,15 @@ function parseDateTimeSkeleton(skeleton) {
         }
         result.weekday = ["short", "long", "narrow", "short"][len - 4];
         break;
+      // Period
       case "a":
         result.hour12 = true;
         break;
       case "b":
+      // am, pm, noon, midnight
       case "B":
         throw new RangeError("`b/B` (period) patterns are not supported, use `a` instead");
+      // Hour
       case "h":
         result.hourCycle = "h12";
         result.hour = ["numeric", "2-digit"][len - 1];
@@ -691,23 +700,31 @@ function parseDateTimeSkeleton(skeleton) {
       case "J":
       case "C":
         throw new RangeError("`j/J/C` (hour) patterns are not supported, use `h/H/K/k` instead");
+      // Minute
       case "m":
         result.minute = ["numeric", "2-digit"][len - 1];
         break;
+      // Second
       case "s":
         result.second = ["numeric", "2-digit"][len - 1];
         break;
       case "S":
       case "A":
         throw new RangeError("`S/A` (second) patterns are not supported, use `s` instead");
+      // Zone
       case "z":
         result.timeZoneName = len < 4 ? "short" : "long";
         break;
       case "Z":
+      // 1..3, 4, 5: The ISO8601 varios formats
       case "O":
+      // 1, 4: miliseconds in day short, long
       case "v":
+      // 1, 4: generic non-location format
       case "V":
+      // 1, 2, 3, 4: time zone ID or city
       case "X":
+      // 1, 2, 3, 4: The ISO8601 varios formats
       case "x":
         throw new RangeError("`Z/O/v/V/X/x` (timeZone) patterns are not supported, use `z` instead");
     }
@@ -905,6 +922,7 @@ function parseNumberSkeleton(tokens) {
       case "notation-simple":
         result.notation = "standard";
         continue;
+      // https://github.com/unicode-org/icu/blob/master/icu4c/source/i18n/unicode/unumberformatter.h
       case "unit-width-narrow":
         result.currencyDisplay = "narrowSymbol";
         result.unitDisplay = "narrow";
@@ -923,6 +941,7 @@ function parseNumberSkeleton(tokens) {
       case "scale":
         result.scale = parseFloat(token.options[0]);
         continue;
+      // https://unicode-org.github.io/icu/userguide/format_parse/numbers/skeletons.html#integer-width
       case "integer-width":
         if (token.options.length > 1) {
           throw new RangeError("integer-width stems only accept a single optional option");
@@ -2685,6 +2704,7 @@ var Parser = (
           this.bump();
           this.bump();
           return "'";
+        // '{', '<', '>', '}'
         case 123:
         case 60:
         case 62:
@@ -2750,6 +2770,7 @@ var Parser = (
         return this.error(ErrorKind.EXPECT_ARGUMENT_CLOSING_BRACE, createLocation(openingBracePosition, this.clonePosition()));
       }
       switch (this.char()) {
+        // Simple argument: `{name}`
         case 125: {
           this.bump();
           return {
@@ -2762,6 +2783,7 @@ var Parser = (
             err: null
           };
         }
+        // Argument with options: `{name, format, ...}`
         case 44: {
           this.bump();
           this.bumpSpace();
@@ -4035,9 +4057,11 @@ function parseDateTimeSkeleton2(skeleton) {
   skeleton.replace(DATE_TIME_REGEX2, function(match) {
     var len = match.length;
     switch (match[0]) {
+      // Era
       case "G":
         result.era = len === 4 ? "long" : len === 5 ? "narrow" : "short";
         break;
+      // Year
       case "y":
         result.year = len === 2 ? "2-digit" : "numeric";
         break;
@@ -4046,13 +4070,16 @@ function parseDateTimeSkeleton2(skeleton) {
       case "U":
       case "r":
         throw new RangeError("`Y/u/U/r` (year) patterns are not supported, use `y` instead");
+      // Quarter
       case "q":
       case "Q":
         throw new RangeError("`q/Q` (quarter) patterns are not supported");
+      // Month
       case "M":
       case "L":
         result.month = ["numeric", "2-digit", "short", "long", "narrow"][len - 1];
         break;
+      // Week
       case "w":
       case "W":
         throw new RangeError("`w/W` (week) patterns are not supported");
@@ -4063,6 +4090,7 @@ function parseDateTimeSkeleton2(skeleton) {
       case "F":
       case "g":
         throw new RangeError("`D/F/g` (day) patterns are not supported, use `d` instead");
+      // Weekday
       case "E":
         result.weekday = len === 4 ? "short" : len === 5 ? "narrow" : "short";
         break;
@@ -4078,12 +4106,15 @@ function parseDateTimeSkeleton2(skeleton) {
         }
         result.weekday = ["short", "long", "narrow", "short"][len - 4];
         break;
+      // Period
       case "a":
         result.hour12 = true;
         break;
       case "b":
+      // am, pm, noon, midnight
       case "B":
         throw new RangeError("`b/B` (period) patterns are not supported, use `a` instead");
+      // Hour
       case "h":
         result.hourCycle = "h12";
         result.hour = ["numeric", "2-digit"][len - 1];
@@ -4104,23 +4135,31 @@ function parseDateTimeSkeleton2(skeleton) {
       case "J":
       case "C":
         throw new RangeError("`j/J/C` (hour) patterns are not supported, use `h/H/K/k` instead");
+      // Minute
       case "m":
         result.minute = ["numeric", "2-digit"][len - 1];
         break;
+      // Second
       case "s":
         result.second = ["numeric", "2-digit"][len - 1];
         break;
       case "S":
       case "A":
         throw new RangeError("`S/A` (second) patterns are not supported, use `s` instead");
+      // Zone
       case "z":
         result.timeZoneName = len < 4 ? "short" : "long";
         break;
       case "Z":
+      // 1..3, 4, 5: The ISO8601 varios formats
       case "O":
+      // 1, 4: miliseconds in day short, long
       case "v":
+      // 1, 4: generic non-location format
       case "V":
+      // 1, 2, 3, 4: time zone ID or city
       case "X":
+      // 1, 2, 3, 4: The ISO8601 varios formats
       case "x":
         throw new RangeError("`Z/O/v/V/X/x` (timeZone) patterns are not supported, use `z` instead");
     }
@@ -4318,6 +4357,7 @@ function parseNumberSkeleton2(tokens) {
       case "notation-simple":
         result.notation = "standard";
         continue;
+      // https://github.com/unicode-org/icu/blob/master/icu4c/source/i18n/unicode/unumberformatter.h
       case "unit-width-narrow":
         result.currencyDisplay = "narrowSymbol";
         result.unitDisplay = "narrow";
@@ -4336,6 +4376,7 @@ function parseNumberSkeleton2(tokens) {
       case "scale":
         result.scale = parseFloat(token.options[0]);
         continue;
+      // https://unicode-org.github.io/icu/userguide/format_parse/numbers/skeletons.html#integer-width
       case "integer-width":
         if (token.options.length > 1) {
           throw new RangeError("integer-width stems only accept a single optional option");
@@ -6098,6 +6139,7 @@ var Parser2 = (
           this.bump();
           this.bump();
           return "'";
+        // '{', '<', '>', '}'
         case 123:
         case 60:
         case 62:
@@ -6163,6 +6205,7 @@ var Parser2 = (
         return this.error(ErrorKind2.EXPECT_ARGUMENT_CLOSING_BRACE, createLocation2(openingBracePosition, this.clonePosition()));
       }
       switch (this.char()) {
+        // Simple argument: `{name}`
         case 125: {
           this.bump();
           return {
@@ -6175,6 +6218,7 @@ var Parser2 = (
             err: null
           };
         }
+        // Argument with options: `{name, format, ...}`
         case 44: {
           this.bump();
           this.bumpSpace();
@@ -10039,9 +10083,13 @@ function DefaultText({ node, attributes }) {
 // src/theme/default/components/card/current-identifier-button.tsx
 var import_jsx_runtime44 = require("react/jsx-runtime");
 function DefaultCurrentIdentifierButton({
-  attributes
+  attributes,
+  node
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "py-1 px-3 rounded-full border border-button-identifier-border-default bg-button-identifier-bg-default", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-sm font-medium leading-none", children: attributes.value }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "py-1 px-3 rounded-full border border-button-identifier-border-default bg-button-identifier-bg-default", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-sm font-medium leading-none", children: attributes.value }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(DefaultInput, { attributes, node })
+  ] });
 }
 
 // src/theme/default/components/default-components.tsx
@@ -10200,17 +10248,23 @@ var NodeInput = ({
         }
       );
     case import_client_fetch13.UiNodeInputAttributesTypeEnum.Hidden:
-      if (isCurrentIdentifier) {
-        return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Components.CurrentIdentifierButton, { attributes: attrs, node });
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
-        Components.Input,
-        {
-          attributes: attrs,
-          node,
-          onClick: handleClick
-        }
-      );
+      return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_jsx_runtime46.Fragment, { children: [
+        isCurrentIdentifier && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+          Components.CurrentIdentifierButton,
+          {
+            attributes: attrs,
+            node
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+          Components.Input,
+          {
+            attributes: attrs,
+            node,
+            onClick: handleClick
+          }
+        )
+      ] });
     default:
       if (isPinCodeInput) {
         return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Components.Label, { attributes: attrs, node, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(