@nattstack/ui 0.0.41 → 0.0.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -129,10 +129,12 @@ declare const LABEL_CLASS_NAME: {
129
129
  //#region src/components/otp-field/otp-field.d.ts
130
130
  interface OTPFieldProps extends Omit<OTPFieldPreview.Root.Props, "disabled"> {
131
131
  isDisabled?: OTPFieldPreview.Root.Props["disabled"];
132
+ isMasked?: OTPFieldPreview.Root.Props["mask"];
132
133
  }
133
134
  declare function OTPField(props: OTPFieldProps): JSX.Element;
134
135
  declare const OTP_FIELD_CLASS_NAME: {
135
136
  readonly BASE: string;
137
+ readonly MASKED: string;
136
138
  };
137
139
  //#endregion
138
140
  //#region src/components/otp-field/otp-field-input.d.ts
@@ -317,22 +317,30 @@ function Label(props) {
317
317
  const LABEL_CLASS_NAME = { BASE: label_module_default.label };
318
318
  //#endregion
319
319
  //#region src/components/otp-field/otp-field.module.css
320
- var otp_field_module_default = { "otp_field": "otp-field-module_otp_field_l-Sakq" };
320
+ var otp_field_module_default = {
321
+ "otp_field": "otp-field-module_otp_field_l-Sakq",
322
+ "otp_field__masked": "otp-field-module_otp_field__masked_l-Sakq"
323
+ };
321
324
  //#endregion
322
325
  //#region src/components/otp-field/otp-field.tsx
323
326
  function OTPField(props) {
324
- const { className: customClassName = "", isDisabled = false, ...rest } = props;
327
+ const { className: customClassName = "", isDisabled = false, isMasked = false, ...rest } = props;
325
328
  const combinedClassName = normalizeWhitespace(`
326
329
  ${OTP_FIELD_CLASS_NAME.BASE}
330
+ ${isMasked ? OTP_FIELD_CLASS_NAME.MASKED : ""}
327
331
  ${customClassName}
328
332
  `);
329
333
  return /* @__PURE__ */ jsx(OTPFieldPreview.Root, {
330
334
  className: combinedClassName,
331
335
  disabled: isDisabled,
336
+ mask: isMasked,
332
337
  ...rest
333
338
  });
334
339
  }
335
- const OTP_FIELD_CLASS_NAME = { BASE: otp_field_module_default.otp_field };
340
+ const OTP_FIELD_CLASS_NAME = {
341
+ BASE: otp_field_module_default.otp_field,
342
+ MASKED: otp_field_module_default.otp_field__masked
343
+ };
336
344
  //#endregion
337
345
  //#region src/components/otp-field/otp-field-input.module.css
338
346
  var otp_field_input_module_default = { "otp_field_input": "otp-field-input-module_otp_field_input_58X00q" };
@@ -441,6 +441,10 @@
441
441
  width: fit-content;
442
442
  display: flex;
443
443
  }
444
+
445
+ .otp-field-module_otp_field__masked_l-Sakq > input {
446
+ font-family: var(--font-code);
447
+ }
444
448
  .otp-field-input-module_otp_field_input_58X00q {
445
449
  background-color: var(--color-gray-3);
446
450
  box-shadow: 0 0 0 1px var(--color-border) inset;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nattstack/ui",
3
- "version": "0.0.41",
3
+ "version": "0.0.43",
4
4
  "description": "A collection of reusable React components built with Base UI, TypeScript, and CSS Modules",
5
5
  "keywords": [
6
6
  "base-ui",