@progress/kendo-react-labels
Version:
React Labels package provides components for labelling form editors. KendoReact Labels package
16 lines (15 loc) • 4.68 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-intl")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-intl"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactLabels={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactIntl)}(this,function(e,t,l,a,o){"use strict";function s(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(l){if("default"!==l){var a=Object.getOwnPropertyDescriptor(e,l);Object.defineProperty(t,l,a.get?a:{enumerable:!0,get:function(){return e[l]}})}}),t.default=e,Object.freeze(t)}var r=s(t);const n="labels.optional",i={[n]:"(Optional)"},c=e=>{const{id:t,editorId:l,editorRef:s,editorDisabled:c,children:d,editorValid:u,style:p,className:m,optional:b}=e,f=o.useLocalization(),y=b?f.toLanguageString(n,i[n]):"",g=y&&r.createElement("span",{className:"k-label-optional"},y),N=a.useUnstyled(),E=N&&N.uLabel,h=r.useCallback(e=>{var t,a;if(!c)if(null!=s&&s.current){s.current.focus&&(e.preventDefault(),s.current.focus());const t=s.current.actionElement;t&&(e.preventDefault(),t.click())}else if(l){const o=document.getElementById(l);o&&(e.preventDefault(),null==(t=o.focus)||t.call(o),null==(a=o.click)||a.call(o))}},[s,l,c]),L=r.useMemo(()=>a.classNames(a.uLabel.label({c:E,empty:!d,invalid:!1===u,disabled:!0===c}),m),[E,d,u,c,m]);return r.createElement("label",{id:t,htmlFor:l,onClick:h,style:p,className:L},d,g)};c.propTypes={id:l.string,editorId:l.string,editorRef:l.oneOfType([l.func,l.shape({current:l.any})]),editorValid:l.bool,editorDisabled:l.bool,style:l.object,className:l.string,optional:l.bool},c.displayName="KendoReactLabel";const d=e=>{const t={direction:"start",...e},l=a.useUnstyled(),o=l&&l.uError,s=r.useMemo(()=>a.classNames(a.uError.wrapper({c:o,direction:t.direction}),t.className),[o,t.direction,t.className]);return r.createElement("div",{id:t.id,role:"alert",style:t.style,className:s},t.children)};d.propTypes={id:l.string,direction:l.oneOf(["start","end"]),children:l.oneOfType([l.element,l.node]),style:l.object,className:l.string},d.displayName="KendoReactError";const u=e=>{const t={direction:"start",...e},l=a.useUnstyled(),o=l&&l.uHint,s=r.useMemo(()=>a.classNames(a.uHint.wrapper({c:o,direction:t.direction,disabled:!0===t.editorDisabled}),t.className),[o,t.direction,t.editorDisabled,t.className]);return r.createElement("div",{id:t.id,style:t.style,className:s},t.children)};u.propTypes={id:l.string,direction:l.oneOf(["start","end"]),children:l.oneOfType([l.element,l.node]),style:l.object,className:l.string,editorDisabled:l.bool},u.displayName="KendoReactHint";const p=e=>{const[t,l]=r.useState({focused:!1}),{label:s,editorId:c,className:d,labelClassName:u,editorValue:p,editorPlaceholder:m,editorValid:b,editorDisabled:f,style:y,id:g,optional:N,unstyled:E,...h}=e,L=o.useLocalization(),O=N?L.toLanguageString(n,i[n]):"",k=O&&r.createElement("span",{className:"k-label-optional"},O),v=E&&E.uFloatingLabel,D=!m&&!p&&0!==p,T=a.classNames(a.uFloatingLabel.wrapper({c:v,focused:t.focused,empty:D,notEmpty:!D,disabled:f,isRtl:"rtl"===e.dir}),d),j=a.classNames(a.uFloatingLabel.label({c:v,focused:t.focused,empty:D,notEmpty:!D,invalid:!1===b,disabled:f}),u);return r.createElement("span",{...h,id:e.id,className:T,onFocus:e=>{l({focused:!0})},onBlur:e=>{l({focused:!1})},style:y,dir:e.dir},e.children,s?c?r.createElement("label",{id:g,htmlFor:c,className:j},s,k):r.createElement("span",{id:g,className:j},s,k):null)};p.propTypes={label:l.node,editorId:l.string,editorValue:l.oneOfType([l.string,l.bool,l.number]),editorPlaceholder:l.string,editorValid:l.bool,editorDisabled:l.bool,id:l.string,style:l.object,className:l.string,labelClassName:l.string,optional:l.bool},e.Error=d,e.FloatingLabel=p,e.Hint=u,e.Label=c});