UNPKG

@styleless-ui/react

Version:

Completely unstyled, headless and accessible React UI components.

1 lines 2.24 kB
var e=this&&this.__assign||function(){return e=Object.assign||function(e){for(var t,o=1,n=arguments.length;o<n;o++)for(var a in t=arguments[o])Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a]);return e},e.apply(this,arguments)},t=this&&this.__rest||function(e,t){var o={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(n=Object.getOwnPropertySymbols(e);a<n.length;a++)t.indexOf(n[a])<0&&Object.prototype.propertyIsEnumerable.call(e,n[a])&&(o[n[a]]=e[n[a]])}return o};import{jsx as o}from"react/jsx-runtime";import*as n from"react";import{componentWithForwardedRef as a,computeAccessibleName as i,getNodeName as s,useButtonBase as r,useDeterministicId as l,useForkedRefs as c}from"../utils";import*as u from"./slots";var d=a((function(a,d){var b=a.className,f=a.children,p=a.id,y=a.as,m=void 0===y?"button":y,h=a.onBlur,v=a.onFocus,O=a.onClick,F=a.onKeyDown,w=a.onKeyUp,K=a.autoFocus,j=a.disabled,g=void 0!==j&&j,U=t(a,["className","children","id","as","onBlur","onFocus","onClick","onKeyDown","onKeyUp","autoFocus","disabled"]),B=l(p,"styleless-ui__button"),S=r({onBlur:h,onClick:O,onFocus:v,onKeyDown:F,onKeyUp:w,autoFocus:K,disabled:g}),x=n.useRef(null),C=c(d,x,S.handleButtonRef),_={disabled:g,focusedVisible:S.isFocusedVisible},k="function"==typeof b?b(_):b,D="function"==typeof f?f(_):f;return o(m,e({id:B,ref:function(e){(C(e),e)&&("button"===s(e)?e.disabled=g:(e.setAttribute("role","button"),e.setAttribute("aria-disabled",String(g))),i(e)||console.error(["[StylelessUI][Button]: Can't determine an accessible name.","It's mandatory to provide an accessible name for the component. Possible accessible names:",". Set `aria-label` attribute.",". Set `aria-labelledby` attribute.",". Set `title` attribute.",". Use an informative content.",". Use a <label> with `for` attribute referencing to this component."].join("\n")))},className:k,autoFocus:K,onClick:S.handleClick,onBlur:S.handleBlur,onFocus:S.handleFocus,onKeyDown:S.handleKeyDown,onKeyUp:S.handleKeyUp,"data-slot":u.Root},U,{tabIndex:g?-1:0,"data-disabled":g?"":void 0,"data-focus-visible":S.isFocusedVisible?"":void 0},{children:D}))}));export default d;