@welshare/questionnaire 0.1.1 → 0.2.0

package/dist/node_modules/@welshare/questionnaire/src/components/questions/choice-question.tsx

@@ -1,68 +0,0 @@
-import { type ReactNode } from 'react';
-import type { QuestionnaireItem, QuestionnaireResponseAnswer } from '../../types/fhir.js';
-import { RadioInputProps } from '@/types/index.js';
-
-
-export interface ChoiceQuestionProps {
-  item: QuestionnaireItem;
-  currentAnswer?: QuestionnaireResponseAnswer;
-  onChoiceChange: (
-    valueCoding: { system?: string; code?: string; display?: string },
-    valueInteger?: number
-  ) => void;
-  choiceClassName?: string;
-  renderRadioInput?: (props: RadioInputProps) => ReactNode;
-}
-
-/**
- * Renders a single-select choice question with radio buttons
- */
-export const ChoiceQuestion = ({
-  item,
-  currentAnswer,
-  onChoiceChange,
-  choiceClassName = '',
-  renderRadioInput
-}: ChoiceQuestionProps) => {
-  return (
-    <div className={`wq-question-choice ${choiceClassName}`}>
-      {item.answerOption?.map((option, index) => {
-        const isSelected = currentAnswer?.valueCoding?.code === option.valueCoding?.code;
-        
-        // Use custom renderer if provided
-        if (renderRadioInput) {
-          return (
-            <div key={index}>
-              {renderRadioInput({
-                linkId: item.linkId,
-                valueCoding: option.valueCoding,
-                valueInteger: option.valueInteger,
-                checked: isSelected,
-                onChange: () => onChoiceChange(option.valueCoding || {}, option.valueInteger),
-                label: option.valueCoding?.display || '',
-                index
-              })}
-            </div>
-          );
-        }
-
-        // Default rendering
-        return (
-          <label key={index} className={`wq-choice-option ${isSelected ? 'wq-selected' : ''}`}>
-            <input
-              type="radio"
-              name={item.linkId}
-              value={option.valueCoding?.code}
-              checked={isSelected}
-              onChange={() => onChoiceChange(option.valueCoding || {}, option.valueInteger)}
-              data-wq-input="radio"
-              data-wq-selected={isSelected}
-            />
-            <span className="wq-choice-label">{option.valueCoding?.display}</span>
-          </label>
-        );
-      })}
-    </div>
-  );
-};
-

package/dist/node_modules/@welshare/questionnaire/src/components/questions/decimal-question.tsx

@@ -1,32 +0,0 @@
-import type {
-  QuestionnaireItem,
-  QuestionnaireResponseAnswer,
-} from "../../types/fhir.js";
-
-export interface DecimalQuestionProps {
-  item: QuestionnaireItem;
-  currentAnswer?: QuestionnaireResponseAnswer;
-  onDecimalChange: (value: string) => void;
-  inputClassName?: string;
-}
-
-/**
- * Renders a decimal question with number input
- */
-export const DecimalQuestion = ({
-  item,
-  currentAnswer,
-  onDecimalChange,
-  inputClassName = "",
-}: DecimalQuestionProps) => {
-  return (
-    <input
-      type="number"
-      className={`wq-question-input ${inputClassName}`}
-      value={currentAnswer?.valueDecimal ?? ""}
-      onChange={(e) => onDecimalChange(e.target.value)}
-      placeholder="Enter a number"
-      step="0.1"
-    />
-  );
-};

package/dist/node_modules/@welshare/questionnaire/src/components/questions/integer-question.tsx

@@ -1,87 +0,0 @@
-import type {
-  QuestionnaireItem,
-  QuestionnaireResponseAnswer,
-} from "../../types/fhir.js";
-
-export interface IntegerQuestionProps {
-  item: QuestionnaireItem;
-  currentAnswer?: QuestionnaireResponseAnswer;
-  onIntegerChange: (value: string) => void;
-  inputClassName?: string;
-  sliderConfig?: {
-    minValue: number;
-    maxValue: number;
-    step: number;
-    unit: string;
-  } | null;
-}
-
-/**
- * Renders an integer question with optional slider control
- */
-export const IntegerQuestion = ({
-  item,
-  currentAnswer,
-  onIntegerChange,
-  inputClassName = "",
-  sliderConfig,
-}: IntegerQuestionProps) => {
-  // Render slider if slider config is present
-  if (sliderConfig) {
-    // Use current answer, or fallback to initial value, or fallback to minValue
-    const initialValue = item.initial?.[0]?.valueInteger;
-    const value =
-      currentAnswer?.valueInteger ?? initialValue ?? sliderConfig.minValue;
-    const unit = sliderConfig.unit || "";
-
-    // Create abbreviated unit for range labels
-    const unitShort =
-      unit === "minutes"
-        ? "min"
-        : unit === "hours"
-          ? "hr"
-          : unit === "days per week"
-            ? "days"
-            : unit;
-
-    return (
-      <div className="wq-question-slider">
-        <input
-          type="range"
-          className={`wq-slider-input ${inputClassName}`}
-          min={sliderConfig.minValue}
-          max={sliderConfig.maxValue}
-          step={sliderConfig.step}
-          value={value}
-          onChange={(e) => onIntegerChange(e.target.value)}
-        />
-        <div className="wq-slider-value-display">
-          <span className="wq-slider-value">{value}</span>
-          {unit && <span className="wq-slider-unit">{unit}</span>}
-        </div>
-        <div className="wq-slider-range-labels">
-          <span className="wq-slider-min">
-            {sliderConfig.minValue}
-            {unitShort && ` ${unitShort}`}
-          </span>
-          <span className="wq-slider-max">
-            {sliderConfig.maxValue}
-            {unitShort && ` ${unitShort}`}
-          </span>
-        </div>
-      </div>
-    );
-  }
-
-  // Default number input
-  return (
-    <input
-      type="number"
-      className={`wq-question-input ${inputClassName}`}
-      value={currentAnswer?.valueInteger ?? ""}
-      onChange={(e) => onIntegerChange(e.target.value)}
-      placeholder="Enter a number"
-      step="1"
-    />
-  );
-};

package/dist/node_modules/@welshare/questionnaire/src/components/questions/multiple-choice-question.tsx

@@ -1,119 +0,0 @@
-import { type ReactNode } from "react";
-import type {
-  QuestionnaireItem,
-  QuestionnaireResponseAnswer,
-} from "../../types/fhir.js";
-import { CheckboxInputProps } from "../../types/index.js";
-
-export interface MultipleChoiceQuestionProps {
-  item: QuestionnaireItem;
-  currentAnswers: QuestionnaireResponseAnswer[];
-  onMultipleChoiceToggle: (
-    valueCoding: { system?: string; code?: string; display?: string },
-    valueInteger?: number
-  ) => void;
-  choiceClassName?: string;
-  renderCheckboxInput?: (props: CheckboxInputProps) => ReactNode;
-}
-
-/**
- * Renders a multi-select choice question with checkboxes
- * Supports exclusive options and maxAnswers limits
- */
-export const MultipleChoiceQuestion = ({
-  item,
-  currentAnswers,
-  onMultipleChoiceToggle,
-  choiceClassName = "",
-  renderCheckboxInput,
-}: MultipleChoiceQuestionProps) => {
-  const maxAnswers = item.maxAnswers || Number.MAX_SAFE_INTEGER;
-  const atMaxAnswers = currentAnswers.length >= maxAnswers;
-
-  // Check if there's an exclusive option extension
-  const exclusiveOptionExt = item.extension?.find(
-    (ext) =>
-      ext.url ===
-      "http://codes.welshare.app/StructureDefinition/questionnaire-exclusive-option"
-  );
-  const exclusiveOptionCode = exclusiveOptionExt?.valueString;
-
-  // Check if the exclusive option is currently selected
-  const exclusiveSelected =
-    exclusiveOptionCode &&
-    currentAnswers.some(
-      (answer) => answer.valueCoding?.code === exclusiveOptionCode
-    );
-
-  // Filter options to show: if exclusive option is selected, only show that one
-  const optionsToShow = exclusiveSelected
-    ? item.answerOption?.filter(
-        (opt) => opt.valueCoding?.code === exclusiveOptionCode
-      )
-    : item.answerOption;
-
-  return (
-    <div className={`wq-question-choice ${choiceClassName}`}>
-      {optionsToShow?.map((option, index) => {
-        const isSelected = currentAnswers.some(
-          (answer) => answer.valueCoding?.code === option.valueCoding?.code
-        );
-        const isDisabled = !isSelected && atMaxAnswers;
-
-        // Use custom renderer if provided
-        if (renderCheckboxInput) {
-          return (
-            <div key={index}>
-              {renderCheckboxInput({
-                linkId: item.linkId,
-                valueCoding: option.valueCoding,
-                valueInteger: option.valueInteger,
-                checked: isSelected,
-                disabled: isDisabled,
-                onChange: () =>
-                  onMultipleChoiceToggle(
-                    option.valueCoding || {},
-                    option.valueInteger
-                  ),
-                label: option.valueCoding?.display || "",
-                index,
-              })}
-            </div>
-          );
-        }
-
-        // Default rendering
-        return (
-          <label
-            key={index}
-            className={`wq-choice-option ${isSelected ? "wq-selected" : ""} ${isDisabled ? "wq-disabled" : ""}`}
-          >
-            <input
-              type="checkbox"
-              name={item.linkId}
-              value={option.valueCoding?.code}
-              checked={isSelected}
-              disabled={isDisabled}
-              onChange={() =>
-                onMultipleChoiceToggle(
-                  option.valueCoding || {},
-                  option.valueInteger
-                )
-              }
-              data-wq-input="checkbox"
-              data-wq-selected={isSelected}
-            />
-            <span className="wq-choice-label">
-              {option.valueCoding?.display}
-            </span>
-          </label>
-        );
-      })}
-      {item.maxAnswers && (
-        <div className="wq-max-answers-hint">
-          Selected: {currentAnswers.length} / {item.maxAnswers}
-        </div>
-      )}
-    </div>
-  );
-};

package/dist/node_modules/@welshare/questionnaire/src/components/questions/string-question.tsx

@@ -1,31 +0,0 @@
-import type {
-  QuestionnaireItem,
-  QuestionnaireResponseAnswer,
-} from "../../types/fhir.js";
-
-export interface StringQuestionProps {
-  item: QuestionnaireItem;
-  currentAnswer?: QuestionnaireResponseAnswer;
-  onStringChange: (value: string) => void;
-  inputClassName?: string;
-}
-
-/**
- * Renders a string or text question with text input
- */
-export const StringQuestion = ({
-  item,
-  currentAnswer,
-  onStringChange,
-  inputClassName = "",
-}: StringQuestionProps) => {
-  return (
-    <input
-      type="text"
-      className={`wq-question-input ${inputClassName}`}
-      value={currentAnswer?.valueString ?? ""}
-      onChange={(e) => onStringChange(e.target.value)}
-      placeholder="Enter your answer"
-    />
-  );
-};