UNPKG

@salesforce-ux/design-system

Version:
1 lines 6.14 kB
var SLDS;!function(){"use strict";var e,t,r,n={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},3459:function(e,t,r){r.r(t),r.d(t,{getContents:function(){return g},getElement:function(){return O}});var n=r(1594),o=r.n(n),a=r(5671),l=r(6547),c=(r(5619),r(806)),i=r(9285),d=r(942),s=r.n(d),u=function(e){return o().createElement("fieldset",{className:s()("slds-form-element",e.className)},o().createElement("legend",{className:"slds-form-element__legend slds-form-element__label"},"Scheduled Day(s)"),o().createElement("div",{className:"slds-form-element__control"},e.children))},f=function(e){return o().createElement("div",{className:s()("slds-checkbox_button-group",e.className)},e.children)},m=function(e){var t=c.Ay.uniqueId("unique-id-".concat(e.id,"-"));return o().createElement("span",{className:s()("slds-button slds-checkbox_button",e.className)},o().createElement("input",{"aria-describedby":e.errorId,disabled:e.disabled,defaultChecked:e.checked,id:t,value:t,name:"checkbox",type:"checkbox"}),o().createElement("label",{className:"slds-checkbox_button__label",htmlFor:t},o().createElement("span",{className:"slds-checkbox_faux"},e.children)))},b=[{id:"default",label:"Default",element:o().createElement(u,null,o().createElement(f,null,o().createElement(m,{id:"monday"},"Mon"),o().createElement(m,{id:"tuesday"},"Tue"),o().createElement(m,{id:"wednesday"},"Wed"),o().createElement(m,{id:"thursday"},"Thu"),o().createElement(m,{id:"friday"},"Fri")))}],h=[{id:"has-error",label:"Error",element:o().createElement(u,{className:"slds-has-error"},o().createElement(f,null,o().createElement(m,{errorId:"error_01",id:"monday"},"Mon"),o().createElement(m,{errorId:"error_01",id:"tuesday"},"Tue"),o().createElement(m,{errorId:"error_01",id:"wednesday"},"Wed"),o().createElement(m,{errorId:"error_01",id:"thursday"},"Thu"),o().createElement(m,{errorId:"error_01",id:"friday"},"Fri")),o().createElement("div",{id:"error_01",className:"slds-form-element__help"},"This field is required"))},{id:"disabled",label:"Disabled",element:o().createElement(u,null,o().createElement(f,null,o().createElement(m,{id:"monday",disabled:!0},"Mon"),o().createElement(m,{id:"tuesday",disabled:!0},"Tue"),o().createElement(m,{id:"wednesday",disabled:!0},"Wed"),o().createElement(m,{id:"thursday",disabled:!0},"Thu"),o().createElement(m,{id:"friday",disabled:!0},"Fri")))}],p=a.XB.a,y=a.XB.code,_=a.XB.h2,E=a.XB.h3,v=a.XB.p,O=function(){return(0,n.createElement)(a.Ay,{},(0,n.createElement)("div",{className:"doc lead"},"A styled checkable input group that communicates if an option(s) are true, false or indeterminate"),(0,n.createElement)(l.A,{exampleOnly:!0},(0,c.NO)(b)),_({id:"About-Checkbox-Button-Group"},"About Checkbox Button Group"),v({},"The checkbox-button-group is a set of ",p({href:"/components/checkbox-button"},"checkbox buttons")," wrapped in a fieldset that is also a ",p({href:"/components/form-element"},"form element"),". It is described by a legend with the classes ",y({},"slds-form-element__legend")," and ",y({},"slds-form-element__label")," applied to it."),E({id:"Mobile"},"Mobile"),(0,n.createElement)(i.s9,{patternSpecificText:"buttons in the checkbox button group will have an increased size to accommodate tapping with a finger instead of the more precise mouse cursor, as well as become stacked"}),(0,n.createElement)(l.A,{frameOnly:!0,frameTitle:"Example mobile styles for checkbox button groups"},(0,c.NO)(b)),_({id:"Base"},"Base"),(0,n.createElement)(l.A,null,(0,c.NO)(b)),_({id:"States"},"States"),E({id:"Has-Error"},"Has Error"),(0,n.createElement)(l.A,null,(0,c.NO)(h,"has-error")),E({id:"Disabled"},"Disabled"),(0,n.createElement)(l.A,null,(0,c.NO)(h,"disabled")))},g=function(){return(0,a.Qr)(O())}},5206:function(e){e.exports=ReactDOM}},o={};function a(e){var t=o[e];if(void 0!==t)return t.exports;var r=o[e]={id:e,exports:{}};return n[e](r,r.exports,a),r.exports}a.m=n,a.amdO={},e=[],a.O=function(t,r,n,o){if(!r){var l=1/0;for(s=0;s<e.length;s++){r=e[s][0],n=e[s][1],o=e[s][2];for(var c=!0,i=0;i<r.length;i++)(!1&o||l>=o)&&Object.keys(a.O).every(function(e){return a.O[e](r[i])})?r.splice(i--,1):(c=!1,o<l&&(l=o));if(c){e.splice(s--,1);var d=n();void 0!==d&&(t=d)}}return t}o=o||0;for(var s=e.length;s>0&&e[s-1][2]>o;s--)e[s]=e[s-1];e[s]=[r,n,o]},a.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(t,{a:t}),t},r=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},a.t=function(e,n){if(1&n&&(e=this(e)),8&n)return e;if("object"==typeof e&&e){if(4&n&&e.__esModule)return e;if(16&n&&"function"==typeof e.then)return e}var o=Object.create(null);a.r(o);var l={};t=t||[null,r({}),r([]),r(r)];for(var c=2&n&&e;("object"==typeof c||"function"==typeof c)&&!~t.indexOf(c);c=r(c))Object.getOwnPropertyNames(c).forEach(function(t){l[t]=function(){return e[t]}});return l.default=function(){return e},a.d(o,l),o},a.d=function(e,t){for(var r in t)a.o(t,r)&&!a.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},a.e=function(){return Promise.resolve()},a.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),a.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.j=4359,function(){var e={4359:0};a.O.j=function(t){return 0===e[t]};var t=function(t,r){var n,o,l=r[0],c=r[1],i=r[2],d=0;if(l.some(function(t){return 0!==e[t]})){for(n in c)a.o(c,n)&&(a.m[n]=c[n]);if(i)var s=i(a)}for(t&&t(r);d<l.length;d++)o=l[d],a.o(e,o)&&e[o]&&e[o][0](),e[o]=0;return a.O(s)},r=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs||[];r.forEach(t.bind(null,0)),r.push=t.bind(null,r.push.bind(r))}(),a.nc=void 0;var l=a.O(void 0,[3540],function(){return a(3459)});l=a.O(l),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/checkbox-button-group/docs.mdx.js"]=l}();