markdown-flow-ui 0.2.6 → 0.2.7-dev.1

package/dist/components/ContentRender/plugins/CustomVariable.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomVariable.es.js","sources":["../../../../src/components/ContentRender/plugins/CustomVariable.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Components } from \"react-markdown\";\nimport { OnSendContentParams } from \"../../types\";\nimport { Button } from \"../../ui/button\";\nimport { Checkbox } from \"../../ui/checkbox\";\nimport MarkdownFlowInput from \"../MarkdownFlowInput\";\nimport {\n  InputGroup,\n  InputGroupTextarea,\n} from \"../../ui/inputGroup/input-group\";\nimport type { MarkdownFlowLocale } from \"../../../lib/locale\";\nimport { cn } from \"../../../lib/utils\";\nimport { getContentRenderLocaleTexts } from \"../contentRenderI18n\";\n\n// Define custom variable node type\ninterface CustomVariableNode {\n  tagName: \"custom-variable\";\n  properties?: {\n    variableName?: string;\n    buttonTexts?: string[];\n    buttonValues?: string[];\n    placeholder?: string;\n    isMultiSelect?: boolean;\n  };\n}\n\n// Define custom variable component Props type\ninterface CustomVariableProps {\n  node: CustomVariableNode;\n  defaultButtonText?: string;\n  defaultInputText?: string;\n  defaultSelectedValues?: string[];\n  locale?: MarkdownFlowLocale;\n  readonly?: boolean;\n  onSend?: (content: OnSendContentParams) => void;\n  // Multi-select confirm button text (i18n support)\n  confirmButtonText?: string;\n  beforeSend?: (param: OnSendContentParams) => boolean;\n}\n\ninterface ComponentsWithCustomVariable extends Components {\n  \"custom-variable\"?: React.ComponentType<CustomVariableProps>;\n}\n\n// Multi select section( with checkboxes and input)\ninterface MultiSelectSectionProps {\n  node: CustomVariableNode;\n  readonly?: boolean;\n  selectedValues: string[];\n  inputValue: string;\n  confirmButtonText: string;\n  handleCheckboxChange: (value: string, checked: boolean) => void;\n  handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  handleKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n  handleConfirmClick: () => void;\n}\n\nconst MultiSelectSection = ({\n  node,\n  readonly,\n  selectedValues,\n  inputValue,\n  confirmButtonText,\n  handleCheckboxChange,\n  handleInputChange,\n  handleKeyDown,\n  handleConfirmClick,\n}: MultiSelectSectionProps) => {\n  const placeholder = node.properties?.placeholder;\n  const confirmDisabled =\n    readonly || (selectedValues.length === 0 && !inputValue?.trim());\n\n  const renderConfirmButton = (extraWrapperClassName?: string) => (\n    <span\n      className={cn(\n        \"multi-select-confirm-wrapper flex flex-col items-center\",\n        confirmDisabled ? \"opacity-50 cursor-not-allowed\" : \"cursor-pointer\",\n        extraWrapperClassName\n      )}\n    >\n      <button\n        type=\"button\"\n        className=\"multi-select-confirm-button text-sm font-medium text-primary\"\n        disabled={confirmDisabled}\n        onClick={handleConfirmClick}\n      >\n        {confirmButtonText}\n      </button>\n    </span>\n  );\n\n  return (\n    <span className=\"multi-select-container flex w-full flex-col\">\n      <span className=\"flex flex-wrap gap-y-[9px] gap-x-6\">\n        {node.properties?.buttonTexts?.map((text, index) => {\n          const value = node.properties?.buttonValues?.[index];\n          const buttonValue = value !== undefined ? value : text;\n          return (\n            <Checkbox\n              key={index}\n              label={text}\n              disabled={readonly}\n              checked={selectedValues.includes(buttonValue)}\n              onCheckedChange={(checked) =>\n                handleCheckboxChange(buttonValue, checked)\n              }\n              className=\"text-sm\"\n            />\n          );\n        })}\n      </span>\n      {placeholder ? (\n        <span className=\"block mb-1 w-full max-w-[500px]\">\n          <span className=\"multi-select-input-row flex w-full items-end gap-3\">\n            <InputGroup data-disabled={readonly} className=\"flex-1\">\n              <InputGroupTextarea\n                disabled={readonly}\n                placeholder={placeholder}\n                value={inputValue}\n                onChange={handleInputChange}\n                onKeyDown={handleKeyDown}\n                className=\"text-sm px-3\"\n                title={placeholder}\n              />\n            </InputGroup>\n            {renderConfirmButton(\"shrink-0\")}\n          </span>\n        </span>\n      ) : (\n        renderConfirmButton(\"self-start multi-select-confirm-wrapper--stacked\")\n      )}\n    </span>\n  );\n};\n\n// Single select section( with buttons and input)\ninterface SingleSelectSectionProps {\n  node: CustomVariableNode;\n  readonly?: boolean;\n  locale?: MarkdownFlowLocale;\n  resolvedDefaultButtonText?: string;\n  handleButtonClick: (value: string) => void;\n  inputValue: string;\n  handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  handleSendClick: () => void;\n}\n\nconst SingleSelectSection = ({\n  node,\n  readonly,\n  locale,\n  resolvedDefaultButtonText,\n  handleButtonClick,\n  inputValue,\n  handleInputChange,\n  handleSendClick,\n}: SingleSelectSectionProps) => (\n  <span className=\"single-select-container inline-flex w-full flex-col\">\n    <span className=\"flex flex-wrap gap-y-[9px] gap-x-2\">\n      {node.properties?.buttonTexts?.map((text, index) => {\n        const value = node.properties?.buttonValues?.[index];\n        const buttonValue = value !== undefined ? value : text;\n        return (\n          <Button\n            key={index}\n            disabled={readonly}\n            variant=\"outline\"\n            type=\"button\"\n            size=\"sm\"\n            onClick={() => handleButtonClick(buttonValue)}\n            className={cn(\n              \"max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5\",\n              \"hover:bg-gray-200\",\n              resolvedDefaultButtonText === text && \"select\"\n            )}\n          >\n            {text}\n          </Button>\n        );\n      })}\n    </span>\n    {node.properties?.placeholder && (\n      <span className=\"mt-[9px] mb-1\">\n        <MarkdownFlowInput\n          disabled={readonly}\n          locale={locale}\n          placeholder={node.properties.placeholder}\n          value={inputValue}\n          onChange={handleInputChange}\n          onSend={handleSendClick}\n          title={node.properties.placeholder}\n        />\n      </span>\n    )}\n  </span>\n);\n\n// Pure input\ninterface InputSectionProps {\n  readonly?: boolean;\n  locale?: MarkdownFlowLocale;\n  placeholder?: string;\n  value: string;\n  onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  onSend: () => void;\n}\n\nconst InputSection = ({\n  readonly,\n  locale,\n  placeholder,\n  value,\n  onChange,\n  onSend,\n}: InputSectionProps) => {\n  if (!placeholder) {\n    return null;\n  }\n\n  return (\n    <MarkdownFlowInput\n      disabled={readonly}\n      locale={locale}\n      placeholder={placeholder}\n      value={value}\n      onChange={onChange}\n      onSend={onSend}\n      title={placeholder}\n    />\n  );\n};\n\n// Define custom variable component\nconst CustomButtonInputVariable = ({\n  node,\n  readonly,\n  locale,\n  defaultButtonText,\n  defaultInputText,\n  defaultSelectedValues,\n  onSend,\n  confirmButtonText,\n  beforeSend = () => true,\n}: CustomVariableProps) => {\n  const localeTexts = getContentRenderLocaleTexts(locale);\n  const resolvedConfirmButtonText =\n    confirmButtonText || localeTexts.confirmButtonText;\n  const [inputValue, setInputValue] = React.useState(defaultInputText || \"\");\n  const [selectedValues, setSelectedValues] = React.useState<string[]>(\n    defaultSelectedValues || []\n  );\n  const isMultiSelect = node.properties?.isMultiSelect ?? false;\n  const baseButtonTexts = node.properties?.buttonTexts || [];\n  const shouldUseFallbackButton =\n    !isMultiSelect &&\n    baseButtonTexts.length === 0 &&\n    !node.properties?.placeholder;\n  const fallbackButtonLabel =\n    node.properties?.variableName?.trim() ||\n    defaultButtonText ||\n    resolvedConfirmButtonText;\n\n  const singleSelectNode = React.useMemo<CustomVariableNode>(() => {\n    if (!shouldUseFallbackButton) {\n      return node;\n    }\n    return {\n      ...node,\n      properties: {\n        ...(node.properties || {}),\n        buttonTexts: [fallbackButtonLabel],\n        buttonValues: [fallbackButtonLabel],\n      },\n    };\n  }, [fallbackButtonLabel, node, shouldUseFallbackButton]);\n\n  const singleSelectButtonTexts =\n    singleSelectNode.properties?.buttonTexts || [];\n  const singleSelectButtonValues =\n    singleSelectNode.properties?.buttonValues || [];\n  const isSingleSelect = !isMultiSelect && singleSelectButtonTexts.length > 0;\n\n  const handleButtonClick = (value: string) => {\n    const param = {\n      variableName: node.properties?.variableName || \"\",\n      buttonText: value,\n    };\n    if (!beforeSend?.(param)) return;\n    onSend?.(param);\n  };\n\n  const handleCheckboxChange = (value: string, checked: boolean) => {\n    setSelectedValues((prev) => {\n      if (checked) {\n        return [...prev, value];\n      } else {\n        return prev.filter((v) => v !== value);\n      }\n    });\n  };\n\n  const handleConfirmClick = () => {\n    const noSelection = selectedValues.length === 0 && !inputValue?.trim();\n    const param = {\n      variableName: node.properties?.variableName || \"\",\n      selectedValues,\n      inputText: inputValue?.trim() || undefined,\n    };\n    if (readonly || noSelection) return;\n    if (!beforeSend?.(param)) return;\n    onSend?.(param);\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setInputValue(e.target.value);\n  };\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.nativeEvent.isComposing || e.keyCode === 229) {\n      return;\n    }\n    if (e.key === \"Enter\" && !e.shiftKey) {\n      e.preventDefault();\n      if (isMultiSelect) {\n        const noSelection = selectedValues.length === 0 && !inputValue.trim();\n        if (!noSelection) handleConfirmClick();\n      } else {\n        handleSendClick();\n      }\n    }\n  };\n  const handleSendClick = () => {\n    const param = {\n      variableName: node.properties?.variableName || \"\",\n      inputText: inputValue,\n    };\n    if (!beforeSend?.(param)) return;\n    onSend?.(param);\n  };\n\n  const resolvedDefaultButtonText = React.useMemo(() => {\n    if (!defaultButtonText) {\n      return undefined;\n    }\n    const valueIndex = singleSelectButtonValues.indexOf(defaultButtonText);\n    if (valueIndex > -1) {\n      return singleSelectButtonTexts[valueIndex] ?? defaultButtonText;\n    }\n    const textIndex = singleSelectButtonTexts.indexOf(defaultButtonText);\n    if (textIndex > -1) {\n      return singleSelectButtonTexts[textIndex];\n    }\n    return undefined;\n  }, [defaultButtonText, singleSelectButtonTexts, singleSelectButtonValues]);\n\n  React.useEffect(() => {\n    setInputValue(defaultInputText || \"\");\n  }, [defaultInputText, node]);\n\n  React.useEffect(() => {\n    setSelectedValues(defaultSelectedValues || []);\n  }, [defaultSelectedValues, node]);\n\n  return (\n    <span className=\"custom-variable-container inline-flex items-center flex-wrap\">\n      {isMultiSelect && (\n        <MultiSelectSection\n          node={node}\n          readonly={readonly}\n          selectedValues={selectedValues}\n          inputValue={inputValue}\n          confirmButtonText={resolvedConfirmButtonText}\n          handleCheckboxChange={handleCheckboxChange}\n          handleInputChange={handleInputChange}\n          handleKeyDown={handleKeyDown}\n          handleConfirmClick={handleConfirmClick}\n        />\n      )}\n\n      {!isMultiSelect && isSingleSelect && (\n        <SingleSelectSection\n          node={singleSelectNode}\n          readonly={readonly}\n          locale={locale}\n          resolvedDefaultButtonText={resolvedDefaultButtonText}\n          handleButtonClick={handleButtonClick}\n          inputValue={inputValue}\n          handleInputChange={handleInputChange}\n          handleSendClick={handleSendClick}\n        />\n      )}\n\n      {!isMultiSelect && !isSingleSelect && node.properties?.placeholder && (\n        <InputSection\n          readonly={readonly}\n          locale={locale}\n          placeholder={node.properties.placeholder}\n          value={inputValue}\n          onChange={handleInputChange}\n          onSend={handleSendClick}\n        />\n      )}\n    </span>\n  );\n};\n\nexport default CustomButtonInputVariable;\nexport type {\n  ComponentsWithCustomVariable,\n  CustomVariableNode,\n  CustomVariableProps,\n};\n"],"names":["MultiSelectSection","node","readonly","selectedValues","inputValue","confirmButtonText","handleCheckboxChange","handleInputChange","handleKeyDown","handleConfirmClick","placeholder","confirmDisabled","renderConfirmButton","extraWrapperClassName","jsx","cn","jsxs","text","index","value","buttonValue","Checkbox","checked","InputGroup","InputGroupTextarea","SingleSelectSection","locale","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","localeTexts","getContentRenderLocaleTexts","resolvedConfirmButtonText","setInputValue","React","setSelectedValues","isMultiSelect","baseButtonTexts","shouldUseFallbackButton","fallbackButtonLabel","singleSelectNode","singleSelectButtonTexts","singleSelectButtonValues","isSingleSelect","param","prev","v","noSelection","e","valueIndex","textIndex"],"mappings":"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"}
+{"version":3,"file":"CustomVariable.es.js","sources":["../../../../src/components/ContentRender/plugins/CustomVariable.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Components } from \"react-markdown\";\nimport { OnSendContentParams } from \"../../types\";\nimport { Button } from \"../../ui/button\";\nimport { Checkbox } from \"../../ui/checkbox\";\nimport MarkdownFlowInput from \"../MarkdownFlowInput\";\nimport {\n  InputGroup,\n  InputGroupTextarea,\n} from \"../../ui/inputGroup/input-group\";\nimport type { MarkdownFlowLocale } from \"../../../lib/locale\";\nimport { cn } from \"../../../lib/utils\";\nimport { getContentRenderLocaleTexts } from \"../contentRenderI18n\";\n\n// Define custom variable node type\ninterface CustomVariableNode {\n  tagName: \"custom-variable\";\n  properties?: {\n    variableName?: string;\n    buttonTexts?: string[];\n    buttonValues?: string[];\n    placeholder?: string;\n    isMultiSelect?: boolean;\n  };\n}\n\n// Define custom variable component Props type\ninterface CustomVariableProps {\n  node: CustomVariableNode;\n  defaultButtonText?: string;\n  defaultInputText?: string;\n  defaultSelectedValues?: string[];\n  locale?: MarkdownFlowLocale;\n  readonly?: boolean;\n  onSend?: (content: OnSendContentParams) => void;\n  // Multi-select confirm button text (i18n support)\n  confirmButtonText?: string;\n  beforeSend?: (param: OnSendContentParams) => boolean;\n}\n\ninterface ComponentsWithCustomVariable extends Components {\n  \"custom-variable\"?: React.ComponentType<CustomVariableProps>;\n}\n\n// Multi select section( with checkboxes and input)\ninterface MultiSelectSectionProps {\n  node: CustomVariableNode;\n  readonly?: boolean;\n  selectedValues: string[];\n  inputValue: string;\n  confirmButtonText: string;\n  handleCheckboxChange: (value: string, checked: boolean) => void;\n  handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  handleKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n  handleConfirmClick: () => void;\n}\n\nconst MultiSelectSection = ({\n  node,\n  readonly,\n  selectedValues,\n  inputValue,\n  confirmButtonText,\n  handleCheckboxChange,\n  handleInputChange,\n  handleKeyDown,\n  handleConfirmClick,\n}: MultiSelectSectionProps) => {\n  const placeholder = node.properties?.placeholder;\n  const confirmDisabled =\n    readonly || (selectedValues.length === 0 && !inputValue?.trim());\n\n  const renderConfirmButton = (extraWrapperClassName?: string) => (\n    <span\n      className={cn(\n        \"multi-select-confirm-wrapper flex flex-col items-center\",\n        confirmDisabled ? \"opacity-50 cursor-not-allowed\" : \"cursor-pointer\",\n        extraWrapperClassName\n      )}\n    >\n      <button\n        type=\"button\"\n        className=\"multi-select-confirm-button text-sm font-medium text-primary\"\n        disabled={confirmDisabled}\n        onClick={handleConfirmClick}\n      >\n        {confirmButtonText}\n      </button>\n    </span>\n  );\n\n  return (\n    <span className=\"multi-select-container flex w-full flex-col\">\n      <span className=\"flex flex-wrap gap-y-[9px] gap-x-6\">\n        {node.properties?.buttonTexts?.map((text, index) => {\n          const value = node.properties?.buttonValues?.[index];\n          const buttonValue = value !== undefined ? value : text;\n          return (\n            <Checkbox\n              key={index}\n              label={text}\n              disabled={readonly}\n              checked={selectedValues.includes(buttonValue)}\n              onCheckedChange={(checked) =>\n                handleCheckboxChange(buttonValue, checked)\n              }\n              className=\"text-sm\"\n            />\n          );\n        })}\n      </span>\n      {placeholder ? (\n        <span className=\"block mb-1 w-full max-w-[500px]\">\n          <span className=\"multi-select-input-row flex w-full items-end gap-3\">\n            <InputGroup data-disabled={readonly} className=\"flex-1\">\n              <InputGroupTextarea\n                disabled={readonly}\n                placeholder={placeholder}\n                value={inputValue}\n                onChange={handleInputChange}\n                onKeyDown={handleKeyDown}\n                className=\"text-sm px-3\"\n                title={placeholder}\n              />\n            </InputGroup>\n            {renderConfirmButton(\"shrink-0\")}\n          </span>\n        </span>\n      ) : (\n        renderConfirmButton(\"self-start multi-select-confirm-wrapper--stacked\")\n      )}\n    </span>\n  );\n};\n\n// Single select section( with buttons and input)\ninterface SingleSelectSectionProps {\n  node: CustomVariableNode;\n  readonly?: boolean;\n  locale?: MarkdownFlowLocale;\n  resolvedDefaultButtonText?: string;\n  handleButtonClick: (value: string) => void;\n  inputValue: string;\n  handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  handleSendClick: () => void;\n}\n\nconst SingleSelectSection = ({\n  node,\n  readonly,\n  locale,\n  resolvedDefaultButtonText,\n  handleButtonClick,\n  inputValue,\n  handleInputChange,\n  handleSendClick,\n}: SingleSelectSectionProps) => (\n  <span className=\"single-select-container inline-flex w-full flex-col\">\n    <span className=\"flex flex-wrap gap-y-[9px] gap-x-2\">\n      {node.properties?.buttonTexts?.map((text, index) => {\n        const value = node.properties?.buttonValues?.[index];\n        const buttonValue = value !== undefined ? value : text;\n        return (\n          <Button\n            key={index}\n            disabled={readonly}\n            variant=\"outline\"\n            type=\"button\"\n            size=\"sm\"\n            onClick={() => handleButtonClick(buttonValue)}\n            className={cn(\n              \"max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5\",\n              \"hover:bg-gray-200\",\n              resolvedDefaultButtonText === text && \"select\"\n            )}\n          >\n            {text}\n          </Button>\n        );\n      })}\n    </span>\n    {node.properties?.placeholder && (\n      <span className=\"mt-[9px] mb-1\">\n        <MarkdownFlowInput\n          disabled={readonly}\n          locale={locale}\n          placeholder={node.properties.placeholder}\n          value={inputValue}\n          onChange={handleInputChange}\n          onSend={handleSendClick}\n          title={node.properties.placeholder}\n        />\n      </span>\n    )}\n  </span>\n);\n\n// Pure input\ninterface InputSectionProps {\n  readonly?: boolean;\n  locale?: MarkdownFlowLocale;\n  placeholder?: string;\n  value: string;\n  onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  onSend: () => void;\n}\n\nconst InputSection = ({\n  readonly,\n  locale,\n  placeholder,\n  value,\n  onChange,\n  onSend,\n}: InputSectionProps) => {\n  if (!placeholder) {\n    return null;\n  }\n\n  return (\n    <MarkdownFlowInput\n      disabled={readonly}\n      locale={locale}\n      placeholder={placeholder}\n      value={value}\n      onChange={onChange}\n      onSend={onSend}\n      title={placeholder}\n    />\n  );\n};\n\n// Define custom variable component\nconst CustomButtonInputVariable = ({\n  node,\n  readonly,\n  locale,\n  defaultButtonText,\n  defaultInputText,\n  defaultSelectedValues,\n  onSend,\n  confirmButtonText,\n  beforeSend = () => true,\n}: CustomVariableProps) => {\n  const localeTexts = getContentRenderLocaleTexts(locale);\n  const resolvedConfirmButtonText =\n    confirmButtonText || localeTexts.confirmButtonText;\n  const [inputValue, setInputValue] = React.useState(defaultInputText || \"\");\n  const [selectedValues, setSelectedValues] = React.useState<string[]>(\n    defaultSelectedValues || []\n  );\n  const interactionDefinitionKey = JSON.stringify({\n    buttonTexts: node.properties?.buttonTexts,\n    buttonValues: node.properties?.buttonValues,\n    isMultiSelect: node.properties?.isMultiSelect,\n    placeholder: node.properties?.placeholder,\n    variableName: node.properties?.variableName,\n  });\n  const isMultiSelect = node.properties?.isMultiSelect ?? false;\n  const baseButtonTexts = node.properties?.buttonTexts || [];\n  const shouldUseFallbackButton =\n    !isMultiSelect &&\n    baseButtonTexts.length === 0 &&\n    !node.properties?.placeholder;\n  const fallbackButtonLabel =\n    node.properties?.variableName?.trim() ||\n    defaultButtonText ||\n    resolvedConfirmButtonText;\n\n  const singleSelectNode = React.useMemo<CustomVariableNode>(() => {\n    if (!shouldUseFallbackButton) {\n      return node;\n    }\n    return {\n      ...node,\n      properties: {\n        ...(node.properties || {}),\n        buttonTexts: [fallbackButtonLabel],\n        buttonValues: [fallbackButtonLabel],\n      },\n    };\n  }, [fallbackButtonLabel, node, shouldUseFallbackButton]);\n\n  const singleSelectButtonTexts =\n    singleSelectNode.properties?.buttonTexts || [];\n  const singleSelectButtonValues =\n    singleSelectNode.properties?.buttonValues || [];\n  const isSingleSelect = !isMultiSelect && singleSelectButtonTexts.length > 0;\n\n  const handleButtonClick = (value: string) => {\n    const param = {\n      variableName: node.properties?.variableName || \"\",\n      buttonText: value,\n    };\n    if (!beforeSend?.(param)) return;\n    onSend?.(param);\n  };\n\n  const handleCheckboxChange = (value: string, checked: boolean) => {\n    setSelectedValues((prev) => {\n      if (checked) {\n        return [...prev, value];\n      } else {\n        return prev.filter((v) => v !== value);\n      }\n    });\n  };\n\n  const handleConfirmClick = () => {\n    const noSelection = selectedValues.length === 0 && !inputValue?.trim();\n    const param = {\n      variableName: node.properties?.variableName || \"\",\n      selectedValues,\n      inputText: inputValue?.trim() || undefined,\n    };\n    if (readonly || noSelection) return;\n    if (!beforeSend?.(param)) return;\n    onSend?.(param);\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setInputValue(e.target.value);\n  };\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.nativeEvent.isComposing || e.keyCode === 229) {\n      return;\n    }\n    if (e.key === \"Enter\" && !e.shiftKey) {\n      e.preventDefault();\n      if (isMultiSelect) {\n        const noSelection = selectedValues.length === 0 && !inputValue.trim();\n        if (!noSelection) handleConfirmClick();\n      } else {\n        handleSendClick();\n      }\n    }\n  };\n  const handleSendClick = () => {\n    const param = {\n      variableName: node.properties?.variableName || \"\",\n      inputText: inputValue,\n    };\n    if (!beforeSend?.(param)) return;\n    onSend?.(param);\n  };\n\n  const resolvedDefaultButtonText = React.useMemo(() => {\n    if (!defaultButtonText) {\n      return undefined;\n    }\n    const valueIndex = singleSelectButtonValues.indexOf(defaultButtonText);\n    if (valueIndex > -1) {\n      return singleSelectButtonTexts[valueIndex] ?? defaultButtonText;\n    }\n    const textIndex = singleSelectButtonTexts.indexOf(defaultButtonText);\n    if (textIndex > -1) {\n      return singleSelectButtonTexts[textIndex];\n    }\n    return undefined;\n  }, [defaultButtonText, singleSelectButtonTexts, singleSelectButtonValues]);\n\n  React.useEffect(() => {\n    setInputValue(defaultInputText || \"\");\n  }, [defaultInputText, interactionDefinitionKey]);\n\n  React.useEffect(() => {\n    setSelectedValues(defaultSelectedValues || []);\n  }, [defaultSelectedValues, interactionDefinitionKey]);\n\n  return (\n    <span className=\"custom-variable-container inline-flex items-center flex-wrap\">\n      {isMultiSelect && (\n        <MultiSelectSection\n          node={node}\n          readonly={readonly}\n          selectedValues={selectedValues}\n          inputValue={inputValue}\n          confirmButtonText={resolvedConfirmButtonText}\n          handleCheckboxChange={handleCheckboxChange}\n          handleInputChange={handleInputChange}\n          handleKeyDown={handleKeyDown}\n          handleConfirmClick={handleConfirmClick}\n        />\n      )}\n\n      {!isMultiSelect && isSingleSelect && (\n        <SingleSelectSection\n          node={singleSelectNode}\n          readonly={readonly}\n          locale={locale}\n          resolvedDefaultButtonText={resolvedDefaultButtonText}\n          handleButtonClick={handleButtonClick}\n          inputValue={inputValue}\n          handleInputChange={handleInputChange}\n          handleSendClick={handleSendClick}\n        />\n      )}\n\n      {!isMultiSelect && !isSingleSelect && node.properties?.placeholder && (\n        <InputSection\n          readonly={readonly}\n          locale={locale}\n          placeholder={node.properties.placeholder}\n          value={inputValue}\n          onChange={handleInputChange}\n          onSend={handleSendClick}\n        />\n      )}\n    </span>\n  );\n};\n\nexport default CustomButtonInputVariable;\nexport type {\n  ComponentsWithCustomVariable,\n  CustomVariableNode,\n  CustomVariableProps,\n};\n"],"names":["MultiSelectSection","node","readonly","selectedValues","inputValue","confirmButtonText","handleCheckboxChange","handleInputChange","handleKeyDown","handleConfirmClick","placeholder","confirmDisabled","renderConfirmButton","extraWrapperClassName","jsx","cn","jsxs","text","index","value","buttonValue","Checkbox","checked","InputGroup","InputGroupTextarea","SingleSelectSection","locale","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","localeTexts","getContentRenderLocaleTexts","resolvedConfirmButtonText","setInputValue","React","setSelectedValues","interactionDefinitionKey","isMultiSelect","baseButtonTexts","shouldUseFallbackButton","fallbackButtonLabel","singleSelectNode","singleSelectButtonTexts","singleSelectButtonValues","isSingleSelect","param","prev","v","noSelection","e","valueIndex","textIndex"],"mappings":"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"}

package/dist/lib/mobileDevice.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=/Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i,b=/iPad|Tablet/i,l=e=>{const t=window.navigator?.userAgent??"";return{hasMobileUserAgent:v.test(t),hasTabletLikeUserAgent:b.test(t)}},d=({hasMobileUserAgent:e,hasTabletLikeUserAgent:i})=>e||i,p=e=>e?.includes("landscape")?!0:e?.includes("portrait")?!1:null,u=({matchMediaLandscape:e,orientationType:i,innerWidth:t,innerHeight:r,visualViewportWidth:n,visualViewportHeight:o})=>{if(typeof e=="boolean")return e;const s=p(i);if(s!==null)return s;const c=typeof n=="number"&&n>0?n:t,a=typeof o=="number"&&o>0?o:r;return typeof c!="number"||typeof a!="number"?!1:c>a},w=e=>d(l()),M=e=>{const i=window,t=typeof i.matchMedia=="function"?i.matchMedia("(orientation: landscape)").matches:void 0;return u({matchMediaLandscape:t,orientationType:i.screen?.orientation?.type,innerWidth:i.innerWidth,innerHeight:i.innerHeight,visualViewportWidth:i.visualViewport?.width,visualViewportHeight:i.visualViewport?.height})},E=(e,i)=>{const t=window,r=t.screen?.orientation,n=t.visualViewport;return t.addEventListener("orientationchange",e),t.addEventListener("resize",e),r?.addEventListener?.("change",e),n?.addEventListener("resize",e),()=>{t.removeEventListener("orientationchange",e),t.removeEventListener("resize",e),r?.removeEventListener?.("change",e),n?.removeEventListener("resize",e)}};exports.getMobileDeviceCapabilities=l;exports.isLandscapeViewport=M;exports.isMobileDevice=w;exports.resolveMobileDevice=d;exports.resolveMobileViewportLandscape=u;exports.subscribeMobileDeviceChange=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=/Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i,l=/iPad|Tablet/i,o=e=>{const i=window.navigator?.userAgent??"";return{hasMobileUserAgent:a.test(i),hasTabletLikeUserAgent:l.test(i)}},s=({hasMobileUserAgent:e,hasTabletLikeUserAgent:n})=>e||n,d=e=>e?.includes("landscape")?!0:e?.includes("portrait")?!1:null,c=({matchMediaLandscape:e,orientationType:n,innerWidth:i,innerHeight:t})=>{const r=d(n);return r!==null?r:typeof e=="boolean"?e:typeof i!="number"||typeof t!="number"?!1:i>t},u=e=>s(o()),b=e=>{const n=window,i=typeof n.matchMedia=="function"?n.matchMedia("(orientation: landscape)").matches:void 0;return c({matchMediaLandscape:i,orientationType:n.screen?.orientation?.type,innerWidth:n.innerWidth,innerHeight:n.innerHeight})},p=(e,n)=>{const i=window,t=i.screen?.orientation;return i.addEventListener("orientationchange",e),t?.addEventListener?.("change",e),()=>{i.removeEventListener("orientationchange",e),t?.removeEventListener?.("change",e)}};exports.getMobileDeviceCapabilities=o;exports.isLandscapeViewport=b;exports.isMobileDevice=u;exports.resolveMobileDevice=s;exports.resolveMobileViewportLandscape=c;exports.subscribeMobileDeviceChange=p;
 //# sourceMappingURL=mobileDevice.cjs.js.map

package/dist/lib/mobileDevice.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobileDevice.cjs.js","sources":["../../src/lib/mobileDevice.ts"],"sourcesContent":["export type MobileDeviceCapabilities = {\n  hasMobileUserAgent: boolean;\n  hasTabletLikeUserAgent: boolean;\n};\n\nexport type MobileViewportOrientation = {\n  matchMediaLandscape?: boolean;\n  orientationType?: string;\n  innerWidth?: number;\n  innerHeight?: number;\n  visualViewportWidth?: number;\n  visualViewportHeight?: number;\n};\n\nconst MOBILE_USER_AGENT_PATTERN =\n  /Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i;\nconst TABLET_USER_AGENT_PATTERN = /iPad|Tablet/i;\n\nexport const getMobileDeviceCapabilities = (\n  win?: Window\n): MobileDeviceCapabilities => {\n  const currentWindow = win ?? window;\n  const userAgent = currentWindow.navigator?.userAgent ?? \"\";\n\n  return {\n    hasMobileUserAgent: MOBILE_USER_AGENT_PATTERN.test(userAgent),\n    hasTabletLikeUserAgent: TABLET_USER_AGENT_PATTERN.test(userAgent),\n  };\n};\n\nexport const resolveMobileDevice = ({\n  hasMobileUserAgent,\n  hasTabletLikeUserAgent,\n}: MobileDeviceCapabilities): boolean => {\n  return hasMobileUserAgent || hasTabletLikeUserAgent;\n};\n\nconst resolveLandscapeFromOrientationType = (\n  orientationType?: string\n): boolean | null => {\n  if (orientationType?.includes(\"landscape\")) {\n    return true;\n  }\n\n  if (orientationType?.includes(\"portrait\")) {\n    return false;\n  }\n\n  return null;\n};\n\nexport const resolveMobileViewportLandscape = ({\n  matchMediaLandscape,\n  orientationType,\n  innerWidth,\n  innerHeight,\n  visualViewportWidth,\n  visualViewportHeight,\n}: MobileViewportOrientation): boolean => {\n  if (typeof matchMediaLandscape === \"boolean\") {\n    return matchMediaLandscape;\n  }\n\n  const orientationLandscape =\n    resolveLandscapeFromOrientationType(orientationType);\n\n  if (orientationLandscape !== null) {\n    return orientationLandscape;\n  }\n\n  const viewportWidth =\n    typeof visualViewportWidth === \"number\" && visualViewportWidth > 0\n      ? visualViewportWidth\n      : innerWidth;\n  const viewportHeight =\n    typeof visualViewportHeight === \"number\" && visualViewportHeight > 0\n      ? visualViewportHeight\n      : innerHeight;\n\n  if (typeof viewportWidth !== \"number\" || typeof viewportHeight !== \"number\") {\n    return false;\n  }\n\n  return viewportWidth > viewportHeight;\n};\n\nexport const isMobileDevice = (win?: Window): boolean =>\n  resolveMobileDevice(getMobileDeviceCapabilities(win));\n\nexport const isLandscapeViewport = (win?: Window): boolean => {\n  const currentWindow = win ?? window;\n  const matchMediaLandscape =\n    typeof currentWindow.matchMedia === \"function\"\n      ? currentWindow.matchMedia(\"(orientation: landscape)\").matches\n      : undefined;\n\n  return resolveMobileViewportLandscape({\n    matchMediaLandscape,\n    orientationType: currentWindow.screen?.orientation?.type,\n    innerWidth: currentWindow.innerWidth,\n    innerHeight: currentWindow.innerHeight,\n    visualViewportWidth: currentWindow.visualViewport?.width,\n    visualViewportHeight: currentWindow.visualViewport?.height,\n  });\n};\n\nexport const subscribeMobileDeviceChange = (\n  onChange: () => void,\n  win?: Window\n) => {\n  const currentWindow = win ?? window;\n  const screenOrientation = currentWindow.screen?.orientation;\n  const visualViewport = currentWindow.visualViewport;\n\n  currentWindow.addEventListener(\"orientationchange\", onChange);\n  currentWindow.addEventListener(\"resize\", onChange);\n  screenOrientation?.addEventListener?.(\"change\", onChange);\n  visualViewport?.addEventListener(\"resize\", onChange);\n\n  return () => {\n    currentWindow.removeEventListener(\"orientationchange\", onChange);\n    currentWindow.removeEventListener(\"resize\", onChange);\n    screenOrientation?.removeEventListener?.(\"change\", onChange);\n    visualViewport?.removeEventListener(\"resize\", onChange);\n  };\n};\n"],"names":["MOBILE_USER_AGENT_PATTERN","TABLET_USER_AGENT_PATTERN","getMobileDeviceCapabilities","win","userAgent","resolveMobileDevice","hasMobileUserAgent","hasTabletLikeUserAgent","resolveLandscapeFromOrientationType","orientationType","resolveMobileViewportLandscape","matchMediaLandscape","innerWidth","innerHeight","visualViewportWidth","visualViewportHeight","orientationLandscape","viewportWidth","viewportHeight","isMobileDevice","isLandscapeViewport","currentWindow","subscribeMobileDeviceChange","onChange","screenOrientation","visualViewport"],"mappings":"gFAcA,MAAMA,EACJ,mEACIC,EAA4B,eAErBC,EACXC,GAC6B,CAE7B,MAAMC,EADuB,OACG,WAAW,WAAa,GAExD,MAAO,CACL,mBAAoBJ,EAA0B,KAAKI,CAAS,EAC5D,uBAAwBH,EAA0B,KAAKG,CAAS,CAAA,CAEpE,EAEaC,EAAsB,CAAC,CAClC,mBAAAC,EACA,uBAAAC,CACF,IACSD,GAAsBC,EAGzBC,EACJC,GAEIA,GAAiB,SAAS,WAAW,EAChC,GAGLA,GAAiB,SAAS,UAAU,EAC/B,GAGF,KAGIC,EAAiC,CAAC,CAC7C,oBAAAC,EACA,gBAAAF,EACA,WAAAG,EACA,YAAAC,EACA,oBAAAC,EACA,qBAAAC,CACF,IAA0C,CACxC,GAAI,OAAOJ,GAAwB,UACjC,OAAOA,EAGT,MAAMK,EACJR,EAAoCC,CAAe,EAErD,GAAIO,IAAyB,KAC3B,OAAOA,EAGT,MAAMC,EACJ,OAAOH,GAAwB,UAAYA,EAAsB,EAC7DA,EACAF,EACAM,EACJ,OAAOH,GAAyB,UAAYA,EAAuB,EAC/DA,EACAF,EAEN,OAAI,OAAOI,GAAkB,UAAY,OAAOC,GAAmB,SAC1D,GAGFD,EAAgBC,CACzB,EAEaC,EAAkBhB,GAC7BE,EAAoBH,EAA+B,CAAC,EAEzCkB,EAAuBjB,GAA0B,CAC5D,MAAMkB,EAAuB,OACvBV,EACJ,OAAOU,EAAc,YAAe,WAChCA,EAAc,WAAW,0BAA0B,EAAE,QACrD,OAEN,OAAOX,EAA+B,CACpC,oBAAAC,EACA,gBAAiBU,EAAc,QAAQ,aAAa,KACpD,WAAYA,EAAc,WAC1B,YAAaA,EAAc,YAC3B,oBAAqBA,EAAc,gBAAgB,MACnD,qBAAsBA,EAAc,gBAAgB,MAAA,CACrD,CACH,EAEaC,EAA8B,CACzCC,EACApB,IACG,CACH,MAAMkB,EAAuB,OACvBG,EAAoBH,EAAc,QAAQ,YAC1CI,EAAiBJ,EAAc,eAErC,OAAAA,EAAc,iBAAiB,oBAAqBE,CAAQ,EAC5DF,EAAc,iBAAiB,SAAUE,CAAQ,EACjDC,GAAmB,mBAAmB,SAAUD,CAAQ,EACxDE,GAAgB,iBAAiB,SAAUF,CAAQ,EAE5C,IAAM,CACXF,EAAc,oBAAoB,oBAAqBE,CAAQ,EAC/DF,EAAc,oBAAoB,SAAUE,CAAQ,EACpDC,GAAmB,sBAAsB,SAAUD,CAAQ,EAC3DE,GAAgB,oBAAoB,SAAUF,CAAQ,CACxD,CACF"}
+{"version":3,"file":"mobileDevice.cjs.js","sources":["../../src/lib/mobileDevice.ts"],"sourcesContent":["export type MobileDeviceCapabilities = {\n  hasMobileUserAgent: boolean;\n  hasTabletLikeUserAgent: boolean;\n};\n\nexport type MobileViewportOrientation = {\n  matchMediaLandscape?: boolean;\n  orientationType?: string;\n  innerWidth?: number;\n  innerHeight?: number;\n};\n\nconst MOBILE_USER_AGENT_PATTERN =\n  /Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i;\nconst TABLET_USER_AGENT_PATTERN = /iPad|Tablet/i;\n\nexport const getMobileDeviceCapabilities = (\n  win?: Window\n): MobileDeviceCapabilities => {\n  const currentWindow = win ?? window;\n  const userAgent = currentWindow.navigator?.userAgent ?? \"\";\n\n  return {\n    hasMobileUserAgent: MOBILE_USER_AGENT_PATTERN.test(userAgent),\n    hasTabletLikeUserAgent: TABLET_USER_AGENT_PATTERN.test(userAgent),\n  };\n};\n\nexport const resolveMobileDevice = ({\n  hasMobileUserAgent,\n  hasTabletLikeUserAgent,\n}: MobileDeviceCapabilities): boolean => {\n  return hasMobileUserAgent || hasTabletLikeUserAgent;\n};\n\nconst resolveLandscapeFromOrientationType = (\n  orientationType?: string\n): boolean | null => {\n  if (orientationType?.includes(\"landscape\")) {\n    return true;\n  }\n\n  if (orientationType?.includes(\"portrait\")) {\n    return false;\n  }\n\n  return null;\n};\n\nexport const resolveMobileViewportLandscape = ({\n  matchMediaLandscape,\n  orientationType,\n  innerWidth,\n  innerHeight,\n}: MobileViewportOrientation): boolean => {\n  const orientationLandscape =\n    resolveLandscapeFromOrientationType(orientationType);\n\n  if (orientationLandscape !== null) {\n    return orientationLandscape;\n  }\n\n  if (typeof matchMediaLandscape === \"boolean\") {\n    return matchMediaLandscape;\n  }\n\n  if (typeof innerWidth !== \"number\" || typeof innerHeight !== \"number\") {\n    return false;\n  }\n\n  return innerWidth > innerHeight;\n};\n\nexport const isMobileDevice = (win?: Window): boolean =>\n  resolveMobileDevice(getMobileDeviceCapabilities(win));\n\nexport const isLandscapeViewport = (win?: Window): boolean => {\n  const currentWindow = win ?? window;\n  const matchMediaLandscape =\n    typeof currentWindow.matchMedia === \"function\"\n      ? currentWindow.matchMedia(\"(orientation: landscape)\").matches\n      : undefined;\n\n  return resolveMobileViewportLandscape({\n    matchMediaLandscape,\n    orientationType: currentWindow.screen?.orientation?.type,\n    innerWidth: currentWindow.innerWidth,\n    innerHeight: currentWindow.innerHeight,\n  });\n};\n\nexport const subscribeMobileDeviceChange = (\n  onChange: () => void,\n  win?: Window\n) => {\n  const currentWindow = win ?? window;\n  const screenOrientation = currentWindow.screen?.orientation;\n\n  currentWindow.addEventListener(\"orientationchange\", onChange);\n  screenOrientation?.addEventListener?.(\"change\", onChange);\n\n  return () => {\n    currentWindow.removeEventListener(\"orientationchange\", onChange);\n    screenOrientation?.removeEventListener?.(\"change\", onChange);\n  };\n};\n"],"names":["MOBILE_USER_AGENT_PATTERN","TABLET_USER_AGENT_PATTERN","getMobileDeviceCapabilities","win","userAgent","resolveMobileDevice","hasMobileUserAgent","hasTabletLikeUserAgent","resolveLandscapeFromOrientationType","orientationType","resolveMobileViewportLandscape","matchMediaLandscape","innerWidth","innerHeight","orientationLandscape","isMobileDevice","isLandscapeViewport","currentWindow","subscribeMobileDeviceChange","onChange","screenOrientation"],"mappings":"gFAYA,MAAMA,EACJ,mEACIC,EAA4B,eAErBC,EACXC,GAC6B,CAE7B,MAAMC,EADuB,OACG,WAAW,WAAa,GAExD,MAAO,CACL,mBAAoBJ,EAA0B,KAAKI,CAAS,EAC5D,uBAAwBH,EAA0B,KAAKG,CAAS,CAAA,CAEpE,EAEaC,EAAsB,CAAC,CAClC,mBAAAC,EACA,uBAAAC,CACF,IACSD,GAAsBC,EAGzBC,EACJC,GAEIA,GAAiB,SAAS,WAAW,EAChC,GAGLA,GAAiB,SAAS,UAAU,EAC/B,GAGF,KAGIC,EAAiC,CAAC,CAC7C,oBAAAC,EACA,gBAAAF,EACA,WAAAG,EACA,YAAAC,CACF,IAA0C,CACxC,MAAMC,EACJN,EAAoCC,CAAe,EAErD,OAAIK,IAAyB,KACpBA,EAGL,OAAOH,GAAwB,UAC1BA,EAGL,OAAOC,GAAe,UAAY,OAAOC,GAAgB,SACpD,GAGFD,EAAaC,CACtB,EAEaE,EAAkBZ,GAC7BE,EAAoBH,EAA+B,CAAC,EAEzCc,EAAuBb,GAA0B,CAC5D,MAAMc,EAAuB,OACvBN,EACJ,OAAOM,EAAc,YAAe,WAChCA,EAAc,WAAW,0BAA0B,EAAE,QACrD,OAEN,OAAOP,EAA+B,CACpC,oBAAAC,EACA,gBAAiBM,EAAc,QAAQ,aAAa,KACpD,WAAYA,EAAc,WAC1B,YAAaA,EAAc,WAAA,CAC5B,CACH,EAEaC,EAA8B,CACzCC,EACAhB,IACG,CACH,MAAMc,EAAuB,OACvBG,EAAoBH,EAAc,QAAQ,YAEhD,OAAAA,EAAc,iBAAiB,oBAAqBE,CAAQ,EAC5DC,GAAmB,mBAAmB,SAAUD,CAAQ,EAEjD,IAAM,CACXF,EAAc,oBAAoB,oBAAqBE,CAAQ,EAC/DC,GAAmB,sBAAsB,SAAUD,CAAQ,CAC7D,CACF"}

package/dist/lib/mobileDevice.d.ts

@@ -7,12 +7,10 @@ export type MobileViewportOrientation = {
     orientationType?: string;
     innerWidth?: number;
     innerHeight?: number;
-    visualViewportWidth?: number;
-    visualViewportHeight?: number;
 };
 export declare const getMobileDeviceCapabilities: (win?: Window) => MobileDeviceCapabilities;
 export declare const resolveMobileDevice: ({ hasMobileUserAgent, hasTabletLikeUserAgent, }: MobileDeviceCapabilities) => boolean;
-export declare const resolveMobileViewportLandscape: ({ matchMediaLandscape, orientationType, innerWidth, innerHeight, visualViewportWidth, visualViewportHeight, }: MobileViewportOrientation) => boolean;
+export declare const resolveMobileViewportLandscape: ({ matchMediaLandscape, orientationType, innerWidth, innerHeight, }: MobileViewportOrientation) => boolean;
 export declare const isMobileDevice: (win?: Window) => boolean;
 export declare const isLandscapeViewport: (win?: Window) => boolean;
 export declare const subscribeMobileDeviceChange: (onChange: () => void, win?: Window) => () => void;

package/dist/lib/mobileDevice.es.js

@@ -1,49 +1,40 @@
-const d = /Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i, u = /iPad|Tablet/i, l = (e) => {
-  const n = window.navigator?.userAgent ?? "";
+const o = /Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i, s = /iPad|Tablet/i, c = (e) => {
+  const t = window.navigator?.userAgent ?? "";
   return {
-    hasMobileUserAgent: d.test(n),
-    hasTabletLikeUserAgent: u.test(n)
+    hasMobileUserAgent: o.test(t),
+    hasTabletLikeUserAgent: s.test(t)
   };
-}, v = ({
+}, a = ({
   hasMobileUserAgent: e,
-  hasTabletLikeUserAgent: t
-}) => e || t, p = (e) => e?.includes("landscape") ? !0 : e?.includes("portrait") ? !1 : null, w = ({
+  hasTabletLikeUserAgent: n
+}) => e || n, d = (e) => e?.includes("landscape") ? !0 : e?.includes("portrait") ? !1 : null, l = ({
   matchMediaLandscape: e,
-  orientationType: t,
-  innerWidth: n,
-  innerHeight: r,
-  visualViewportWidth: i,
-  visualViewportHeight: o
+  orientationType: n,
+  innerWidth: t,
+  innerHeight: i
 }) => {
-  if (typeof e == "boolean")
-    return e;
-  const s = p(t);
-  if (s !== null)
-    return s;
-  const c = typeof i == "number" && i > 0 ? i : n, a = typeof o == "number" && o > 0 ? o : r;
-  return typeof c != "number" || typeof a != "number" ? !1 : c > a;
-}, b = (e) => v(l()), E = (e) => {
-  const t = window, n = typeof t.matchMedia == "function" ? t.matchMedia("(orientation: landscape)").matches : void 0;
-  return w({
-    matchMediaLandscape: n,
-    orientationType: t.screen?.orientation?.type,
-    innerWidth: t.innerWidth,
-    innerHeight: t.innerHeight,
-    visualViewportWidth: t.visualViewport?.width,
-    visualViewportHeight: t.visualViewport?.height
+  const r = d(n);
+  return r !== null ? r : typeof e == "boolean" ? e : typeof t != "number" || typeof i != "number" ? !1 : t > i;
+}, u = (e) => a(c()), p = (e) => {
+  const n = window, t = typeof n.matchMedia == "function" ? n.matchMedia("(orientation: landscape)").matches : void 0;
+  return l({
+    matchMediaLandscape: t,
+    orientationType: n.screen?.orientation?.type,
+    innerWidth: n.innerWidth,
+    innerHeight: n.innerHeight
   });
-}, L = (e, t) => {
-  const n = window, r = n.screen?.orientation, i = n.visualViewport;
-  return n.addEventListener("orientationchange", e), n.addEventListener("resize", e), r?.addEventListener?.("change", e), i?.addEventListener("resize", e), () => {
-    n.removeEventListener("orientationchange", e), n.removeEventListener("resize", e), r?.removeEventListener?.("change", e), i?.removeEventListener("resize", e);
+}, b = (e, n) => {
+  const t = window, i = t.screen?.orientation;
+  return t.addEventListener("orientationchange", e), i?.addEventListener?.("change", e), () => {
+    t.removeEventListener("orientationchange", e), i?.removeEventListener?.("change", e);
   };
 };
 export {
-  l as getMobileDeviceCapabilities,
-  E as isLandscapeViewport,
-  b as isMobileDevice,
-  v as resolveMobileDevice,
-  w as resolveMobileViewportLandscape,
-  L as subscribeMobileDeviceChange
+  c as getMobileDeviceCapabilities,
+  p as isLandscapeViewport,
+  u as isMobileDevice,
+  a as resolveMobileDevice,
+  l as resolveMobileViewportLandscape,
+  b as subscribeMobileDeviceChange
 };
 //# sourceMappingURL=mobileDevice.es.js.map

package/dist/lib/mobileDevice.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobileDevice.es.js","sources":["../../src/lib/mobileDevice.ts"],"sourcesContent":["export type MobileDeviceCapabilities = {\n  hasMobileUserAgent: boolean;\n  hasTabletLikeUserAgent: boolean;\n};\n\nexport type MobileViewportOrientation = {\n  matchMediaLandscape?: boolean;\n  orientationType?: string;\n  innerWidth?: number;\n  innerHeight?: number;\n  visualViewportWidth?: number;\n  visualViewportHeight?: number;\n};\n\nconst MOBILE_USER_AGENT_PATTERN =\n  /Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i;\nconst TABLET_USER_AGENT_PATTERN = /iPad|Tablet/i;\n\nexport const getMobileDeviceCapabilities = (\n  win?: Window\n): MobileDeviceCapabilities => {\n  const currentWindow = win ?? window;\n  const userAgent = currentWindow.navigator?.userAgent ?? \"\";\n\n  return {\n    hasMobileUserAgent: MOBILE_USER_AGENT_PATTERN.test(userAgent),\n    hasTabletLikeUserAgent: TABLET_USER_AGENT_PATTERN.test(userAgent),\n  };\n};\n\nexport const resolveMobileDevice = ({\n  hasMobileUserAgent,\n  hasTabletLikeUserAgent,\n}: MobileDeviceCapabilities): boolean => {\n  return hasMobileUserAgent || hasTabletLikeUserAgent;\n};\n\nconst resolveLandscapeFromOrientationType = (\n  orientationType?: string\n): boolean | null => {\n  if (orientationType?.includes(\"landscape\")) {\n    return true;\n  }\n\n  if (orientationType?.includes(\"portrait\")) {\n    return false;\n  }\n\n  return null;\n};\n\nexport const resolveMobileViewportLandscape = ({\n  matchMediaLandscape,\n  orientationType,\n  innerWidth,\n  innerHeight,\n  visualViewportWidth,\n  visualViewportHeight,\n}: MobileViewportOrientation): boolean => {\n  if (typeof matchMediaLandscape === \"boolean\") {\n    return matchMediaLandscape;\n  }\n\n  const orientationLandscape =\n    resolveLandscapeFromOrientationType(orientationType);\n\n  if (orientationLandscape !== null) {\n    return orientationLandscape;\n  }\n\n  const viewportWidth =\n    typeof visualViewportWidth === \"number\" && visualViewportWidth > 0\n      ? visualViewportWidth\n      : innerWidth;\n  const viewportHeight =\n    typeof visualViewportHeight === \"number\" && visualViewportHeight > 0\n      ? visualViewportHeight\n      : innerHeight;\n\n  if (typeof viewportWidth !== \"number\" || typeof viewportHeight !== \"number\") {\n    return false;\n  }\n\n  return viewportWidth > viewportHeight;\n};\n\nexport const isMobileDevice = (win?: Window): boolean =>\n  resolveMobileDevice(getMobileDeviceCapabilities(win));\n\nexport const isLandscapeViewport = (win?: Window): boolean => {\n  const currentWindow = win ?? window;\n  const matchMediaLandscape =\n    typeof currentWindow.matchMedia === \"function\"\n      ? currentWindow.matchMedia(\"(orientation: landscape)\").matches\n      : undefined;\n\n  return resolveMobileViewportLandscape({\n    matchMediaLandscape,\n    orientationType: currentWindow.screen?.orientation?.type,\n    innerWidth: currentWindow.innerWidth,\n    innerHeight: currentWindow.innerHeight,\n    visualViewportWidth: currentWindow.visualViewport?.width,\n    visualViewportHeight: currentWindow.visualViewport?.height,\n  });\n};\n\nexport const subscribeMobileDeviceChange = (\n  onChange: () => void,\n  win?: Window\n) => {\n  const currentWindow = win ?? window;\n  const screenOrientation = currentWindow.screen?.orientation;\n  const visualViewport = currentWindow.visualViewport;\n\n  currentWindow.addEventListener(\"orientationchange\", onChange);\n  currentWindow.addEventListener(\"resize\", onChange);\n  screenOrientation?.addEventListener?.(\"change\", onChange);\n  visualViewport?.addEventListener(\"resize\", onChange);\n\n  return () => {\n    currentWindow.removeEventListener(\"orientationchange\", onChange);\n    currentWindow.removeEventListener(\"resize\", onChange);\n    screenOrientation?.removeEventListener?.(\"change\", onChange);\n    visualViewport?.removeEventListener(\"resize\", onChange);\n  };\n};\n"],"names":["MOBILE_USER_AGENT_PATTERN","TABLET_USER_AGENT_PATTERN","getMobileDeviceCapabilities","win","userAgent","resolveMobileDevice","hasMobileUserAgent","hasTabletLikeUserAgent","resolveLandscapeFromOrientationType","orientationType","resolveMobileViewportLandscape","matchMediaLandscape","innerWidth","innerHeight","visualViewportWidth","visualViewportHeight","orientationLandscape","viewportWidth","viewportHeight","isMobileDevice","isLandscapeViewport","currentWindow","subscribeMobileDeviceChange","onChange","screenOrientation","visualViewport"],"mappings":"AAcA,MAAMA,IACJ,oEACIC,IAA4B,gBAErBC,IAA8B,CACzCC,MAC6B;AAE7B,QAAMC,IADuB,OACG,WAAW,aAAa;AAExD,SAAO;AAAA,IACL,oBAAoBJ,EAA0B,KAAKI,CAAS;AAAA,IAC5D,wBAAwBH,EAA0B,KAAKG,CAAS;AAAA,EAAA;AAEpE,GAEaC,IAAsB,CAAC;AAAA,EAClC,oBAAAC;AAAA,EACA,wBAAAC;AACF,MACSD,KAAsBC,GAGzBC,IAAsC,CAC1CC,MAEIA,GAAiB,SAAS,WAAW,IAChC,KAGLA,GAAiB,SAAS,UAAU,IAC/B,KAGF,MAGIC,IAAiC,CAAC;AAAA,EAC7C,qBAAAC;AAAA,EACA,iBAAAF;AAAA,EACA,YAAAG;AAAA,EACA,aAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,sBAAAC;AACF,MAA0C;AACxC,MAAI,OAAOJ,KAAwB;AACjC,WAAOA;AAGT,QAAMK,IACJR,EAAoCC,CAAe;AAErD,MAAIO,MAAyB;AAC3B,WAAOA;AAGT,QAAMC,IACJ,OAAOH,KAAwB,YAAYA,IAAsB,IAC7DA,IACAF,GACAM,IACJ,OAAOH,KAAyB,YAAYA,IAAuB,IAC/DA,IACAF;AAEN,SAAI,OAAOI,KAAkB,YAAY,OAAOC,KAAmB,WAC1D,KAGFD,IAAgBC;AACzB,GAEaC,IAAiB,CAAChB,MAC7BE,EAAoBH,EAA+B,CAAC,GAEzCkB,IAAsB,CAACjB,MAA0B;AAC5D,QAAMkB,IAAuB,QACvBV,IACJ,OAAOU,EAAc,cAAe,aAChCA,EAAc,WAAW,0BAA0B,EAAE,UACrD;AAEN,SAAOX,EAA+B;AAAA,IACpC,qBAAAC;AAAA,IACA,iBAAiBU,EAAc,QAAQ,aAAa;AAAA,IACpD,YAAYA,EAAc;AAAA,IAC1B,aAAaA,EAAc;AAAA,IAC3B,qBAAqBA,EAAc,gBAAgB;AAAA,IACnD,sBAAsBA,EAAc,gBAAgB;AAAA,EAAA,CACrD;AACH,GAEaC,IAA8B,CACzCC,GACApB,MACG;AACH,QAAMkB,IAAuB,QACvBG,IAAoBH,EAAc,QAAQ,aAC1CI,IAAiBJ,EAAc;AAErC,SAAAA,EAAc,iBAAiB,qBAAqBE,CAAQ,GAC5DF,EAAc,iBAAiB,UAAUE,CAAQ,GACjDC,GAAmB,mBAAmB,UAAUD,CAAQ,GACxDE,GAAgB,iBAAiB,UAAUF,CAAQ,GAE5C,MAAM;AACX,IAAAF,EAAc,oBAAoB,qBAAqBE,CAAQ,GAC/DF,EAAc,oBAAoB,UAAUE,CAAQ,GACpDC,GAAmB,sBAAsB,UAAUD,CAAQ,GAC3DE,GAAgB,oBAAoB,UAAUF,CAAQ;AAAA,EACxD;AACF;"}
+{"version":3,"file":"mobileDevice.es.js","sources":["../../src/lib/mobileDevice.ts"],"sourcesContent":["export type MobileDeviceCapabilities = {\n  hasMobileUserAgent: boolean;\n  hasTabletLikeUserAgent: boolean;\n};\n\nexport type MobileViewportOrientation = {\n  matchMediaLandscape?: boolean;\n  orientationType?: string;\n  innerWidth?: number;\n  innerHeight?: number;\n};\n\nconst MOBILE_USER_AGENT_PATTERN =\n  /Android|webOS|iPhone|iPod|BlackBerry|IEMobile|Opera Mini|Mobile/i;\nconst TABLET_USER_AGENT_PATTERN = /iPad|Tablet/i;\n\nexport const getMobileDeviceCapabilities = (\n  win?: Window\n): MobileDeviceCapabilities => {\n  const currentWindow = win ?? window;\n  const userAgent = currentWindow.navigator?.userAgent ?? \"\";\n\n  return {\n    hasMobileUserAgent: MOBILE_USER_AGENT_PATTERN.test(userAgent),\n    hasTabletLikeUserAgent: TABLET_USER_AGENT_PATTERN.test(userAgent),\n  };\n};\n\nexport const resolveMobileDevice = ({\n  hasMobileUserAgent,\n  hasTabletLikeUserAgent,\n}: MobileDeviceCapabilities): boolean => {\n  return hasMobileUserAgent || hasTabletLikeUserAgent;\n};\n\nconst resolveLandscapeFromOrientationType = (\n  orientationType?: string\n): boolean | null => {\n  if (orientationType?.includes(\"landscape\")) {\n    return true;\n  }\n\n  if (orientationType?.includes(\"portrait\")) {\n    return false;\n  }\n\n  return null;\n};\n\nexport const resolveMobileViewportLandscape = ({\n  matchMediaLandscape,\n  orientationType,\n  innerWidth,\n  innerHeight,\n}: MobileViewportOrientation): boolean => {\n  const orientationLandscape =\n    resolveLandscapeFromOrientationType(orientationType);\n\n  if (orientationLandscape !== null) {\n    return orientationLandscape;\n  }\n\n  if (typeof matchMediaLandscape === \"boolean\") {\n    return matchMediaLandscape;\n  }\n\n  if (typeof innerWidth !== \"number\" || typeof innerHeight !== \"number\") {\n    return false;\n  }\n\n  return innerWidth > innerHeight;\n};\n\nexport const isMobileDevice = (win?: Window): boolean =>\n  resolveMobileDevice(getMobileDeviceCapabilities(win));\n\nexport const isLandscapeViewport = (win?: Window): boolean => {\n  const currentWindow = win ?? window;\n  const matchMediaLandscape =\n    typeof currentWindow.matchMedia === \"function\"\n      ? currentWindow.matchMedia(\"(orientation: landscape)\").matches\n      : undefined;\n\n  return resolveMobileViewportLandscape({\n    matchMediaLandscape,\n    orientationType: currentWindow.screen?.orientation?.type,\n    innerWidth: currentWindow.innerWidth,\n    innerHeight: currentWindow.innerHeight,\n  });\n};\n\nexport const subscribeMobileDeviceChange = (\n  onChange: () => void,\n  win?: Window\n) => {\n  const currentWindow = win ?? window;\n  const screenOrientation = currentWindow.screen?.orientation;\n\n  currentWindow.addEventListener(\"orientationchange\", onChange);\n  screenOrientation?.addEventListener?.(\"change\", onChange);\n\n  return () => {\n    currentWindow.removeEventListener(\"orientationchange\", onChange);\n    screenOrientation?.removeEventListener?.(\"change\", onChange);\n  };\n};\n"],"names":["MOBILE_USER_AGENT_PATTERN","TABLET_USER_AGENT_PATTERN","getMobileDeviceCapabilities","win","userAgent","resolveMobileDevice","hasMobileUserAgent","hasTabletLikeUserAgent","resolveLandscapeFromOrientationType","orientationType","resolveMobileViewportLandscape","matchMediaLandscape","innerWidth","innerHeight","orientationLandscape","isMobileDevice","isLandscapeViewport","currentWindow","subscribeMobileDeviceChange","onChange","screenOrientation"],"mappings":"AAYA,MAAMA,IACJ,oEACIC,IAA4B,gBAErBC,IAA8B,CACzCC,MAC6B;AAE7B,QAAMC,IADuB,OACG,WAAW,aAAa;AAExD,SAAO;AAAA,IACL,oBAAoBJ,EAA0B,KAAKI,CAAS;AAAA,IAC5D,wBAAwBH,EAA0B,KAAKG,CAAS;AAAA,EAAA;AAEpE,GAEaC,IAAsB,CAAC;AAAA,EAClC,oBAAAC;AAAA,EACA,wBAAAC;AACF,MACSD,KAAsBC,GAGzBC,IAAsC,CAC1CC,MAEIA,GAAiB,SAAS,WAAW,IAChC,KAGLA,GAAiB,SAAS,UAAU,IAC/B,KAGF,MAGIC,IAAiC,CAAC;AAAA,EAC7C,qBAAAC;AAAA,EACA,iBAAAF;AAAA,EACA,YAAAG;AAAA,EACA,aAAAC;AACF,MAA0C;AACxC,QAAMC,IACJN,EAAoCC,CAAe;AAErD,SAAIK,MAAyB,OACpBA,IAGL,OAAOH,KAAwB,YAC1BA,IAGL,OAAOC,KAAe,YAAY,OAAOC,KAAgB,WACpD,KAGFD,IAAaC;AACtB,GAEaE,IAAiB,CAACZ,MAC7BE,EAAoBH,EAA+B,CAAC,GAEzCc,IAAsB,CAACb,MAA0B;AAC5D,QAAMc,IAAuB,QACvBN,IACJ,OAAOM,EAAc,cAAe,aAChCA,EAAc,WAAW,0BAA0B,EAAE,UACrD;AAEN,SAAOP,EAA+B;AAAA,IACpC,qBAAAC;AAAA,IACA,iBAAiBM,EAAc,QAAQ,aAAa;AAAA,IACpD,YAAYA,EAAc;AAAA,IAC1B,aAAaA,EAAc;AAAA,EAAA,CAC5B;AACH,GAEaC,IAA8B,CACzCC,GACAhB,MACG;AACH,QAAMc,IAAuB,QACvBG,IAAoBH,EAAc,QAAQ;AAEhD,SAAAA,EAAc,iBAAiB,qBAAqBE,CAAQ,GAC5DC,GAAmB,mBAAmB,UAAUD,CAAQ,GAEjD,MAAM;AACX,IAAAF,EAAc,oBAAoB,qBAAqBE,CAAQ,GAC/DC,GAAmB,sBAAsB,UAAUD,CAAQ;AAAA,EAC7D;AACF;"}

package/package.json

@@ -174,7 +174,7 @@
       ]
     }
   },
-  "version": "0.2.6",
+  "version": "0.2.7-dev.1",
   "type": "module",
   "exports": {
     ".": {