declare const _default: "<Box className=\"flex flex-col gap-[var(--spacing-4)] w-full\">\n    <Text type=\"h4\">All InputGroup variants</Text>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">External Left Button:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Placeholder\" />\n        <InputGroupAddon align=\"outline-left\">\n        <InputGroupButton label=\"Button\" />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">Input Group with Icon:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Placeholder\" />\n        <InputGroupAddon align=\"inline-left\">\n        <InputGroupIcon name=\"Search\" size={16} />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">External Left Dropdown:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Placeholder\" value=\"Placeholder\" />\n        <InputGroupAddon align=\"outline-left\">\n        <InputGroupDropdown\n            label=\"English\"\n            menuItems={[\n                { label: 'English', onClick: () => {} },\n                { label: 'Deutsch', onClick: () => {} },\n            ]}\n        />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">Internal Right Button (Error):</Text>\n    <InputGroup {...args} isError>\n        <InputGroupInput placeholder=\"Placeholder\" />\n        <InputGroupAddon align=\"inline-right\">\n        <InputGroupButton label=\"Button\" variant=\"ghost\" />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">External Text + Icon Button:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Placeholder\" />\n        <InputGroupAddon align=\"outline-left\">\n        <InputGroupText>http://</InputGroupText>\n        </InputGroupAddon>\n        <InputGroupAddon align=\"outline-right\">\n        <InputGroupButton icon=\"Clipboard\" variant=\"default\" />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">Input with Tooltip:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Type something...\" />\n        <InputGroupAddon align=\"inline-right\">\n        <InputGroupTooltip content=\"Tooltip content\" />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">Input with Badge:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Type something...\" />\n        <InputGroupAddon align=\"inline-right\">\n        <InputGroupBadge label=\"USD\" />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">Currency Input:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Type something...\" />\n        <InputGroupAddon align=\"inline-left\">\n        <InputGroupText>$</InputGroupText>\n        </InputGroupAddon>\n        <InputGroupAddon align=\"inline-right\">\n        <InputGroupDropdown\n            label=\"+1\"\n            menuItems={[\n                { label: '+1 (US)', onClick: () => {} },\n                { label: '+44 (UK)', onClick: () => {} },\n            ]}\n        />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n\n    <Box className=\"flex flex-col gap-[var(--spacing-2)]\">\n    <Text type=\"small\">Complex Input with multiple addons:</Text>\n    <InputGroup {...args}>\n        <InputGroupInput placeholder=\"Type something...\" />\n        <InputGroupAddon align=\"outline-left\">\n        <InputGroupButton label=\"Button\" />\n        </InputGroupAddon>\n        <InputGroupAddon align=\"inline-left\">\n        <InputGroupIcon name=\"Search\" />\n        <InputGroupIcon name=\"Loader2\" animation=\"spin\" />\n        </InputGroupAddon>\n        <InputGroupAddon align=\"inline-right\">\n        <InputGroupDropdown\n            label=\"+1\"\n            menuItems={[\n                { label: '+1 (US)', onClick: () => {} },\n                { label: '+44 (UK)', onClick: () => {} },\n            ]}\n        />\n        </InputGroupAddon>\n        <InputGroupAddon align=\"outline-right\">\n        <InputGroupButton label=\"Button\" />\n        </InputGroupAddon>\n    </InputGroup>\n    </Box>\n</Box>";
export default _default;