manja_ui_dev/dist/assets/InputGroup-BOyEk4XT.js

import{Bt as e,It as t,Lt as n,Mt as r,Qt as i,Vt as a,Xt as o,qt as s}from"./index-qNrWYJXL.js";var c={};function l(r,c){let l=o(`DocsComponents`),u=o(`CCardHeader`),d=o(`CInputGroupText`),f=o(`CFormInput`),p=o(`CInputGroup`),m=o(`CFormLabel`),h=o(`CFormTextarea`),g=o(`DocsExample`),_=o(`CCardBody`),v=o(`CCard`),y=o(`CCol`),b=o(`CFormCheck`),x=o(`CButton`),S=o(`CDropdownToggle`),C=o(`CDropdownItem`),w=o(`CDropdownDivider`),T=o(`CDropdownMenu`),E=o(`CDropdown`),D=o(`CFormSelect`),O=o(`CRow`);return s(),n(O,null,{default:i(()=>[a(y,{xs:12},{default:i(()=>[a(l,{href:`forms/input-group.html`}),a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[0]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Basic example`,-1)]]),_:1}),a(_,null,{default:i(()=>[c[9]||=t(`p`,{class:`text-body-secondary small`},[e(` Place one add-on or button on either side of an input. You may also place one on both sides of an input. Remember to place `),t(`code`,null,`<CFormLabel>`),e(`s outside the input group. `)],-1),a(g,{href:`forms/input-group.html`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(d,{id:`basic-addon1`},{default:i(()=>[...c[1]||=[e(`@`,-1)]]),_:1}),a(f,{placeholder:`Username`,"aria-label":`Username`,"aria-describedby":`basic-addon1`})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(f,{placeholder:`Recipient's username`,"aria-label":`Recipient's username`,"aria-describedby":`basic-addon2`}),a(d,{id:`basic-addon2`},{default:i(()=>[...c[2]||=[e(`@example.com`,-1)]]),_:1})]),_:1}),a(m,{for:`basic-url`},{default:i(()=>[...c[3]||=[e(`Your vanity URL`,-1)]]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(d,{id:`basic-addon3`},{default:i(()=>[...c[4]||=[e(`https://example.com/users/`,-1)]]),_:1}),a(f,{id:`basic-url`,"aria-describedby":`basic-addon3`})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(d,null,{default:i(()=>[...c[5]||=[e(`$`,-1)]]),_:1}),a(f,{"aria-label":`Amount (to the nearest dollar)`}),a(d,null,{default:i(()=>[...c[6]||=[e(`.00`,-1)]]),_:1})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(f,{placeholder:`Username`,"aria-label":`Username`}),a(d,null,{default:i(()=>[...c[7]||=[e(`@`,-1)]]),_:1}),a(f,{placeholder:`Server`,"aria-label":`Server`})]),_:1}),a(p,null,{default:i(()=>[a(d,null,{default:i(()=>[...c[8]||=[e(`With textarea`,-1)]]),_:1}),a(h,{"aria-label":`With textarea`})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[10]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Wrapping`,-1)]]),_:1}),a(_,null,{default:i(()=>[c[12]||=t(`p`,{class:`text-body-secondary small`},[e(` Input groups wrap by default via `),t(`code`,null,`flex-wrap: wrap`),e(` in order to accommodate custom form field validation within an input group. You may disable this with `),t(`code`,null,`.flex-nowrap`),e(`. `)],-1),a(g,{href:`forms/input-group.html#wrapping`},{default:i(()=>[a(p,{class:`flex-nowrap`},{default:i(()=>[a(d,{id:`addon-wrapping`},{default:i(()=>[...c[11]||=[e(`@`,-1)]]),_:1}),a(f,{placeholder:`Username`,"aria-label":`Username`,"aria-describedby":`addon-wrapping`})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[13]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Sizing`,-1)]]),_:1}),a(_,null,{default:i(()=>[c[17]||=t(`p`,{class:`text-body-secondary small`},[e(` Add the relative form sizing classes to the `),t(`code`,null,`<CInputGroup>`),e(` itself and contents within will automatically resize—no need for repeating the form control size classes on each element. `)],-1),c[18]||=t(`p`,{class:`text-body-secondary small`},[t(`strong`,null,`Sizing on the individual input group elements isn'tsupported.`)],-1),a(g,{href:`forms/input-group.html#sizing`},{default:i(()=>[a(p,{size:`sm`,class:`mb-3`},{default:i(()=>[a(d,{id:`inputGroup-sizing-sm`},{default:i(()=>[...c[14]||=[e(`Small`,-1)]]),_:1}),a(f,{"aria-label":`Sizing example input`,"aria-describedby":`inputGroup-sizing-sm`})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(d,{id:`inputGroup-sizing-default`},{default:i(()=>[...c[15]||=[e(`Default`,-1)]]),_:1}),a(f,{"aria-label":`Sizing example input`,"aria-describedby":`inputGroup-sizing-default`})]),_:1}),a(p,{size:`lg`},{default:i(()=>[a(d,{id:`inputGroup-sizing-lg`},{default:i(()=>[...c[16]||=[e(`Large`,-1)]]),_:1}),a(f,{"aria-label":`Sizing example input`,"aria-describedby":`inputGroup-sizing-lg`})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[19]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Checkboxes and radios`,-1)]]),_:1}),a(_,null,{default:i(()=>[c[20]||=t(`p`,{class:`text-body-secondary small`},` Place any checkbox or radio option within an input group's addon instead of text. `,-1),a(g,{href:`forms/input-group.html#checkboxes-and-radios`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(d,null,{default:i(()=>[a(b,{type:`checkbox`,value:``,"aria-label":`Checkbox for following text input`})]),_:1}),a(f,{"aria-label":`Text input with checkbox`})]),_:1}),a(p,null,{default:i(()=>[a(d,null,{default:i(()=>[a(b,{type:`radio`,value:``,"aria-label":`Radio button for following text input`})]),_:1}),a(f,{"aria-label":`Text input with radio button`})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[21]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Multiple inputs`,-1)]]),_:1}),a(_,null,{default:i(()=>[c[23]||=t(`p`,{class:`text-body-secondary small`},[e(` While multiple `),t(`code`,null,`<CFormInput>`),e(`s are supported visually, validation styles are only available for input groups with a single `),t(`code`,null,`<CFormInput>`),e(`. `)],-1),a(g,{href:`forms/input-group.html#multiple-inputs`},{default:i(()=>[a(p,null,{default:i(()=>[a(d,null,{default:i(()=>[...c[22]||=[e(`First and last name`,-1)]]),_:1}),a(f,{"aria-label":`First name`}),a(f,{"aria-label":`Last name`})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[24]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Multiple addons`,-1)]]),_:1}),a(_,null,{default:i(()=>[c[29]||=t(`p`,{class:`text-body-secondary small`},` Multiple add-ons are supported and can be mixed with checkbox and radio input versions.. `,-1),a(g,{href:`forms/input-group.html#multiple-addons`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(d,null,{default:i(()=>[...c[25]||=[e(`$`,-1)]]),_:1}),a(d,null,{default:i(()=>[...c[26]||=[e(`0.00`,-1)]]),_:1}),a(f,{"aria-label":`Dollar amount (with dot and two decimal places)`})]),_:1}),a(p,null,{default:i(()=>[a(f,{"aria-label":`Dollar amount (with dot and two decimal places)`}),a(d,null,{default:i(()=>[...c[27]||=[e(`$`,-1)]]),_:1}),a(d,null,{default:i(()=>[...c[28]||=[e(`0.00`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[30]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Button addons`,-1)]]),_:1}),a(_,null,{default:i(()=>[c[37]||=t(`p`,{class:`text-body-secondary small`},` Multiple add-ons are supported and can be mixed with checkbox and radio input versions.. `,-1),a(g,{href:`forms/input-group.html#button-addons`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(x,{id:`button-addon1`,type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[31]||=[e(` Button `,-1)]]),_:1}),a(f,{placeholder:``,"aria-label":`Example text with button addon`,"aria-describedby":`button-addon1`})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(f,{placeholder:`Recipient's username`,"aria-label":`Recipient's username`,"aria-describedby":`button-addon2`}),a(x,{id:`button-addon2`,type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[32]||=[e(` Button `,-1)]]),_:1})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[33]||=[e(` Button `,-1)]]),_:1}),a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[34]||=[e(` Button `,-1)]]),_:1}),a(f,{placeholder:``,"aria-label":`Example text with two button addons`})]),_:1}),a(p,null,{default:i(()=>[a(f,{placeholder:`Recipient's username`,"aria-label":`Recipient's username with two button addons`}),a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[35]||=[e(` Button `,-1)]]),_:1}),a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[36]||=[e(` Button `,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[38]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Buttons with dropdowns`,-1)]]),_:1}),a(_,null,{default:i(()=>[a(g,{href:`forms/input-group.html#buttons-with-dropdowns`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(E,{variant:`input-group`},{default:i(()=>[a(S,{color:`secondary`,variant:`outline`},{default:i(()=>[...c[39]||=[e(` Dropdown `,-1)]]),_:1}),a(T,null,{default:i(()=>[a(C,{href:`#`},{default:i(()=>[...c[40]||=[e(`Action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[41]||=[e(`Another action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[42]||=[e(`Something else here`,-1)]]),_:1}),a(w),a(C,{href:`#`},{default:i(()=>[...c[43]||=[e(`Separated link`,-1)]]),_:1})]),_:1})]),_:1}),a(f,{"aria-label":`Text input with dropdown button`})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(f,{"aria-label":`Text input with dropdown button`}),a(E,{alignment:`end`,variant:`input-group`},{default:i(()=>[a(S,{color:`secondary`,variant:`outline`},{default:i(()=>[...c[44]||=[e(` Dropdown `,-1)]]),_:1}),a(T,null,{default:i(()=>[a(C,{href:`#`},{default:i(()=>[...c[45]||=[e(`Action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[46]||=[e(`Another action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[47]||=[e(`Something else here`,-1)]]),_:1}),a(w),a(C,{href:`#`},{default:i(()=>[...c[48]||=[e(`Separated link`,-1)]]),_:1})]),_:1})]),_:1})]),_:1}),a(p,null,{default:i(()=>[a(E,{variant:`input-group`},{default:i(()=>[a(S,{color:`secondary`,variant:`outline`},{default:i(()=>[...c[49]||=[e(` Dropdown `,-1)]]),_:1}),a(T,null,{default:i(()=>[a(C,{href:`#`},{default:i(()=>[...c[50]||=[e(`Action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[51]||=[e(`Another action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[52]||=[e(`Something else here`,-1)]]),_:1}),a(w),a(C,{href:`#`},{default:i(()=>[...c[53]||=[e(`Separated link`,-1)]]),_:1})]),_:1})]),_:1}),a(f,{"aria-label":`Text input with 2 dropdown buttons`}),a(E,{alignment:`end`,variant:`input-group`},{default:i(()=>[a(S,{color:`secondary`,variant:`outline`},{default:i(()=>[...c[54]||=[e(` Dropdown `,-1)]]),_:1}),a(T,null,{default:i(()=>[a(C,{href:`#`},{default:i(()=>[...c[55]||=[e(`Action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[56]||=[e(`Another action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[57]||=[e(`Something else here`,-1)]]),_:1}),a(w),a(C,{href:`#`},{default:i(()=>[...c[58]||=[e(`Separated link`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[59]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Segmented buttons`,-1)]]),_:1}),a(_,null,{default:i(()=>[a(g,{href:`forms/input-group.html#segmented-buttons`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(E,{variant:`input-group`},{default:i(()=>[a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[60]||=[e(` Action `,-1)]]),_:1}),a(S,{color:`secondary`,variant:`outline`,split:``}),a(T,null,{default:i(()=>[a(C,{href:`#`},{default:i(()=>[...c[61]||=[e(`Action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[62]||=[e(`Another action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[63]||=[e(`Something else here`,-1)]]),_:1}),a(w),a(C,{href:`#`},{default:i(()=>[...c[64]||=[e(`Separated link`,-1)]]),_:1})]),_:1})]),_:1}),a(f,{"aria-label":`Text input with segmented dropdown button`})]),_:1}),a(p,null,{default:i(()=>[a(f,{"aria-label":`Text input with segmented dropdown button`}),a(E,{alignment:`end`,variant:`input-group`},{default:i(()=>[a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[65]||=[e(` Action `,-1)]]),_:1}),a(S,{color:`secondary`,variant:`outline`,split:``}),a(T,null,{default:i(()=>[a(C,{href:`#`},{default:i(()=>[...c[66]||=[e(`Action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[67]||=[e(`Another action`,-1)]]),_:1}),a(C,{href:`#`},{default:i(()=>[...c[68]||=[e(`Something else here`,-1)]]),_:1}),a(w),a(C,{href:`#`},{default:i(()=>[...c[69]||=[e(`Separated link`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[70]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Custom select`,-1)]]),_:1}),a(_,null,{default:i(()=>[a(g,{href:`forms/input-group.html#custom-select`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(d,{as:`label`,for:`inputGroupSelect01`},{default:i(()=>[...c[71]||=[e(` Options `,-1)]]),_:1}),a(D,{id:`inputGroupSelect01`},{default:i(()=>[...c[72]||=[t(`option`,null,`Choose...`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(D,{id:`inputGroupSelect02`},{default:i(()=>[...c[73]||=[t(`option`,null,`Choose...`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1}),a(d,{as:`label`,for:`inputGroupSelect02`},{default:i(()=>[...c[74]||=[e(` Options `,-1)]]),_:1})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[75]||=[e(` Button `,-1)]]),_:1}),a(D,{id:`inputGroupSelect03`,"aria-label":`Example select with button addon`},{default:i(()=>[...c[76]||=[t(`option`,null,`Choose...`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1})]),_:1}),a(p,null,{default:i(()=>[a(D,{id:`inputGroupSelect04`,"aria-label":`Example select with button addon`},{default:i(()=>[...c[77]||=[t(`option`,null,`Choose...`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1}),a(x,{type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[78]||=[e(` Button `,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(y,{xs:12},{default:i(()=>[a(v,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[79]||=[t(`strong`,null,`Vue Input group`,-1),e(),t(`small`,null,`Custom file input`,-1)]]),_:1}),a(_,null,{default:i(()=>[a(g,{href:`forms/input-group.html#custom-file-input`},{default:i(()=>[a(p,{class:`mb-3`},{default:i(()=>[a(d,{as:`label`,for:`inputGroupFile01`},{default:i(()=>[...c[80]||=[e(` Upload `,-1)]]),_:1}),a(f,{id:`inputGroupFile01`,type:`file`})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(f,{id:`inputGroupFile02`,type:`file`}),a(d,{as:`label`,for:`inputGroupFile02`},{default:i(()=>[...c[81]||=[e(` Upload `,-1)]]),_:1})]),_:1}),a(p,{class:`mb-3`},{default:i(()=>[a(x,{id:`inputGroupFileAddon03`,type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[82]||=[e(` Button `,-1)]]),_:1}),a(f,{id:`inputGroupFile03`,type:`file`,"aria-describedby":`inputGroupFileAddon03`,"aria-label":`Upload`})]),_:1}),a(p,null,{default:i(()=>[a(f,{id:`inputGroupFile04`,type:`file`,"aria-describedby":`inputGroupFileAddon04`,"aria-label":`Upload`}),a(x,{id:`inputGroupFileAddon04`,type:`button`,color:`secondary`,variant:`outline`},{default:i(()=>[...c[83]||=[e(` Button `,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var u=r(c,[[`render`,l]]);export{u as default};