UNPKG

@anoki/fse-ui

Version:

FSE UI components library

3 lines (2 loc) 2.63 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./components/ui/Feedback/Questions.css');const t=require("./index.cjs244.js");;/* empty css */const p=require("react"),d=require("./index.cjs28.js");function N({questions:n,onChangeAnswer:l,onSend:h,values:i,openAnswer:a,handleOpenAnswer:j,buttons:c,maxCharactersMessage:o,openAnswerPlaceholder:f}){const[e,x]=p.useState(0),g=p.useCallback((s,r)=>{l(s,r)},[l]),b=()=>{h()},v=()=>{!i[e]&&n[e].type!=="OPEN"||(e<n.length-1&&x(e+1),e===n.length-1&&b())},E=()=>{e>0&&x(e-1)};return t.jsxRuntimeExports.jsxs("div",{className:"steppers",children:[t.jsxRuntimeExports.jsxs("div",{className:"steppers-header pb-2 align-items-center",children:[t.jsxRuntimeExports.jsx("p",{className:"steppers-header-question-title",children:n[e].question}),t.jsxRuntimeExports.jsxs("span",{className:"steppers-header-question-number",children:[e+1,"/",n.length]})]}),t.jsxRuntimeExports.jsx("div",{className:"steppers-content","aria-live":"polite",children:n[e].type==="CLOSE"?t.jsxRuntimeExports.jsx("div",{className:"list-group",children:n[e].answers.map((s,r)=>{var u,m;return t.jsxRuntimeExports.jsxs("label",{htmlFor:`checkbox-${s.id}`,className:" fw-regular fs-6 list-group-item ",children:[t.jsxRuntimeExports.jsx("input",{type:"radio",id:`checkbox-${s.id}`,name:`question-${e}`,value:s.answer,checked:((m=(u=i==null?void 0:i[e])==null?void 0:u.answer)==null?void 0:m.includes(s))||!1,onChange:()=>g(n[e].id,s),className:"custom-control-input form-check-input me-2 black-focus"}),s.answer]},`${n[e].id}-${r}`)})}):t.jsxRuntimeExports.jsxs("div",{className:"form-group d-flex flex-column gap-1",children:[t.jsxRuntimeExports.jsx("input",{type:"text",placeholder:f,className:"form-control black-focus",value:a,onChange:s=>s.target.value.length<=200&&j(s.target.value),autoFocus:!0}),t.jsxRuntimeExports.jsxs("div",{className:"d-flex justify-content-between align-items-center max-chars-container",children:[o&&t.jsxRuntimeExports.jsx("p",{className:" fs-6 fw-normal ",children:o}),a&&a.length>0&&t.jsxRuntimeExports.jsxs("p",{className:"active fs-6 fw-normal ",children:[a.length,"/200"]})]})]})}),t.jsxRuntimeExports.jsxs("nav",{className:"steppers-nav no-border shadow-none align-items-center justify-content-center gap-4 flex-wrap",children:[t.jsxRuntimeExports.jsx(d.Button,{className:"feedback-button-back",onClick:E,disabled:e===0,children:c.previous}),t.jsxRuntimeExports.jsx(d.Button,{className:"feedback-button-next",onClick:v,disabled:e===n.length,children:c.next})]})]})}exports.Questions=N; //# sourceMappingURL=index.cjs443.js.map