@wistia/ui 0.6.26 → 0.6.27

package/dist/index.d.mts

@@ -217,7 +217,7 @@ type BaseButtonProps = {
      *
      * @type ReactNode
      */
-    children?: ReactNode;
+    children: ReactNode;
     /**
      * Sets the [color scheme](../?path=/docs/docs-color-schemes--docs)
      */
@@ -283,6 +283,9 @@ type ButtonAsLinkProps = BaseButtonProps & ComponentPropsWithRef<'a'> & LinkProp
     type?: LinkTypes;
 };
 type ButtonAsButtonProps = BaseButtonProps & ComponentPropsWithRef<'button'> & {
+    /**
+     * If supplied, the button will render as a link
+     */
     href?: never;
     type?: 'button' | 'reset' | 'submit';
     children: ReactNode;
@@ -384,11 +387,18 @@ declare const useWindowSize: (interval?: number) => {
 };
 
 type ActionButtonProps = {
+    /**
+     * @override
+     * The text to display for the ActionButton
+     *
+     */
+    children: ReactNode;
     /**
      * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
+     * @override
      * Disables the button
      */
     disabled?: boolean;
@@ -405,11 +415,18 @@ type ActionButtonProps = {
  * Action Button component is used as one of a group of main actions on the page. It composes [Button]().
  */
 declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
+    /**
+     * @override
+     * The text to display for the ActionButton
+     *
+     */
+    children: ReactNode;
     /**
      * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
+     * @override
      * Disables the button
      */
     disabled?: boolean;
@@ -422,11 +439,18 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
      */
     variant?: "default" | "gated" | "menu-down" | "menu-up";
 } & Omit<ButtonAsButtonProps, "size" | "leftIcon" | "rightIcon" | "isLoading" | "fullWidth" | "unstyled" | "variant">, "ref"> | Omit<{
+    /**
+     * @override
+     * The text to display for the ActionButton
+     *
+     */
+    children: ReactNode;
     /**
      * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
+     * @override
      * Disables the button
      */
     disabled?: boolean;
@@ -1127,7 +1151,7 @@ type FormProps<T> = Omit<ComponentPropsWithoutRef<'form'>, 'action' | 'aria-labe
      * Sets the default label position for all `FormFields` within the form. Will be ignored if labelPosition
      * is set on the `FormField` itself.
      */
-    labelPosition?: 'block' | 'inline';
+    labelPosition?: 'block' | 'inline-compact' | 'inline';
     /**
      * The form elements used in the form
      */
@@ -1193,7 +1217,7 @@ type FormFieldProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * Setting to `inline` will have the label and input appear on the same line. Setting to `block` will have the label above the input.
      */
-    labelPosition?: 'block' | 'inline';
+    labelPosition?: 'block' | 'inline-compact' | 'inline';
 };
 /**
  * Component description goes here

package/dist/index.d.ts

@@ -217,7 +217,7 @@ type BaseButtonProps = {
      *
      * @type ReactNode
      */
-    children?: ReactNode;
+    children: ReactNode;
     /**
      * Sets the [color scheme](../?path=/docs/docs-color-schemes--docs)
      */
@@ -283,6 +283,9 @@ type ButtonAsLinkProps = BaseButtonProps & ComponentPropsWithRef<'a'> & LinkProp
     type?: LinkTypes;
 };
 type ButtonAsButtonProps = BaseButtonProps & ComponentPropsWithRef<'button'> & {
+    /**
+     * If supplied, the button will render as a link
+     */
     href?: never;
     type?: 'button' | 'reset' | 'submit';
     children: ReactNode;
@@ -384,11 +387,18 @@ declare const useWindowSize: (interval?: number) => {
 };
 
 type ActionButtonProps = {
+    /**
+     * @override
+     * The text to display for the ActionButton
+     *
+     */
+    children: ReactNode;
     /**
      * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
+     * @override
      * Disables the button
      */
     disabled?: boolean;
@@ -405,11 +415,18 @@ type ActionButtonProps = {
  * Action Button component is used as one of a group of main actions on the page. It composes [Button]().
  */
 declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
+    /**
+     * @override
+     * The text to display for the ActionButton
+     *
+     */
+    children: ReactNode;
     /**
      * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
+     * @override
      * Disables the button
      */
     disabled?: boolean;
@@ -422,11 +439,18 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
      */
     variant?: "default" | "gated" | "menu-down" | "menu-up";
 } & Omit<ButtonAsButtonProps, "size" | "leftIcon" | "rightIcon" | "isLoading" | "fullWidth" | "unstyled" | "variant">, "ref"> | Omit<{
+    /**
+     * @override
+     * The text to display for the ActionButton
+     *
+     */
+    children: ReactNode;
     /**
      * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
+     * @override
      * Disables the button
      */
     disabled?: boolean;
@@ -1127,7 +1151,7 @@ type FormProps<T> = Omit<ComponentPropsWithoutRef<'form'>, 'action' | 'aria-labe
      * Sets the default label position for all `FormFields` within the form. Will be ignored if labelPosition
      * is set on the `FormField` itself.
      */
-    labelPosition?: 'block' | 'inline';
+    labelPosition?: 'block' | 'inline-compact' | 'inline';
     /**
      * The form elements used in the form
      */
@@ -1193,7 +1217,7 @@ type FormFieldProps = ComponentPropsWithoutRef<'div'> & {
     /**
      * Setting to `inline` will have the label and input appear on the same line. Setting to `block` will have the label above the input.
      */
-    labelPosition?: 'block' | 'inline';
+    labelPosition?: 'block' | 'inline-compact' | 'inline';
 };
 /**
  * Component description goes here

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.6.26
+ * @license @wistia/ui v0.6.27
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -9108,6 +9108,12 @@ var StyledFormField = styled34.div`
   grid-template-columns: auto 1fr;
   grid-template-rows: auto 1fr;
 
+  &[data-label-position='inline-compact'] {
+    gap: var(--form-field-spacing-inline);
+    grid-template-columns: auto 1fr;
+    grid-template-rows: 1fr auto;
+  }
+
   &[data-label-position='inline'] {
     gap: var(--form-field-spacing-inline);
     grid-template-columns: minmax(auto, 1fr) 1fr;