@primer/react 38.29.0-rc.e2fa16f13 → 38.29.0-rc.edaf62be4

package/dist/hooks/useMergedRefs.js

@@ -1,5 +1,4 @@
-import { c } from 'react-compiler-runtime';
-import 'react';
+import { useCallback } from 'react';
 import { reactMajorVersion, isExperimentalReactVersion } from '../utils/environment.js';
 
 /**
@@ -42,35 +41,23 @@ const supportsRefCleanup = reactMajorVersion >= 19 || isExperimentalReactVersion
  * }
  */
 function useMergedRefs(refA, refB) {
-  const $ = c(3);
-  let t0;
-  if ($[0] !== refA || $[1] !== refB) {
-    t0 = value => {
-      const cleanupA = setRef(refA, value);
-      const cleanupB = setRef(refB, value);
-      if (!supportsRefCleanup) {
-        return;
-      }
-      return () => {
-        if (cleanupA) {
-          cleanupA();
-        } else {
-          setRef(refA, null);
-        }
-        if (cleanupB) {
-          cleanupB();
-        } else {
-          setRef(refB, null);
-        }
-      };
+  return useCallback(value => {
+    const cleanupA = setRef(refA, value);
+    const cleanupB = setRef(refB, value);
+
+    // TODO: remove when we are on React 19
+    if (!supportsRefCleanup) {
+      return;
+    }
+
+    // Only works in React 19. In React 18, the cleanup function will be ignored and the ref will get called with
+    // `null` which will be passed to each ref as expected.
+    return () => {
+      // For object refs and callback refs that don't return cleanups, we still need to pass `null` on cleanup
+      if (cleanupA) cleanupA();else setRef(refA, null);
+      if (cleanupB) cleanupB();else setRef(refB, null);
     };
-    $[0] = refA;
-    $[1] = refB;
-    $[2] = t0;
-  } else {
-    t0 = $[2];
-  }
-  return t0;
+  }, [refA, refB]);
 }
 
 /**

package/dist/internal/components/TextInputWrapper-b2f7f9fa.css

@@ -1,2 +1,2 @@
-.prc-components-TextInputBaseWrapper-wY-n0{align-items:stretch;background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--control-borderColor-rest,#d1d9e0);border-radius:var(--borderRadius-medium,.375rem);box-shadow:var(--shadow-inset,inset 0 1px 0 0 #1f23280a);color:var(--fgColor-default,#1f2328);cursor:text;display:inline-flex;font-size:var(--text-body-size-medium,.875rem);line-height:var(--base-size-20,1.25rem);min-height:var(--base-size-32,2rem);outline:none;overflow:hidden;vertical-align:middle}.prc-components-TextInputBaseWrapper-wY-n0 input,.prc-components-TextInputBaseWrapper-wY-n0 textarea{cursor:text}.prc-components-TextInputBaseWrapper-wY-n0 select{cursor:pointer}:is(.prc-components-TextInputBaseWrapper-wY-n0 input,.prc-components-TextInputBaseWrapper-wY-n0 textarea,.prc-components-TextInputBaseWrapper-wY-n0 select)::placeholder{color:var(--fgColor-muted,#59636e)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-no-trailing-action]:focus-within),.prc-components-TextInputBaseWrapper-wY-n0:where([data-trailing-action][data-focused]){border-color:var(--borderColor-accent-emphasis,#0969da);outline:var(--borderWidth-thick,.125rem) solid var(--borderColor-accent-emphasis,#0969da);outline-offset:-1px}.prc-components-TextInputBaseWrapper-wY-n0>textarea{padding:var(--base-size-12,.75rem)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-contrast]){background-color:var(--control-bgColor-contrast,var(--bgColor-inset,#f6f8fa))}.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]){background-color:var(--control-bgColor-disabled,#eff2f5);border-color:var(--control-borderColor-disabled,#818b981a);box-shadow:none;color:var(--fgColor-disabled,#818b98)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) input,.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) select,.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) textarea{cursor:not-allowed}.prc-components-TextInputBaseWrapper-wY-n0:where([data-monospace]){font-family:var(--fontStack-monospace,ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]){border-color:var(--borderColor-danger-emphasis,#cf222e)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]):where([data-no-trailing-action]):focus-within,.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]):where([data-trailing-action][data-focused]){border-color:var(--control-borderColor-danger,#cf222e);outline:2px solid var(--control-borderColor-danger,#cf222e);outline-offset:-1px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=success]){border-color:var(--bgColor-success-emphasis,#1f883d)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-block]){align-self:stretch;display:flex;width:100%}@media screen and (min-width:48rem){.prc-components-TextInputBaseWrapper-wY-n0{font-size:var(--text-body-size-medium,.875rem)}}.prc-components-TextInputBaseWrapper-wY-n0{--inner-action-size:var(--base-size-24,1.5rem)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-size=small]){--inner-action-size:var(--base-size-20,1.25rem);font-size:var(--text-body-size-small,.75rem);line-height:var(--base-size-20,1.25rem);min-height:var(--base-size-28,1.75rem);padding-bottom:3px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:3px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-size=large]){--inner-action-size:var(--base-size-28,1.75rem);height:var(--base-size-40,2.5rem);padding-bottom:10px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:10px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-variant=small]){font-size:(--text-body-size-small);line-height:var(--base-size-20,1.25rem);min-height:28px;padding-bottom:3px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:3px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-variant=large]){font-size:var(--text-title-size-medium,1.25rem);padding-bottom:10px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:10px}.prc-components-TextInputWrapper-Hpdqi,.prc-components-TextInputWrapper-Hpdqi>input,.prc-components-TextInputWrapper-Hpdqi>select{padding-left:0;padding-right:0}.prc-components-TextInputWrapper-Hpdqi{background-position:right 8px center;background-repeat:no-repeat}.prc-components-TextInputWrapper-Hpdqi>:not(:last-child){margin-right:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi .TextInput-action,.prc-components-TextInputWrapper-Hpdqi .TextInput-icon{align-self:center;color:var(--fgColor-muted,#59636e);flex-shrink:0}.prc-components-TextInputWrapper-Hpdqi:where([data-leading-visual]){padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-trailing-visual][data-no-trailing-action]){padding-right:var(--base-size-8,.5rem)}:is(.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-visual]),.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-action]))>input,:is(.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-visual]),.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-action]))>select{padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-trailing-visual][data-no-trailing-action])>input,.prc-components-TextInputWrapper-Hpdqi:where([data-no-trailing-visual][data-no-trailing-action])>select{padding-right:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action])>input,.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action])>select{padding-left:var(--base-size-12,.75rem);padding-right:var(--base-size-12,.75rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-size=large]):where([data-leading-visual]){padding-left:var(--base-size-12,.75rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-size=large]):where([data-trailing-visual][data-no-trailing-action]){padding-right:var(--base-size-12,.75rem)}
+.prc-components-TextInputBaseWrapper-wY-n0{align-items:stretch;background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--control-borderColor-rest,#d1d9e0);border-radius:var(--borderRadius-medium,.375rem);box-shadow:var(--shadow-inset,inset 0 1px 0 0 #1f23280a);color:var(--fgColor-default,#1f2328);cursor:text;display:inline-flex;font-size:var(--text-body-size-medium,.875rem);line-height:var(--base-size-20,1.25rem);min-height:var(--base-size-32,2rem);outline:none;overflow:hidden;vertical-align:middle}.prc-components-TextInputBaseWrapper-wY-n0 input,.prc-components-TextInputBaseWrapper-wY-n0 textarea{cursor:text}.prc-components-TextInputBaseWrapper-wY-n0 select{cursor:pointer}.prc-components-TextInputBaseWrapper-wY-n0 input::placeholder{color:var(--fgColor-muted,#59636e)}.prc-components-TextInputBaseWrapper-wY-n0 textarea::placeholder{color:var(--fgColor-muted,#59636e)}.prc-components-TextInputBaseWrapper-wY-n0 select::placeholder{color:var(--fgColor-muted,#59636e)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-no-trailing-action]:focus-within),.prc-components-TextInputBaseWrapper-wY-n0:where([data-trailing-action][data-focused]){border-color:var(--borderColor-accent-emphasis,#0969da);outline:var(--borderWidth-thick,.125rem) solid var(--borderColor-accent-emphasis,#0969da);outline-offset:-1px}.prc-components-TextInputBaseWrapper-wY-n0>textarea{padding:var(--base-size-12,.75rem)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-contrast]){background-color:var(--control-bgColor-contrast,var(--bgColor-inset,#f6f8fa))}.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]){background-color:var(--control-bgColor-disabled,#eff2f5);border-color:var(--control-borderColor-disabled,#818b981a);box-shadow:none;color:var(--fgColor-disabled,#818b98)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) input,.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) select,.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) textarea{cursor:not-allowed}.prc-components-TextInputBaseWrapper-wY-n0:where([data-monospace]){font-family:var(--fontStack-monospace,ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]){border-color:var(--borderColor-danger-emphasis,#cf222e)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]):where([data-no-trailing-action]):focus-within,.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]):where([data-trailing-action][data-focused]){border-color:var(--control-borderColor-danger,#cf222e);outline:2px solid var(--control-borderColor-danger,#cf222e);outline-offset:-1px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=success]){border-color:var(--bgColor-success-emphasis,#1f883d)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-block]){align-self:stretch;display:flex;width:100%}@media screen and (min-width:48rem){.prc-components-TextInputBaseWrapper-wY-n0{font-size:var(--text-body-size-medium,.875rem)}}.prc-components-TextInputBaseWrapper-wY-n0{--inner-action-size:var(--base-size-24,1.5rem)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-size=small]){--inner-action-size:var(--base-size-20,1.25rem);font-size:var(--text-body-size-small,.75rem);line-height:var(--base-size-20,1.25rem);min-height:var(--base-size-28,1.75rem);padding-bottom:3px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:3px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-size=large]){--inner-action-size:var(--base-size-28,1.75rem);height:var(--base-size-40,2.5rem);padding-bottom:10px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:10px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-variant=small]){font-size:(--text-body-size-small);line-height:var(--base-size-20,1.25rem);min-height:28px;padding-bottom:3px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:3px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-variant=large]){font-size:var(--text-title-size-medium,1.25rem);padding-bottom:10px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:10px}.prc-components-TextInputWrapper-Hpdqi,.prc-components-TextInputWrapper-Hpdqi>input,.prc-components-TextInputWrapper-Hpdqi>select{padding-left:0;padding-right:0}.prc-components-TextInputWrapper-Hpdqi{background-position:right 8px center;background-repeat:no-repeat}.prc-components-TextInputWrapper-Hpdqi>:not(:last-child){margin-right:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi .TextInput-action,.prc-components-TextInputWrapper-Hpdqi .TextInput-icon{align-self:center;color:var(--fgColor-muted,#59636e);flex-shrink:0}.prc-components-TextInputWrapper-Hpdqi:where([data-leading-visual]){padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-trailing-visual][data-no-trailing-action]){padding-right:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-visual])>input{padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-action])>input{padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-visual])>select{padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-action])>select{padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-trailing-visual][data-no-trailing-action])>input,.prc-components-TextInputWrapper-Hpdqi:where([data-no-trailing-visual][data-no-trailing-action])>select{padding-right:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action])>input,.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action])>select{padding-left:var(--base-size-12,.75rem);padding-right:var(--base-size-12,.75rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-size=large]):where([data-leading-visual]){padding-left:var(--base-size-12,.75rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-size=large]):where([data-trailing-visual][data-no-trailing-action]){padding-right:var(--base-size-12,.75rem)}
 /*# sourceMappingURL=TextInputWrapper-b2f7f9fa.css.map */

package/dist/internal/components/TextInputWrapper-b2f7f9fa.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/internal/components/TextInputWrapper.module.css.js"],"names":[],"mappings":"AAAA,2CAeE,mBAAoB,CALpB,4CAAwC,CACxC,qFAAqE,CACrE,gDAAyC,CAEzC,wDAA+B,CAP/B,oCAA6B,CAE7B,WAAY,CARZ,mBAAoB,CAGpB,8CAAuC,CAEvC,uCAAgC,CAJhC,mCAA+B,CAW/B,YAAa,CAVb,eAAgB,CAKhB,qBA6IF,CApIE,qGAEE,WACF,CAEA,kDACE,cACF,CAKE,yKACE,kCACF,CAGF,gLAEE,uDAAgD,CAChD,yFAA0E,CAC1E,mBACF,CAEA,oDACE,kCACF,CAEA,kEAGE,6EACF,CAEA,kEAEE,wDAAiD,CACjD,0DAAiD,CACjD,eAAgB,CAHhB,qCAUF,CALE,4NAGE,kBACF,CAGF,mEACE,mHACF,CAEA,0EACE,uDAQF,CANE,8OAEE,sDAA+C,CAC/C,2DAAoD,CACpD,mBACF,CAGF,4EAEE,oDACF,CAEA,+DAGE,kBAAmB,CAFnB,YAAa,CACb,UAEF,CAGA,oCA3FF,2CA4FI,8CAyDJ,CAxDE,CA7FF,2CA+FE,8CAsDF,CApDE,oEACE,+CAAwC,CASxC,4CAAsC,CAEtC,uCAAgC,CAThC,sCAA+B,CAK/B,kBAAmB,CACnB,qCAAgC,CAHhC,sCAAiC,CADjC,eAQF,CAEA,oEACE,+CAAwC,CAExC,iCAA2B,CAK3B,mBAAoB,CACpB,qCAAgC,CAHhC,sCAAiC,CADjC,gBAKF,CAGA,uEASE,kCAAmC,CAEnC,uCAAgC,CAVhC,eAAgB,CAKhB,kBAAmB,CACnB,qCAAgC,CAHhC,sCAAiC,CADjC,eASF,CAGA,uEAOE,+CAAwC,CAFxC,mBAAoB,CACpB,qCAAgC,CAHhC,sCAAiC,CADjC,gBAMF,CAOA,kIAGE,cAAe,CADf,eAEF,CARF,uCAcE,oCAAqC,CAHrC,2BA+CF,CA1CE,yDACE,qCACF,CAEA,gHAEE,iBAAkB,CAClB,kCAA2B,CAC3B,aACF,CAGA,oEACE,qCACF,CAGA,8FACE,sCACF,CAKE,2YAEE,qCACF,CAIF,+MAEE,sCACF,CAGA,+PAEE,uCAAiC,CACjC,wCACF,CAKA,6FACE,uCACF,CAEA,uHACE,wCACF","file":"TextInputWrapper-b2f7f9fa.css","sourcesContent":[".TextInputBaseWrapper {\n  display: inline-flex;\n  min-height: var(--base-size-32);\n  overflow: hidden;\n  font-size: var(--text-body-size-medium);\n  /* stylelint-disable-next-line primer/typography */\n  line-height: var(--base-size-20);\n  color: var(--fgColor-default);\n  vertical-align: middle;\n  cursor: text;\n  background-color: var(--bgColor-default);\n  border: var(--borderWidth-thin) solid var(--control-borderColor-rest);\n  border-radius: var(--borderRadius-medium);\n  outline: none;\n  box-shadow: var(--shadow-inset);\n  align-items: stretch;\n\n  input,\n  textarea {\n    cursor: text;\n  }\n\n  select {\n    cursor: pointer;\n  }\n\n  input,\n  textarea,\n  select {\n    &::placeholder {\n      color: var(--fgColor-muted);\n    }\n  }\n\n  &:where([data-trailing-action][data-focused]),\n  &:where([data-no-trailing-action]:focus-within) {\n    border-color: var(--borderColor-accent-emphasis);\n    outline: var(--borderWidth-thick) solid var(--borderColor-accent-emphasis);\n    outline-offset: -1px;\n  }\n\n  > textarea {\n    padding: var(--base-size-12);\n  }\n\n  &:where([data-contrast]) {\n    /* this variable is available behind a feature flag in gh/gh */\n    /* stylelint-disable-next-line primer/colors */\n    background-color: var(--control-bgColor-contrast, var(--bgColor-inset));\n  }\n\n  &:where([data-disabled]) {\n    color: var(--fgColor-disabled);\n    background-color: var(--control-bgColor-disabled);\n    border-color: var(--control-borderColor-disabled);\n    box-shadow: none;\n\n    input,\n    textarea,\n    select {\n      cursor: not-allowed;\n    }\n  }\n\n  &:where([data-monospace]) {\n    font-family: var(--fontStack-monospace);\n  }\n\n  &:where([data-validation='error']) {\n    border-color: var(--borderColor-danger-emphasis);\n\n    &:where([data-trailing-action][data-focused]),\n    &:where([data-no-trailing-action]):focus-within {\n      border-color: var(--control-borderColor-danger);\n      outline: 2px solid var(--control-borderColor-danger);\n      outline-offset: -1px;\n    }\n  }\n\n  &:where([data-validation='success']) {\n    /* stylelint-disable-next-line primer/colors */\n    border-color: var(--bgColor-success-emphasis);\n  }\n\n  &:where([data-block]) {\n    display: flex;\n    width: 100%;\n    align-self: stretch;\n  }\n\n  /* Ensures inputs don't zoom on mobile but are body-font size on desktop */\n  @media screen and (--viewportRange-regular) {\n    font-size: var(--text-body-size-medium);\n  }\n\n  --inner-action-size: var(--base-size-24); /* Default size */\n\n  &:where([data-size='small']) {\n    --inner-action-size: var(--base-size-20);\n\n    min-height: var(--base-size-28);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 3px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 3px;\n    padding-left: var(--base-size-8);\n    font-size: var(--text-body-size-small);\n    /* stylelint-disable-next-line primer/typography */\n    line-height: var(--base-size-20);\n  }\n\n  &:where([data-size='large']) {\n    --inner-action-size: var(--base-size-28);\n\n    height: var(--base-size-40);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 10px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 10px;\n    padding-left: var(--base-size-8);\n  }\n\n  /* Deprecated */\n  &:where([data-variant='small']) {\n    min-height: 28px;\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 3px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 3px;\n    padding-left: var(--base-size-8);\n    /* stylelint-disable-next-line declaration-property-value-no-unknown */\n    font-size: (--text-body-size-small);\n    /* stylelint-disable-next-line primer/typography */\n    line-height: var(--base-size-20);\n  }\n\n  /* Deprecated */\n  &:where([data-variant='large']) {\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 10px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 10px;\n    padding-left: var(--base-size-8);\n    font-size: var(--text-title-size-medium);\n  }\n}\n\n.TextInputWrapper {\n  padding-right: 0;\n  padding-left: 0;\n\n  > input,\n  > select {\n    padding-right: 0;\n    padding-left: 0;\n  }\n\n  /* Repeat and position set for form states (success, error, etc) */\n  background-repeat: no-repeat;\n\n  /* For form validation. This keeps images 8px from right and centered vertically. */\n  background-position: right 8px center;\n\n  & > :not(:last-child) {\n    margin-right: var(--base-size-8);\n  }\n\n  & :global(.TextInput-icon) /* stylelint-disable-line selector-class-pattern */,\n  & :global(.TextInput-action)  /* stylelint-disable-line selector-class-pattern */ {\n    align-self: center;\n    color: var(--fgColor-muted);\n    flex-shrink: 0;\n  }\n\n  /* With leading visual */\n  &:where([data-leading-visual]) {\n    padding-left: var(--base-size-8);\n  }\n\n  /* With trailing visual */\n  &:where([data-trailing-visual][data-no-trailing-action]) {\n    padding-right: var(--base-size-8);\n  }\n\n  /* Only trailing visual */\n  &:where([data-no-leading-visual][data-trailing-visual]),\n  &:where([data-no-leading-visual][data-trailing-action]) {\n    > input,\n    > select {\n      padding-left: var(--base-size-8);\n    }\n  }\n\n  /* Only leading visual */\n  &:where([data-no-trailing-visual][data-no-trailing-action]) > input,\n  &:where([data-no-trailing-visual][data-no-trailing-action]) > select {\n    padding-right: var(--base-size-8);\n  }\n\n  /* No visuals at all */\n  &:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action]) > input,\n  &:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action]) > select {\n    padding-left: var(--base-size-12);\n    padding-right: var(--base-size-12);\n  }\n}\n\n/* Large size input */\n.TextInputWrapper:where([data-size='large']) {\n  &:where([data-leading-visual]) {\n    padding-left: var(--base-size-12);\n  }\n\n  &:where([data-trailing-visual][data-no-trailing-action]) {\n    padding-right: var(--base-size-12);\n  }\n}\n"]}
+{"version":3,"sources":["../../src/internal/components/TextInputWrapper.module.css.js"],"names":[],"mappings":"AAAA,2CAeE,mBAAoB,CALpB,4CAAwC,CACxC,qFAAqE,CACrE,gDAAyC,CAEzC,wDAA+B,CAP/B,oCAA6B,CAE7B,WAAY,CARZ,mBAAoB,CAGpB,8CAAuC,CAEvC,uCAAgC,CAJhC,mCAA+B,CAW/B,YAAa,CAVb,eAAgB,CAKhB,qBA6IF,CApIE,qGAEE,WACF,CAEA,kDACE,cACF,CAKE,8DACE,kCACF,CAFA,iEACE,kCACF,CAFA,+DACE,kCACF,CAGF,gLAEE,uDAAgD,CAChD,yFAA0E,CAC1E,mBACF,CAEA,oDACE,kCACF,CAEA,kEAGE,6EACF,CAEA,kEAEE,wDAAiD,CACjD,0DAAiD,CACjD,eAAgB,CAHhB,qCAUF,CALE,4NAGE,kBACF,CAGF,mEACE,mHACF,CAEA,0EACE,uDAQF,CANE,8OAEE,sDAA+C,CAC/C,2DAAoD,CACpD,mBACF,CAGF,4EAEE,oDACF,CAEA,+DAGE,kBAAmB,CAFnB,YAAa,CACb,UAEF,CAGA,oCA3FF,2CA4FI,8CAyDJ,CAxDE,CA7FF,2CA+FE,8CAsDF,CApDE,oEACE,+CAAwC,CASxC,4CAAsC,CAEtC,uCAAgC,CAThC,sCAA+B,CAK/B,kBAAmB,CACnB,qCAAgC,CAHhC,sCAAiC,CADjC,eAQF,CAEA,oEACE,+CAAwC,CAExC,iCAA2B,CAK3B,mBAAoB,CACpB,qCAAgC,CAHhC,sCAAiC,CADjC,gBAKF,CAGA,uEASE,kCAAmC,CAEnC,uCAAgC,CAVhC,eAAgB,CAKhB,kBAAmB,CACnB,qCAAgC,CAHhC,sCAAiC,CADjC,eASF,CAGA,uEAOE,+CAAwC,CAFxC,mBAAoB,CACpB,qCAAgC,CAHhC,sCAAiC,CADjC,gBAMF,CAOA,kIAGE,cAAe,CADf,eAEF,CARF,uCAcE,oCAAqC,CAHrC,2BA+CF,CA1CE,yDACE,qCACF,CAEA,gHAEE,iBAAkB,CAClB,kCAA2B,CAC3B,aACF,CAGA,oEACE,qCACF,CAGA,8FACE,sCACF,CAKE,mGAEE,qCACF,CAHA,mGAEE,qCACF,CAHA,oGAEE,qCACF,CAHA,oGAEE,qCACF,CAIF,+MAEE,sCACF,CAGA,+PAEE,uCAAiC,CACjC,wCACF,CAKA,6FACE,uCACF,CAEA,uHACE,wCACF","file":"TextInputWrapper-b2f7f9fa.css","sourcesContent":[".TextInputBaseWrapper {\n  display: inline-flex;\n  min-height: var(--base-size-32);\n  overflow: hidden;\n  font-size: var(--text-body-size-medium);\n  /* stylelint-disable-next-line primer/typography */\n  line-height: var(--base-size-20);\n  color: var(--fgColor-default);\n  vertical-align: middle;\n  cursor: text;\n  background-color: var(--bgColor-default);\n  border: var(--borderWidth-thin) solid var(--control-borderColor-rest);\n  border-radius: var(--borderRadius-medium);\n  outline: none;\n  box-shadow: var(--shadow-inset);\n  align-items: stretch;\n\n  input,\n  textarea {\n    cursor: text;\n  }\n\n  select {\n    cursor: pointer;\n  }\n\n  input,\n  textarea,\n  select {\n    &::placeholder {\n      color: var(--fgColor-muted);\n    }\n  }\n\n  &:where([data-trailing-action][data-focused]),\n  &:where([data-no-trailing-action]:focus-within) {\n    border-color: var(--borderColor-accent-emphasis);\n    outline: var(--borderWidth-thick) solid var(--borderColor-accent-emphasis);\n    outline-offset: -1px;\n  }\n\n  > textarea {\n    padding: var(--base-size-12);\n  }\n\n  &:where([data-contrast]) {\n    /* this variable is available behind a feature flag in gh/gh */\n    /* stylelint-disable-next-line primer/colors */\n    background-color: var(--control-bgColor-contrast, var(--bgColor-inset));\n  }\n\n  &:where([data-disabled]) {\n    color: var(--fgColor-disabled);\n    background-color: var(--control-bgColor-disabled);\n    border-color: var(--control-borderColor-disabled);\n    box-shadow: none;\n\n    input,\n    textarea,\n    select {\n      cursor: not-allowed;\n    }\n  }\n\n  &:where([data-monospace]) {\n    font-family: var(--fontStack-monospace);\n  }\n\n  &:where([data-validation='error']) {\n    border-color: var(--borderColor-danger-emphasis);\n\n    &:where([data-trailing-action][data-focused]),\n    &:where([data-no-trailing-action]):focus-within {\n      border-color: var(--control-borderColor-danger);\n      outline: 2px solid var(--control-borderColor-danger);\n      outline-offset: -1px;\n    }\n  }\n\n  &:where([data-validation='success']) {\n    /* stylelint-disable-next-line primer/colors */\n    border-color: var(--bgColor-success-emphasis);\n  }\n\n  &:where([data-block]) {\n    display: flex;\n    width: 100%;\n    align-self: stretch;\n  }\n\n  /* Ensures inputs don't zoom on mobile but are body-font size on desktop */\n  @media screen and (--viewportRange-regular) {\n    font-size: var(--text-body-size-medium);\n  }\n\n  --inner-action-size: var(--base-size-24); /* Default size */\n\n  &:where([data-size='small']) {\n    --inner-action-size: var(--base-size-20);\n\n    min-height: var(--base-size-28);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 3px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 3px;\n    padding-left: var(--base-size-8);\n    font-size: var(--text-body-size-small);\n    /* stylelint-disable-next-line primer/typography */\n    line-height: var(--base-size-20);\n  }\n\n  &:where([data-size='large']) {\n    --inner-action-size: var(--base-size-28);\n\n    height: var(--base-size-40);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 10px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 10px;\n    padding-left: var(--base-size-8);\n  }\n\n  /* Deprecated */\n  &:where([data-variant='small']) {\n    min-height: 28px;\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 3px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 3px;\n    padding-left: var(--base-size-8);\n    /* stylelint-disable-next-line declaration-property-value-no-unknown */\n    font-size: (--text-body-size-small);\n    /* stylelint-disable-next-line primer/typography */\n    line-height: var(--base-size-20);\n  }\n\n  /* Deprecated */\n  &:where([data-variant='large']) {\n    /* stylelint-disable-next-line primer/spacing */\n    padding-top: 10px;\n    padding-right: var(--base-size-8);\n    /* stylelint-disable-next-line primer/spacing */\n    padding-bottom: 10px;\n    padding-left: var(--base-size-8);\n    font-size: var(--text-title-size-medium);\n  }\n}\n\n.TextInputWrapper {\n  padding-right: 0;\n  padding-left: 0;\n\n  > input,\n  > select {\n    padding-right: 0;\n    padding-left: 0;\n  }\n\n  /* Repeat and position set for form states (success, error, etc) */\n  background-repeat: no-repeat;\n\n  /* For form validation. This keeps images 8px from right and centered vertically. */\n  background-position: right 8px center;\n\n  & > :not(:last-child) {\n    margin-right: var(--base-size-8);\n  }\n\n  & :global(.TextInput-icon) /* stylelint-disable-line selector-class-pattern */,\n  & :global(.TextInput-action)  /* stylelint-disable-line selector-class-pattern */ {\n    align-self: center;\n    color: var(--fgColor-muted);\n    flex-shrink: 0;\n  }\n\n  /* With leading visual */\n  &:where([data-leading-visual]) {\n    padding-left: var(--base-size-8);\n  }\n\n  /* With trailing visual */\n  &:where([data-trailing-visual][data-no-trailing-action]) {\n    padding-right: var(--base-size-8);\n  }\n\n  /* Only trailing visual */\n  &:where([data-no-leading-visual][data-trailing-visual]),\n  &:where([data-no-leading-visual][data-trailing-action]) {\n    > input,\n    > select {\n      padding-left: var(--base-size-8);\n    }\n  }\n\n  /* Only leading visual */\n  &:where([data-no-trailing-visual][data-no-trailing-action]) > input,\n  &:where([data-no-trailing-visual][data-no-trailing-action]) > select {\n    padding-right: var(--base-size-8);\n  }\n\n  /* No visuals at all */\n  &:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action]) > input,\n  &:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action]) > select {\n    padding-left: var(--base-size-12);\n    padding-right: var(--base-size-12);\n  }\n}\n\n/* Large size input */\n.TextInputWrapper:where([data-size='large']) {\n  &:where([data-leading-visual]) {\n    padding-left: var(--base-size-12);\n  }\n\n  &:where([data-trailing-visual][data-no-trailing-action]) {\n    padding-right: var(--base-size-12);\n  }\n}\n"]}

package/dist/utils/modern-polymorphic.d.ts

@@ -2,7 +2,7 @@ import type { ComponentPropsWithRef, ElementType } from 'react';
 /**
  * Distributive Omit utility type that works correctly with union types
  */
-type DistributiveOmit<T, TOmitted extends PropertyKey> = T extends unknown ? Omit<T, TOmitted> : never;
+export type DistributiveOmit<T, TOmitted extends PropertyKey> = T extends unknown ? Omit<T, TOmitted> : never;
 /**
  * Fixed version of forwardRef that provides better type inference for polymorphic components
  */

package/dist/utils/modern-polymorphic.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"modern-polymorphic.d.ts","sourceRoot":"","sources":["../../src/utils/modern-polymorphic.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,qBAAqB,EAAE,WAAW,EAAC,MAAM,OAAO,CAAA;AAE7D;;GAEG;AACH,KAAK,gBAAgB,CAAC,CAAC,EAAE,QAAQ,SAAS,WAAW,IAAI,CAAC,SAAS,OAAO,GAAG,IAAI,CAAC,CAAC,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAA;AAEtG;;GAEG;AAGH,KAAK,eAAe,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM,EACnC,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAAS,KACrD,CAAC,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;AAE3D;;GAEG;AACH,eAAO,MAAM,eAAe,EAAiB,eAAe,CAAA;AAE5D;;;GAGG;AACH,MAAM,MAAM,gBAAgB,CAC1B,GAAG,SAAS,WAAW,EACvB,eAAe,SAAS,WAAW,GAAG,KAAK,EAC3C,KAAK,GAAG,MAAM,IACZ,gBAAgB,CAAC,qBAAqB,CAAC,WAAW,SAAS,GAAG,GAAG,eAAe,GAAG,GAAG,CAAC,GAAG,KAAK,EAAE,IAAI,CAAC,GAAG;IAC3G,EAAE,CAAC,EAAE,GAAG,CAAA;CACT,CAAA"}
+{"version":3,"file":"modern-polymorphic.d.ts","sourceRoot":"","sources":["../../src/utils/modern-polymorphic.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,qBAAqB,EAAE,WAAW,EAAC,MAAM,OAAO,CAAA;AAE7D;;GAEG;AACH,MAAM,MAAM,gBAAgB,CAAC,CAAC,EAAE,QAAQ,SAAS,WAAW,IAAI,CAAC,SAAS,OAAO,GAAG,IAAI,CAAC,CAAC,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAA;AAE7G;;GAEG;AAGH,KAAK,eAAe,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM,EACnC,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAAS,KACrD,CAAC,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;AAE3D;;GAEG;AACH,eAAO,MAAM,eAAe,EAAiB,eAAe,CAAA;AAE5D;;;GAGG;AACH,MAAM,MAAM,gBAAgB,CAC1B,GAAG,SAAS,WAAW,EACvB,eAAe,SAAS,WAAW,GAAG,KAAK,EAC3C,KAAK,GAAG,MAAM,IACZ,gBAAgB,CAAC,qBAAqB,CAAC,WAAW,SAAS,GAAG,GAAG,eAAe,GAAG,GAAG,CAAC,GAAG,KAAK,EAAE,IAAI,CAAC,GAAG;IAC3G,EAAE,CAAC,EAAE,GAAG,CAAA;CACT,CAAA"}

package/generated/components.json

@@ -8787,6 +8787,12 @@
             {
               "name": "ref",
               "type": "React.Ref<HTMLElement>"
+            },
+            {
+              "name": "as",
+              "type": "React.ElementType",
+              "defaultValue": "'li'",
+              "description": "The element type to render the tree item as. When set to a different element type or component, the polymorphic element is rendered with `role=\"treeitem\"` and is wrapped in an `li` element with `role=\"none\"` so the markup remains valid inside a `ul` with `role=\"tree\"`."
             }
           ]
         },

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@primer/react",
   "type": "module",
-  "version": "38.29.0-rc.e2fa16f13",
+  "version": "38.29.0-rc.edaf62be4",
   "description": "An implementation of GitHub's Primer Design System using React",
   "main": "./dist/index.js",
   "module": "./dist/index.js",