@umbra.ui/core 0.1.0

package/src/components/views/MarkdownViewer/theme.css

@@ -0,0 +1,130 @@
+/* Light theme using Colors */
+:root {
+  /* MarkdownViewer container colors */
+  --markdownviewer-container-color: var(--text-2);
+  --markdownviewer-container-font-family: -apple-system, BlinkMacSystemFont,
+    "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
+    "Droid Sans", "Helvetica Neue", sans-serif;
+
+  /* MarkdownViewer header colors */
+  --markdownviewer-header-color: var(--text-primary);
+  --markdownviewer-header-border: rgba(0, 0, 0, 0.1);
+
+  /* MarkdownViewer paragraph colors */
+  --markdownviewer-paragraph-color: var(--text-secondary);
+
+  /* MarkdownViewer link colors */
+  --markdownviewer-link-color: var(--link);
+  --markdownviewer-link-hover-color: var(--accent);
+
+  /* MarkdownViewer inline code colors */
+  --markdownviewer-inline-code-bg: #f3f4f6;
+  --markdownviewer-inline-code-color: #1f2937;
+
+  /* MarkdownViewer code block colors */
+  --markdownviewer-code-block-bg: #ffffff;
+  --markdownviewer-code-block-border: #e1e4e8;
+  --markdownviewer-code-block-color: #24292e;
+
+  /* MarkdownViewer copy button colors */
+  --markdownviewer-copy-button-color: #24292e;
+  --markdownviewer-copy-button-bg: transparent;
+  --markdownviewer-copy-button-hover-bg: #f6f8fa;
+  --markdownviewer-copy-button-copied-color: #22863a;
+  --markdownviewer-copy-button-copied-border: #34d058;
+
+  /* MarkdownViewer table colors */
+  --markdownviewer-table-border: rgba(0, 0, 0, 0.1);
+  --markdownviewer-table-th-bg: #f9fafb;
+  --markdownviewer-table-th-color: #1f2937;
+  --markdownviewer-table-tr-even-bg: #f3f4f6;
+  --markdownviewer-table-tr-hover-bg: #e5e7eb;
+
+  /* MarkdownViewer horizontal rule colors */
+  --markdownviewer-hr-bg: rgba(0, 0, 0, 0.1);
+
+  /* MarkdownViewer blockquote colors */
+  --markdownviewer-blockquote-color: #6b7280;
+  --markdownviewer-blockquote-border: rgba(0, 0, 0, 0.1);
+
+  /* MarkdownViewer strong text colors */
+  --markdownviewer-strong-color: #1f2937;
+
+  /* MarkdownViewer syntax highlighting colors */
+  --markdownviewer-token-comment: #6a737d;
+  --markdownviewer-token-punctuation: #24292e;
+  --markdownviewer-token-tag: #0550ae;
+  --markdownviewer-token-property: #116329;
+  --markdownviewer-token-boolean: #cf222e;
+  --markdownviewer-token-string: #0a3069;
+  --markdownviewer-token-operator: #24292e;
+  --markdownviewer-token-keyword: #cf222e;
+  --markdownviewer-token-function: #953800;
+  --markdownviewer-token-regex: #953800;
+}
+
+/* Dark theme */
+.dark,
+.dark-theme {
+  /* MarkdownViewer container colors */
+  --markdownviewer-container-color: var(--text-2);
+  --markdownviewer-container-font-family: -apple-system, BlinkMacSystemFont,
+    "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
+    "Droid Sans", "Helvetica Neue", sans-serif;
+
+  /* MarkdownViewer header colors */
+  --markdownviewer-header-color: var(--text-primary);
+  --markdownviewer-header-border: var(--border-2);
+
+  /* MarkdownViewer paragraph colors */
+  --markdownviewer-paragraph-color: var(--text-secondary);
+
+  /* MarkdownViewer link colors */
+  --markdownviewer-link-color: var(--link);
+  --markdownviewer-link-hover-color: var(--accent);
+
+  /* MarkdownViewer inline code colors */
+  --markdownviewer-inline-code-bg: var(--control-2);
+  --markdownviewer-inline-code-color: var(--text-1);
+
+  /* MarkdownViewer code block colors */
+  --markdownviewer-code-block-bg: #1e1e1e;
+  --markdownviewer-code-block-border: #3c3c3c;
+  --markdownviewer-code-block-color: #d4d4d4;
+
+  /* MarkdownViewer copy button colors */
+  --markdownviewer-copy-button-color: #d4d4d4;
+  --markdownviewer-copy-button-bg: transparent;
+  --markdownviewer-copy-button-hover-bg: #3a3a3a;
+  --markdownviewer-copy-button-copied-color: #b5cea8;
+  --markdownviewer-copy-button-copied-border: #4b6a48;
+
+  /* MarkdownViewer table colors */
+  --markdownviewer-table-border: #30363d;
+  --markdownviewer-table-th-bg: var(--background-3);
+  --markdownviewer-table-th-color: var(--text-1);
+  --markdownviewer-table-tr-even-bg: var(--background-2);
+  --markdownviewer-table-tr-hover-bg: var(--background-3);
+
+  /* MarkdownViewer horizontal rule colors */
+  --markdownviewer-hr-bg: var(--border-2);
+
+  /* MarkdownViewer blockquote colors */
+  --markdownviewer-blockquote-color: var(--text-3);
+  --markdownviewer-blockquote-border: var(--border-2);
+
+  /* MarkdownViewer strong text colors */
+  --markdownviewer-strong-color: var(--text-1);
+
+  /* MarkdownViewer syntax highlighting colors */
+  --markdownviewer-token-comment: #6a9955;
+  --markdownviewer-token-punctuation: #d4d4d4;
+  --markdownviewer-token-tag: #569cd6;
+  --markdownviewer-token-property: #9cdcfe;
+  --markdownviewer-token-boolean: #b5cea8;
+  --markdownviewer-token-string: #ce9178;
+  --markdownviewer-token-operator: #d4d4d4;
+  --markdownviewer-token-keyword: #c586c0;
+  --markdownviewer-token-function: #dcdcaa;
+  --markdownviewer-token-regex: #d16969;
+}

package/src/index.ts

@@ -0,0 +1,263 @@
+// Core package exports
+export * from "@umbra.ui/colors";
+export * from "@umbra.ui/icons";
+export * from "@umbra.ui/typography";
+
+// Theme system exports
+export { darkTheme } from "./themes/dark";
+export { lightTheme } from "./themes/light";
+export { crimsonDarkTheme } from "./themes/crimson-dark";
+export { cyanTheme } from "./themes/cyan-light";
+export { goldDarkTheme } from "./themes/gold-dark";
+export { grassTheme } from "./themes/grass-dark";
+export { indigoTheme } from "./themes/indigo";
+export { orangeLightTheme } from "./themes/orange-light";
+export { orangeDarkTheme } from "./themes/orange-dark";
+
+export interface ThemeObject {
+  themeId: string;
+  colorMode: "light" | "dark";
+  cssVariables: Record<string, string>;
+}
+
+export { useTheme, type Theme } from "./theme";
+
+// Component exports
+export { default as Button } from "./components/controls/Button/Button.vue";
+export { default as IconButton } from "./components/controls/IconButton/IconButton.vue";
+export { default as Checkbox } from "./components/controls/Checkbox/Checkbox.vue";
+export { default as Switch } from "./components/controls/Switch/Switch.vue";
+export { default as SegmentedControl } from "./components/controls/SegmentedControl/SegmentedControl.vue";
+export { type ControlItem } from "./components/controls/SegmentedControl/types";
+export { default as Dropdown } from "./components/controls/Dropdown/Dropdown.vue";
+export { type DropdownItem } from "./components/controls/Dropdown/types";
+export { default as Radio } from "./components/controls/Radio/Radio.vue";
+export { default as Slider } from "./components/controls/Slider/Slider.vue";
+export { default as RangeSlider } from "./components/controls/RangeSlider/RangeSlider.vue";
+export { default as Stepper } from "./components/controls/Stepper/Stepper.vue";
+export { default as InputText } from "./components/inputs/InputText/InputText.vue";
+export { default as InputSecure } from "./components/inputs/InputSecure/InputSecure.vue";
+export { default as InputPhone } from "./components/inputs/InputPhone/InputPhone.vue";
+export { default as InputNumber } from "./components/inputs/InputNumber/InputNumber.vue";
+export { default as InputEmail } from "./components/inputs/InputEmail/InputEmail.vue";
+export { default as InputCard } from "./components/inputs/InputCard/InputCard.vue";
+export { default as DatePicker } from "./components/pickers/DatePicker/DatePicker.vue";
+export { default as ColorPicker } from "./components/pickers/ColorPicker/ColorPicker.vue";
+export {
+  type Color,
+  type ColorGroup,
+  colorPickerColors,
+} from "./components/pickers/ColorPicker/colors";
+export { default as IconPicker } from "./components/pickers/IconPicker/IconPicker.vue";
+export { default as CollectionPicker } from "./components/pickers/CollectionPicker/CollectionPicker.vue";
+export {
+  type CollectionData,
+  type CollectionItem,
+} from "./components/pickers/CollectionPicker/types";
+export { default as FilePicker } from "./components/pickers/FilePicker/FilePicker.vue";
+export {
+  type FileError,
+  type DropState,
+} from "./components/pickers/FilePicker/types";
+export { default as Tags } from "./components/inputs/Tags/TagBar.vue";
+export { default as TagCreation } from "./components/inputs/Tags/TagCreation.vue";
+export { default as TagPicker } from "./components/inputs/Tags/TagPicker.vue";
+export { default as TagBar } from "./components/inputs/Tags/TagBar.vue";
+export {
+  type TagData,
+  type TagItem,
+  type TagStyle,
+  type ColorScheme,
+  COLOR_PRESETS,
+  createStyledTag,
+  generateTagStyle,
+} from "./components/inputs/Tags/types";
+export { type TagBarStyle } from "./components/inputs/Tags/tag-bar-styles";
+export { default as AutogrowTextView } from "./components/inputs/AutogrowTextView/AutogrowTextView.vue";
+export { default as StringCapture } from "./components/inputs/StringCapture/StringCapture.vue";
+export { default as ActionMenu } from "./components/menus/ActionMenu/ActionMenu.vue";
+export { default as Tooltip } from "./components/indicators/Tooltip/TooltipProvider.vue";
+export { useTooltip } from "./components/indicators/Tooltip/useTooltip";
+export { vTooltip } from "./components/indicators/Tooltip/tooltip";
+export { default as ProgressBar } from "./components/indicators/ProgressBar/ProgressBar.vue";
+export { default as Alert } from "./components/dialogs/Alert/Alert.vue";
+export {
+  type AlertAction,
+  type AlertActionType,
+} from "./components/dialogs/Alert/types";
+export { default as Toast } from "./components/dialogs/Toast/Toast.vue";
+export { default as ToastContainer } from "./components/dialogs/Toast/ToastContainer.vue";
+export { useToast, ToastPlugin } from "./components/dialogs/Toast/useToast";
+export {
+  type ToastOptions,
+  type ToastInstance,
+} from "./components/dialogs/Toast/types";
+export { default as OTP } from "./components/inputs/OTP/OTP.vue";
+export { default as SearchBar } from "./components/inputs/search/SearchBar.vue";
+export { default as SearchResults } from "./components/inputs/search/SearchResults.vue";
+export { type SearchResult } from "./components/inputs/search/types";
+export { default as Sheet } from "./components/models/Sheet/Sheet.vue";
+export { default as Sidebar } from "./components/models/Sidebar/Sidebar.vue";
+export { default as Popover } from "./components/models/Popover/Popover.vue";
+export { type Pane } from "./components/navigation/types";
+export { default as NavigationStack } from "./components/navigation/navstack/NavigationStack.vue";
+export { useNavigationStack } from "./components/navigation/navstack/useNavigationStack";
+export { default as SlideoverController } from "./components/navigation/slideover/SlideoverController.vue";
+export { useSlideoverController } from "./components/navigation/slideover/useSlideoverController";
+export { default as SplitViewController } from "./components/navigation/splitview/SplitViewController.vue";
+export { useSplitViewController } from "./components/navigation/splitview/useSplitViewController";
+export { default as TabController } from "./components/navigation/tabcontroller/TabController.vue";
+export { useTabController } from "./components/navigation/tabcontroller/useTabController";
+export { default as TabItem } from "./components/navigation/tabcontroller/TabItem.vue";
+export { default as MarkdownViewer } from "./components/views/MarkdownViewer/MarkdownViewer.vue";
+export {
+  useContainerMonitor,
+  useResponsiveContainer,
+  DEFAULT_BREAKPOINTS as breakpoints,
+  type BreakpointName,
+  type BreakpointRange,
+  type BreakpointConfig,
+  type ContainerMonitorOptions,
+  type ContainerDimensions,
+} from "./components/navigation/adaptive/useContainerMonitor";
+export { default as AdaptiveLayout } from "./components/navigation/adaptive/AdaptiveLayout.vue";
+export { default as AdaptiveLayoutBreadcrumbs } from "./components/navigation/adaptive/AdaptiveLayoutBreadcrumbs.vue";
+export { default as AdaptiveLayoutMenuButton } from "./components/navigation/adaptive/AdaptiveLayoutMenuButton.vue";
+export { useAdaptiveLayoutState } from "./components/navigation/adaptive/useAdaptiveLayout";
+
+// README accessors (returns README.md content as strings)
+type ReadmeIndex = Record<string, string>;
+
+// Manual imports fallback for non-Vite environments
+import AlertReadme from "./components/dialogs/Alert/README.md?raw";
+import ToastReadme from "./components/dialogs/Toast/README.md?raw";
+import ProgressBarReadme from "./components/indicators/ProgressBar/README.md?raw";
+import TooltipReadme from "./components/indicators/Tooltip/README.md?raw";
+import AutogrowTextViewReadme from "./components/inputs/AutogrowTextView/README.md?raw";
+import InputCardReadme from "./components/inputs/InputCard/README.md?raw";
+import InputEmailReadme from "./components/inputs/InputEmail/README.md?raw";
+import InputNumberReadme from "./components/inputs/InputNumber/README.md?raw";
+import InputPhoneReadme from "./components/inputs/InputPhone/README.md?raw";
+import InputSecureReadme from "./components/inputs/InputSecure/README.md?raw";
+import InputTextReadme from "./components/inputs/InputText/README.md?raw";
+import OTPReadme from "./components/inputs/OTP/README.md?raw";
+import SearchReadme from "./components/inputs/search/README.md?raw";
+import StringCaptureReadme from "./components/inputs/StringCapture/README.md?raw";
+import TagsReadme from "./components/inputs/Tags/README.md?raw";
+import ActionMenuReadme from "./components/menus/ActionMenu/README.md?raw";
+import PopoverReadme from "./components/models/Popover/README.md?raw";
+import SheetReadme from "./components/models/Sheet/README.md?raw";
+import SidebarReadme from "./components/models/Sidebar/README.md?raw";
+import NavigationStackReadme from "./components/navigation/navstack/README.md?raw";
+import SlideoverReadme from "./components/navigation/slideover/README.md?raw";
+import SplitViewReadme from "./components/navigation/splitview/README.md?raw";
+import TabControllerReadme from "./components/navigation/tabcontroller/README.md?raw";
+import ButtonReadme from "./components/controls/Button/README.md?raw";
+import CheckboxReadme from "./components/controls/Checkbox/README.md?raw";
+import DropdownReadme from "./components/controls/Dropdown/README.md?raw";
+import IconButtonReadme from "./components/controls/IconButton/README.md?raw";
+import RadioReadme from "./components/controls/Radio/README.md?raw";
+import RangeSliderReadme from "./components/controls/RangeSlider/README.md?raw";
+import SegmentedControlReadme from "./components/controls/SegmentedControl/README.md?raw";
+import SliderReadme from "./components/controls/Slider/README.md?raw";
+import StepperReadme from "./components/controls/Stepper/README.md?raw";
+import SwitchReadme from "./components/controls/Switch/README.md?raw";
+import CollectionPickerReadme from "./components/pickers/CollectionPicker/README.md?raw";
+import ColorPickerReadme from "./components/pickers/ColorPicker/README.md?raw";
+import DatePickerReadme from "./components/pickers/DatePicker/README.md?raw";
+import FilePickerReadme from "./components/pickers/FilePicker/README.md?raw";
+import IconPickerReadme from "./components/pickers/IconPicker/README.md?raw";
+import MarkdownViewerReadme from "./components/views/MarkdownViewer/README.md?raw";
+
+const viteGlob = ((importMeta: any) =>
+  importMeta && importMeta.glob
+    ? (importMeta.glob as (
+        pattern: string,
+        options?: any
+      ) => Record<string, unknown>)
+    : undefined)(import.meta as any);
+
+const __readmeModules: Record<string, string> = viteGlob
+  ? (viteGlob("./components/**/README.md?raw", {
+      eager: true,
+    }) as Record<string, string>)
+  : {};
+
+const README_INDEX: ReadmeIndex = {};
+
+const __indexReadme = (path: string, content: string) => {
+  const parts = path.split("/");
+  const folder = parts[parts.length - 2] ?? "";
+  const kebab = folder
+    .replace(/([a-z0-9])([A-Z])/g, "$1-$2")
+    .replace(/[\s_]+/g, "-")
+    .toLowerCase();
+  if (kebab) README_INDEX[kebab] = content;
+  if (folder) README_INDEX[folder.toLowerCase()] = content;
+};
+
+for (const [path, content] of Object.entries(__readmeModules)) {
+  __indexReadme(path, content);
+}
+
+// Populate with manual imports too (works in both Vite and non-Vite bundlers that support ?raw)
+const __manualReadmes: Record<string, string> = {
+  "./components/dialogs/Alert/README.md": AlertReadme,
+  "./components/dialogs/Toast/README.md": ToastReadme,
+  "./components/indicators/ProgressBar/README.md": ProgressBarReadme,
+  "./components/indicators/Tooltip/README.md": TooltipReadme,
+  "./components/inputs/AutogrowTextView/README.md": AutogrowTextViewReadme,
+  "./components/inputs/InputCard/README.md": InputCardReadme,
+  "./components/inputs/InputEmail/README.md": InputEmailReadme,
+  "./components/inputs/InputNumber/README.md": InputNumberReadme,
+  "./components/inputs/InputPhone/README.md": InputPhoneReadme,
+  "./components/inputs/InputSecure/README.md": InputSecureReadme,
+  "./components/inputs/InputText/README.md": InputTextReadme,
+  "./components/inputs/OTP/README.md": OTPReadme,
+  "./components/inputs/search/README.md": SearchReadme,
+  "./components/inputs/StringCapture/README.md": StringCaptureReadme,
+  "./components/inputs/Tags/README.md": TagsReadme,
+  "./components/menus/ActionMenu/README.md": ActionMenuReadme,
+  "./components/models/Popover/README.md": PopoverReadme,
+  "./components/models/Sheet/README.md": SheetReadme,
+  "./components/models/Sidebar/README.md": SidebarReadme,
+  "./components/navigation/navstack/README.md": NavigationStackReadme,
+  "./components/navigation/slideover/README.md": SlideoverReadme,
+  "./components/navigation/splitview/README.md": SplitViewReadme,
+  "./components/navigation/tabcontroller/README.md": TabControllerReadme,
+  "./components/controls/Button/README.md": ButtonReadme,
+  "./components/controls/Checkbox/README.md": CheckboxReadme,
+  "./components/controls/Dropdown/README.md": DropdownReadme,
+  "./components/controls/IconButton/README.md": IconButtonReadme,
+  "./components/controls/Radio/README.md": RadioReadme,
+  "./components/controls/RangeSlider/README.md": RangeSliderReadme,
+  "./components/controls/SegmentedControl/README.md": SegmentedControlReadme,
+  "./components/controls/Slider/README.md": SliderReadme,
+  "./components/controls/Stepper/README.md": StepperReadme,
+  "./components/controls/Switch/README.md": SwitchReadme,
+  "./components/pickers/CollectionPicker/README.md": CollectionPickerReadme,
+  "./components/pickers/ColorPicker/README.md": ColorPickerReadme,
+  "./components/pickers/DatePicker/README.md": DatePickerReadme,
+  "./components/pickers/FilePicker/README.md": FilePickerReadme,
+  "./components/pickers/IconPicker/README.md": IconPickerReadme,
+  "./components/views/MarkdownViewer/README.md": MarkdownViewerReadme,
+};
+
+for (const [path, content] of Object.entries(__manualReadmes)) {
+  __indexReadme(path, content);
+}
+
+export const getReadme = (slug: string): string | undefined => {
+  const key = slug.trim().toLowerCase();
+  return README_INDEX[key];
+};
+
+export const READMEs: ReadmeIndex = README_INDEX;
+
+export const registerReadmes = (modules: Record<string, string>): void => {
+  for (const [path, content] of Object.entries(modules)) {
+    if (typeof content === "string") {
+      __indexReadme(path, content);
+    }
+  }
+};