mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-15 02:11:05 +00:00
test: use carbon-components-svelte
for type imports
This commit is contained in:
parent
31efd1fa1a
commit
f69b2f15b5
93 changed files with 102 additions and 103 deletions
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Accordion, AccordionItem } from "../types";
|
import { Accordion, AccordionItem } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Accordion>
|
<Accordion>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { AspectRatio, Tile } from "../types";
|
import { AspectRatio, Tile } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<AspectRatio ratio="16x9">
|
<AspectRatio ratio="16x9">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid>
|
<Grid>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Breadcrumb, BreadcrumbItem } from "../types";
|
import { Breadcrumb, BreadcrumbItem } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Breadcrumb>
|
<Breadcrumb>
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
{ href: "/reports/2019", text: "2019" },
|
{ href: "/reports/2019", text: "2019" },
|
||||||
];
|
];
|
||||||
|
|
||||||
import { Row, Column, Breadcrumb, BreadcrumbItem } from "../types";
|
import { Row, Column, Breadcrumb, BreadcrumbItem } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Row>
|
<Row>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Breakpoint, breakpointObserver, breakpoints } from "../types";
|
import { Breakpoint, breakpointObserver, breakpoints } from "carbon-components-svelte";
|
||||||
import type { BreakpointProps } from "../types/Breakpoint/Breakpoint.svelte";
|
import type { BreakpointProps } from "carbon-components-svelte/Breakpoint/Breakpoint.svelte";
|
||||||
|
|
||||||
let size: BreakpointProps["size"];
|
let size: BreakpointProps["size"];
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Button } from "../types";
|
import { Button } from "carbon-components-svelte";
|
||||||
import Add from "carbon-icons-svelte/lib/Add.svelte";
|
import Add from "carbon-icons-svelte/lib/Add.svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Button, ButtonSet } from "../types";
|
import { Button, ButtonSet } from "carbon-components-svelte";
|
||||||
import Login from "carbon-icons-svelte/lib/Login.svelte";
|
import Login from "carbon-icons-svelte/lib/Login.svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Checkbox } from "../types";
|
import { Checkbox } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Checkbox labelText="Label text" style="margin: 1rem" />
|
<Checkbox labelText="Label text" style="margin: 1rem" />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ClickableTile } from "../types";
|
import { ClickableTile } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<ClickableTile href="https://www.carbondesignsystem.com/">
|
<ClickableTile href="https://www.carbondesignsystem.com/">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { CodeSnippet } from "../types";
|
import { CodeSnippet } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<CodeSnippet
|
<CodeSnippet
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ComboBox } from "../types";
|
import { ComboBox } from "carbon-components-svelte";
|
||||||
import type { ComboBoxItem } from "../types/ComboBox/ComboBox.svelte";
|
import type { ComboBoxItem } from "carbon-components-svelte/ComboBox/ComboBox.svelte";
|
||||||
|
|
||||||
const items: ComboBoxItem[] = [
|
const items: ComboBoxItem[] = [
|
||||||
{ id: 0, text: "Slack" },
|
{ id: 0, text: "Slack" },
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
ModalBody,
|
ModalBody,
|
||||||
ModalFooter,
|
ModalFooter,
|
||||||
Checkbox,
|
Checkbox,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
|
|
||||||
let checked = false;
|
let checked = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid condensed>
|
<Grid condensed>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ContentSwitcher, Switch } from "../types";
|
import { ContentSwitcher, Switch } from "carbon-components-svelte";
|
||||||
import Analytics from "carbon-icons-svelte/lib/Analytics.svelte";
|
import Analytics from "carbon-icons-svelte/lib/Analytics.svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
ContextMenuOption,
|
ContextMenuOption,
|
||||||
ContextMenuRadioGroup,
|
ContextMenuRadioGroup,
|
||||||
ContextMenuGroup,
|
ContextMenuGroup,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
import CopyFile from "carbon-icons-svelte/lib/CopyFile.svelte";
|
import CopyFile from "carbon-icons-svelte/lib/CopyFile.svelte";
|
||||||
import Cut from "carbon-icons-svelte/lib/Cut.svelte";
|
import Cut from "carbon-icons-svelte/lib/Cut.svelte";
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { CopyButton } from "../types";
|
import { CopyButton } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<CopyButton
|
<CopyButton
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
export let copy = (text: string) => text;
|
export let copy = (text: string) => text;
|
||||||
export let code = "npm i carbon-component-svelte";
|
export let code = "npm i carbon-component-svelte";
|
||||||
|
|
||||||
import { CodeSnippet } from "../types";
|
import { CodeSnippet } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<CodeSnippet on:click="{() => copy(code)}">{code}</CodeSnippet>
|
<CodeSnippet on:click="{() => copy(code)}">{code}</CodeSnippet>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Button, Modal } from "../types";
|
import { Button, Modal } from "carbon-components-svelte";
|
||||||
|
|
||||||
let open = false;
|
let open = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -9,8 +9,8 @@
|
||||||
ToolbarMenuItem,
|
ToolbarMenuItem,
|
||||||
Button,
|
Button,
|
||||||
Link,
|
Link,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
import type { DataTableHeader } from "../types/DataTable/DataTable.svelte";
|
import type { DataTableHeader } from "carbon-components-svelte/DataTable/DataTable.svelte";
|
||||||
import Launch from "carbon-icons-svelte/lib/Launch.svelte";
|
import Launch from "carbon-icons-svelte/lib/Launch.svelte";
|
||||||
|
|
||||||
const headers: DataTableHeader[] = [
|
const headers: DataTableHeader[] = [
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DataTable, OverflowMenu, OverflowMenuItem } from "../types";
|
import { DataTable, OverflowMenu, OverflowMenuItem } from "carbon-components-svelte";
|
||||||
|
|
||||||
const headers = [
|
const headers = [
|
||||||
{ key: "name", value: "Name" },
|
{ key: "name", value: "Name" },
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DataTable } from "../types";
|
import { DataTable } from "carbon-components-svelte";
|
||||||
|
|
||||||
const headers = [
|
const headers = [
|
||||||
{ key: "name", value: "Name" },
|
{ key: "name", value: "Name" },
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
ToolbarMenuItem,
|
ToolbarMenuItem,
|
||||||
ToolbarBatchActions,
|
ToolbarBatchActions,
|
||||||
Button,
|
Button,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
import Save from "carbon-icons-svelte/lib/Save.svelte";
|
import Save from "carbon-icons-svelte/lib/Save.svelte";
|
||||||
|
|
||||||
const headers = [
|
const headers = [
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DatePicker, DatePickerSkeleton, DatePickerInput } from "../types";
|
import { DatePicker, DatePickerSkeleton, DatePickerInput } from "carbon-components-svelte";
|
||||||
import { Russian } from "flatpickr/dist/l10n/ru.js";
|
import { Russian } from "flatpickr/dist/l10n/ru.js";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Dropdown, DropdownSkeleton } from "../types";
|
import { Dropdown, DropdownSkeleton } from "carbon-components-svelte";
|
||||||
import type { DropdownProps } from "../types/Dropdown/Dropdown.svelte";
|
import type { DropdownProps } from "carbon-components-svelte/Dropdown/Dropdown.svelte";
|
||||||
|
|
||||||
let items: DropdownProps["items"] = [
|
let items: DropdownProps["items"] = [
|
||||||
{ id: 0, text: "Slack" },
|
{ id: 0, text: "Slack" },
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { CodeSnippet } from "../types";
|
import { CodeSnippet } from "carbon-components-svelte";
|
||||||
|
|
||||||
let toggled = false;
|
let toggled = false;
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ExpandableTile } from "../types";
|
import { ExpandableTile } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<ExpandableTile>
|
<ExpandableTile>
|
||||||
|
|
|
@ -5,8 +5,8 @@
|
||||||
FileUploaderDropContainer,
|
FileUploaderDropContainer,
|
||||||
FileUploaderItem,
|
FileUploaderItem,
|
||||||
FileUploaderSkeleton,
|
FileUploaderSkeleton,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
import type { FileUploaderProps } from "../types/FileUploader/FileUploader.svelte";
|
import type { FileUploaderProps } from "carbon-components-svelte/FileUploader/FileUploader.svelte";
|
||||||
|
|
||||||
let fileUploader: FileUploader;
|
let fileUploader: FileUploader;
|
||||||
let files: FileUploaderProps["files"] = [];
|
let files: FileUploaderProps["files"] = [];
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ComboBox } from "../types";
|
import { ComboBox } from "carbon-components-svelte";
|
||||||
|
|
||||||
function shouldFilterItem(item: { text: string }, value?: any) {
|
function shouldFilterItem(item: { text: string }, value?: any) {
|
||||||
if (!value) return true;
|
if (!value) return true;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { FluidForm, TextInput, PasswordInput } from "../types";
|
import { FluidForm, TextInput, PasswordInput } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<FluidForm action="" method="get">
|
<FluidForm action="" method="get">
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
Select,
|
Select,
|
||||||
SelectItem,
|
SelectItem,
|
||||||
Button,
|
Button,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
|
|
||||||
let ref: HTMLFormElement;
|
let ref: HTMLFormElement;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid fullWidth>
|
<Grid fullWidth>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid>
|
<Grid>
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
Grid,
|
Grid,
|
||||||
Row,
|
Row,
|
||||||
Column,
|
Column,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
|
|
||||||
let isSideNavOpen = false;
|
let isSideNavOpen = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
Grid,
|
Grid,
|
||||||
Row,
|
Row,
|
||||||
Column,
|
Column,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
|
|
||||||
let isSideNavOpen = false;
|
let isSideNavOpen = false;
|
||||||
let isOpen = false;
|
let isOpen = false;
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
Grid,
|
Grid,
|
||||||
Row,
|
Row,
|
||||||
Column,
|
Column,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
|
|
||||||
let isSideNavOpen = false;
|
let isSideNavOpen = false;
|
||||||
let isOpen = false;
|
let isOpen = false;
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
Grid,
|
Grid,
|
||||||
Row,
|
Row,
|
||||||
Column,
|
Column,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
import SettingsAdjust from "carbon-icons-svelte/lib/SettingsAdjust.svelte";
|
import SettingsAdjust from "carbon-icons-svelte/lib/SettingsAdjust.svelte";
|
||||||
import { quintOut } from "svelte/easing";
|
import { quintOut } from "svelte/easing";
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { CodeSnippet } from "../types";
|
import { CodeSnippet } from "carbon-components-svelte";
|
||||||
|
|
||||||
let toggled = false;
|
let toggled = false;
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ImageLoader } from "../types";
|
import { ImageLoader } from "carbon-components-svelte";
|
||||||
|
|
||||||
let loading = false;
|
let loading = false;
|
||||||
let loaded = false;
|
let loaded = false;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { InlineLoading } from "../types";
|
import { InlineLoading } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<InlineLoading />
|
<InlineLoading />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Button, ButtonSet, InlineLoading } from "../types";
|
import { Button, ButtonSet, InlineLoading } from "carbon-components-svelte";
|
||||||
import { onDestroy } from "svelte";
|
import { onDestroy } from "svelte";
|
||||||
|
|
||||||
type State = "dormant" | "active" | "finished" | "inactive";
|
type State = "dormant" | "active" | "finished" | "inactive";
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { InlineNotification, NotificationActionButton } from "../types";
|
import { InlineNotification, NotificationActionButton } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<InlineNotification on:close />
|
<InlineNotification on:close />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Link, OutboundLink } from "../types";
|
import { Link, OutboundLink } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Link size="sm" inline disabled download visited href="/" target="_blank">
|
<Link size="sm" inline disabled download visited href="/" target="_blank">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Loading } from "../types";
|
import { Loading } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Loading withOverlay="{false}" />
|
<Loading withOverlay="{false}" />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { LocalStorage } from "../types";
|
import { LocalStorage } from "carbon-components-svelte";
|
||||||
|
|
||||||
let storage: LocalStorage;
|
let storage: LocalStorage;
|
||||||
let toggled = false;
|
let toggled = false;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Button, Modal } from "../types";
|
import { Button, Modal } from "carbon-components-svelte";
|
||||||
|
|
||||||
let open = false;
|
let open = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Modal } from "../types";
|
import { Modal } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Modal
|
<Modal
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Modal } from "../types";
|
import { Modal } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Modal
|
<Modal
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Modal } from "../types";
|
import { Modal } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Modal
|
<Modal
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Modal } from "../types";
|
import { Modal } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Modal
|
<Modal
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { MultiSelect } from "../types";
|
import { MultiSelect } from "carbon-components-svelte";
|
||||||
import type { MultiSelectProps } from "../types/MultiSelect/MultiSelect.svelte";
|
import type { MultiSelectProps } from "carbon-components-svelte/MultiSelect/MultiSelect.svelte";
|
||||||
|
|
||||||
let selectedIds: MultiSelectProps["selectedIds"] = [0];
|
let selectedIds: MultiSelectProps["selectedIds"] = [0];
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid narrow>
|
<Grid narrow>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { NumberInput, NumberInputSkeleton } from "../types";
|
import { NumberInput, NumberInputSkeleton } from "carbon-components-svelte";
|
||||||
import type { NumberInputProps } from "../types/NumberInput/NumberInput.svelte";
|
import type { NumberInputProps } from "carbon-components-svelte/NumberInput/NumberInput.svelte";
|
||||||
|
|
||||||
let value: NumberInputProps["value"] = null;
|
let value: NumberInputProps["value"] = null;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid>
|
<Grid>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { OrderedList, ListItem, Link } from "../types";
|
import { OrderedList, ListItem, Link } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<OrderedList>
|
<OrderedList>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { OverflowMenu, OverflowMenuItem } from "../types";
|
import { OverflowMenu, OverflowMenuItem } from "carbon-components-svelte";
|
||||||
import Add from "carbon-icons-svelte/lib/Add.svelte";
|
import Add from "carbon-icons-svelte/lib/Add.svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid padding>
|
<Grid padding>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Pagination, PaginationSkeleton } from "../types";
|
import { Pagination, PaginationSkeleton } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Pagination
|
<Pagination
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { PaginationNav } from "../types";
|
import { PaginationNav } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<PaginationNav />
|
<PaginationNav />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Button, Modal } from "../types";
|
import { Button, Modal } from "carbon-components-svelte";
|
||||||
|
|
||||||
let open = false;
|
let open = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { PasswordInput } from "../types";
|
import { PasswordInput } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<PasswordInput labelText="Password" placeholder="Enter password..." />
|
<PasswordInput labelText="Password" placeholder="Enter password..." />
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
Grid,
|
Grid,
|
||||||
Row,
|
Row,
|
||||||
Column,
|
Column,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
|
|
||||||
let isSideNavOpen = false;
|
let isSideNavOpen = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Popover } from "../types";
|
import { Popover } from "carbon-components-svelte";
|
||||||
|
|
||||||
let open = false;
|
let open = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ProgressBar } from "../types";
|
import { ProgressBar } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<ProgressBar helperText="Loading..." />
|
<ProgressBar helperText="Loading..." />
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
ProgressIndicator,
|
ProgressIndicator,
|
||||||
ProgressStep,
|
ProgressStep,
|
||||||
ProgressIndicatorSkeleton,
|
ProgressIndicatorSkeleton,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<ProgressIndicator currentIndex="{2}">
|
<ProgressIndicator currentIndex="{2}">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { RadioButton, RadioButtonSkeleton, RadioButtonGroup } from "../types";
|
import { RadioButton, RadioButtonSkeleton, RadioButtonGroup } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<RadioButtonGroup
|
<RadioButtonGroup
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DataTable } from "../types";
|
import { DataTable } from "carbon-components-svelte";
|
||||||
|
|
||||||
const headers = [
|
const headers = [
|
||||||
{ key: "name", value: "Name" },
|
{ key: "name", value: "Name" },
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { TileGroup, RadioTile } from "../types";
|
import { TileGroup, RadioTile } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<TileGroup
|
<TileGroup
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { RecursiveList } from "../types";
|
import { RecursiveList } from "carbon-components-svelte";
|
||||||
|
|
||||||
const children = [
|
const children = [
|
||||||
{
|
{
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Grid, Row, Column } from "../types";
|
import { Grid, Row, Column } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Grid>
|
<Grid>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Search } from "../types";
|
import { Search } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Search on:paste />
|
<Search on:paste />
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
SelectItem,
|
SelectItem,
|
||||||
SelectItemGroup,
|
SelectItemGroup,
|
||||||
SelectSkeleton,
|
SelectSkeleton,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Select labelText="Carbon theme" selected="g10">
|
<Select labelText="Carbon theme" selected="g10">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DataTable } from "../types";
|
import { DataTable } from "carbon-components-svelte";
|
||||||
|
|
||||||
const headers = [
|
const headers = [
|
||||||
{ key: "name", value: "Name" },
|
{ key: "name", value: "Name" },
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { SelectableTile } from "../types";
|
import { SelectableTile } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<SelectableTile selected>Multi-select Tile</SelectableTile>
|
<SelectableTile selected>Multi-select Tile</SelectableTile>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { SkeletonPlaceholder } from "../types";
|
import { SkeletonPlaceholder } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<SkeletonPlaceholder />
|
<SkeletonPlaceholder />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { SkeletonText } from "../types";
|
import { SkeletonText } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<SkeletonText />
|
<SkeletonText />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Slider, SliderSkeleton } from "../types";
|
import { Slider, SliderSkeleton } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Slider />
|
<Slider />
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
StructuredListCell,
|
StructuredListCell,
|
||||||
StructuredListRow,
|
StructuredListRow,
|
||||||
StructuredListInput,
|
StructuredListInput,
|
||||||
} from "../types";
|
} from "carbon-components-svelte";
|
||||||
import CheckmarkFilled from "carbon-icons-svelte/lib/CheckmarkFilled.svelte";
|
import CheckmarkFilled from "carbon-icons-svelte/lib/CheckmarkFilled.svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Tabs, Tab, TabContent, TabsSkeleton } from "../types";
|
import { Tabs, Tab, TabContent, TabsSkeleton } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Tabs
|
<Tabs
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Tag } from "../types";
|
import { Tag } from "carbon-components-svelte";
|
||||||
import Add from "carbon-icons-svelte/lib/Add.svelte";
|
import Add from "carbon-icons-svelte/lib/Add.svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { TextArea, TextAreaSkeleton } from "../types";
|
import { TextArea, TextAreaSkeleton } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<TextArea
|
<TextArea
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { TextInput, TextInputSkeleton } from "../types";
|
import { TextInput, TextInputSkeleton } from "carbon-components-svelte";
|
||||||
|
|
||||||
let value = null;
|
let value = null;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Theme } from "../types";
|
import { Theme } from "carbon-components-svelte";
|
||||||
import type { CarbonTheme } from "../types/Theme/Theme.svelte";
|
import type { CarbonTheme } from "carbon-components-svelte/Theme/Theme.svelte";
|
||||||
|
|
||||||
let theme: CarbonTheme = "g10";
|
let theme: CarbonTheme = "g10";
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Tile } from "../types";
|
import { Tile } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Tile>Content</Tile>
|
<Tile>Content</Tile>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { TimePicker, TimePickerSelect, SelectItem } from "../types";
|
import { TimePicker, TimePickerSelect, SelectItem } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<TimePicker
|
<TimePicker
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { ToastNotification } from "../types";
|
import { ToastNotification } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<ToastNotification fullWidth />
|
<ToastNotification fullWidth />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Toggle, ToggleSkeleton } from "../types";
|
import { Toggle, ToggleSkeleton } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Toggle labelText="Push notifications" hideLabel />
|
<Toggle labelText="Push notifications" hideLabel />
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Tooltip, Link, Button } from "../types";
|
import { Tooltip, Link, Button } from "carbon-components-svelte";
|
||||||
import Catalog from "carbon-icons-svelte/lib/Catalog.svelte";
|
import Catalog from "carbon-icons-svelte/lib/Catalog.svelte";
|
||||||
|
|
||||||
let open = true;
|
let open = true;
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { TooltipDefinition } from "../types";
|
import { TooltipDefinition } from "carbon-components-svelte";
|
||||||
|
|
||||||
let open = false;
|
let open = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { TooltipIcon } from "../types";
|
import { TooltipIcon } from "carbon-components-svelte";
|
||||||
import Carbon from "carbon-icons-svelte/lib/Carbon.svelte";
|
import Carbon from "carbon-icons-svelte/lib/Carbon.svelte";
|
||||||
import Filter from "carbon-icons-svelte/lib/Filter.svelte";
|
import Filter from "carbon-icons-svelte/lib/Filter.svelte";
|
||||||
import FilterReset from "carbon-icons-svelte/lib/FilterReset.svelte";
|
import FilterReset from "carbon-icons-svelte/lib/FilterReset.svelte";
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import type { ComponentProps } from "svelte";
|
import type { ComponentProps } from "svelte";
|
||||||
import { TreeView } from "../types";
|
import { TreeView } from "carbon-components-svelte";
|
||||||
import type { TreeNodeId } from "../types/TreeView/TreeView.svelte";
|
import type { TreeNodeId } from "carbon-components-svelte/TreeView/TreeView.svelte";
|
||||||
import Analytics from "carbon-icons-svelte/lib/Analytics.svelte";
|
import Analytics from "carbon-icons-svelte/lib/Analytics.svelte";
|
||||||
|
|
||||||
let treeview: TreeView;
|
let treeview: TreeView;
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Truncate } from "../types";
|
import { Truncate, truncate } from "carbon-components-svelte";
|
||||||
import { truncate } from "../types";
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Truncate>
|
<Truncate>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { UnorderedList, ListItem, Link } from "../types";
|
import { UnorderedList, ListItem, Link } from "carbon-components-svelte";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<UnorderedList>
|
<UnorderedList>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue