UNPKG

@salesforce-ux/design-system

Version:
1 lines 7.14 kB
var SLDS;!function(){"use strict";var e,t,n,r={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},5061:function(e,t,n){n.r(t),n.d(t,{getContents:function(){return O},getElement:function(){return v}});var r=n(1594),l=n.n(r),o=n(5671),s=n(6547),a=(n(3212),n(5619),n(2711)),i=n(5526),c=n(6955),u="Counter Label",d=[{id:"default",label:"Default",element:l().createElement(a.ZS,{labelContent:u,inputId:"default1",labelClassName:"slds-m-right_none"},l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_decrement",symbol:"ban",assistiveText:"Decrement counter",title:"Decrement counter"}),l().createElement(i.A,{id:"default1",type:"number",placeholder:"1"}),l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_increment",symbol:"new",assistiveText:"Increment counter",title:"Increment counter"}))}],m=[{id:"disabled",label:"Disabled",element:l().createElement(a.ZS,{labelContent:u,inputId:"state-disabled",labelClassName:"slds-m-right_none"},l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_decrement",symbol:"ban",assistiveText:"Decrement counter",title:"Decrement counter",disabled:!0}),l().createElement(i.A,{id:"state-disabled",type:"number",placeholder:"1",disabled:!0}),l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_increment",symbol:"new",assistiveText:"Increment counter",title:"Increment counter",disabled:!0}))},{id:"read-only",label:"Read only",element:l().createElement(a.ZS,{labelContent:u,inputId:"state-read-only",labelClassName:"slds-m-right_none"},l().createElement(i.A,{id:"state-read-only",type:"text",placeholder:"1",readOnly:!0}))},{id:"required",label:"Required",element:l().createElement(a.ZS,{labelContent:u,inputId:"state-required",isRequired:!0,labelClassName:"slds-m-right_none"},l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_decrement",symbol:"ban",assistiveText:"Decrement counter",title:"Decrement counter"}),l().createElement(i.A,{id:"state-required",type:"number",placeholder:"1",required:!0}),l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_increment",symbol:"new",assistiveText:"Increment counter",title:"Increment counter"}))},{id:"error",label:"Error",element:l().createElement(a.ZS,{hasError:!0,labelContent:u,inputId:"state-error",errorId:"state-error-1",isRequired:!0,inlineMessage:"This field is required",labelClassName:"slds-m-right_none"},l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_decrement",symbol:"ban",assistiveText:"Decrement counter",title:"Decrement counter"}),l().createElement(i.A,{id:"state-error",type:"number",placeholder:"1",required:!0,"aria-describedby":"state-error-1"}),l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_increment",symbol:"new",assistiveText:"Increment counter",title:"Increment counter"}))}],b=[{id:"centered",label:"Label Centered",element:l().createElement(a.ZS,{formElementClassName:"slds-text-align_center",labelContent:u,inputId:"example-centered",labelClassName:"slds-m-right_none"},l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_decrement",symbol:"ban",assistiveText:"Decrement counter",title:"Decrement counter"}),l().createElement(i.A,{id:"example-centered",type:"number",placeholder:"1"}),l().createElement(c.A,{className:"slds-button_icon-small slds-input__button_increment",symbol:"new",assistiveText:"Increment counter",title:"Increment counter"}))}],f=n(806),p=o.XB.a,_=o.XB.h2,y=o.XB.h3,h=o.XB.h4,E=o.XB.p,v=function(){return(0,r.createElement)(o.Ay,{},(0,r.createElement)("div",{className:"doc lead"},"The Counter allows a user to increase or decrease a numerical value."),_({id:"About-Counter"},"About Counter"),E({},"A Counter is a ",p({href:"/components/form-element"},"Form Element")," containing a label and a number ",p({href:"/components/input"},"Input")," that can be increased or decreased using companion ",p({href:"/components/button-icons"},"Button Icons"),"."),y({id:"Accessibility"},"Accessibility"),E({},"To ensure the Counter is fully accessible, follow all guidelines for Button Icons and the error state on Inputs."),_({id:"Base"},"Base"),(0,r.createElement)(s.A,null,(0,f.NO)(d)),y({id:"States"},"States"),h({id:"Required"},"Required"),(0,r.createElement)(s.A,null,(0,f.NO)(m,"required")),h({id:"Error"},"Error"),(0,r.createElement)(s.A,null,(0,f.NO)(m,"error")),h({id:"Disabled"},"Disabled"),(0,r.createElement)(s.A,null,(0,f.NO)(m,"disabled")),h({id:"Read-only"},"Read-only"),(0,r.createElement)(s.A,null,(0,f.NO)(m,"read-only")),y({id:"Examples"},"Examples"),h({id:"Centered"},"Centered"),(0,r.createElement)(s.A,null,(0,f.NO)(b,"centered")))},O=function(){return(0,o.Qr)(v())}},5206:function(e){e.exports=ReactDOM}},l={};function o(e){var t=l[e];if(void 0!==t)return t.exports;var n=l[e]={id:e,exports:{}};return r[e](n,n.exports,o),n.exports}o.m=r,o.amdO={},e=[],o.O=function(t,n,r,l){if(!n){var s=1/0;for(u=0;u<e.length;u++){n=e[u][0],r=e[u][1],l=e[u][2];for(var a=!0,i=0;i<n.length;i++)(!1&l||s>=l)&&Object.keys(o.O).every(function(e){return o.O[e](n[i])})?n.splice(i--,1):(a=!1,l<s&&(s=l));if(a){e.splice(u--,1);var c=r();void 0!==c&&(t=c)}}return t}l=l||0;for(var u=e.length;u>0&&e[u-1][2]>l;u--)e[u]=e[u-1];e[u]=[n,r,l]},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,{a:t}),t},n=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},o.t=function(e,r){if(1&r&&(e=this(e)),8&r)return e;if("object"==typeof e&&e){if(4&r&&e.__esModule)return e;if(16&r&&"function"==typeof e.then)return e}var l=Object.create(null);o.r(l);var s={};t=t||[null,n({}),n([]),n(n)];for(var a=2&r&&e;("object"==typeof a||"function"==typeof a)&&!~t.indexOf(a);a=n(a))Object.getOwnPropertyNames(a).forEach(function(t){s[t]=function(){return e[t]}});return s.default=function(){return e},o.d(l,s),l},o.d=function(e,t){for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},o.e=function(){return Promise.resolve()},o.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.j=109,function(){var e={109:0};o.O.j=function(t){return 0===e[t]};var t=function(t,n){var r,l,s=n[0],a=n[1],i=n[2],c=0;if(s.some(function(t){return 0!==e[t]})){for(r in a)o.o(a,r)&&(o.m[r]=a[r]);if(i)var u=i(o)}for(t&&t(n);c<s.length;c++)l=s[c],o.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return o.O(u)},n=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))}(),o.nc=void 0;var s=o.O(void 0,[3540],function(){return o(5061)});s=o.O(s),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/counter/docs.mdx.js"]=s}();