diff --git a/packages/shoreline/src/components/collection/collection-view.tsx b/packages/shoreline/src/components/collection/collection-view.tsx
index c098c43565..d5adf036a9 100644
--- a/packages/shoreline/src/components/collection/collection-view.tsx
+++ b/packages/shoreline/src/components/collection/collection-view.tsx
@@ -1,3 +1,5 @@
+import type { ComponentPropsWithoutRef } from 'react'
+import { forwardRef } from 'react'
import {
IconMagnifyingGlass,
IconPlus,
@@ -5,8 +7,6 @@ import {
IconProhibit,
IconWarningCircle,
} from '../../icons'
-import type { ComponentPropsWithoutRef } from 'react'
-import { forwardRef } from 'react'
import { Button } from '../button'
import {
EmptyState,
diff --git a/packages/shoreline/src/components/collection/stories/show.stories.tsx b/packages/shoreline/src/components/collection/stories/show.stories.tsx
index b0bb3de356..4190efdc37 100644
--- a/packages/shoreline/src/components/collection/stories/show.stories.tsx
+++ b/packages/shoreline/src/components/collection/stories/show.stories.tsx
@@ -1,9 +1,9 @@
-import './stories.css'
-import { CollectionView, Collection, CollectionRow } from '../index'
-import { Search } from '../../search'
-import { Pagination } from '../../pagination'
import { Filter, FilterItem } from '../../filter'
+import { Pagination } from '../../pagination'
+import { Search } from '../../search'
import { Stack } from '../../stack'
+import { Collection, CollectionRow, CollectionView } from '../index'
+import './stories.css'
export default {
title: 'components/collection',
@@ -199,7 +199,89 @@ export function Show() {
- {/* Custom label */}
+ {/* Empty custom messages */}
+
+
+
+
+
+ Stable
+ Experimental
+ Deprecated
+
+
+
+
+ alert('On empty action')}
+ >
+
+
+
+
+
+
+ {/* Error custom messages */}
+
+
+
+
+
+ Stable
+ Experimental
+ Deprecated
+
+
+
+
+ alert('On error action')}
+ >
+
+
+
+
+
+
+ {/* Unauthorized custom messages */}
+
+
+
+
+
+ Stable
+ Experimental
+ Deprecated
+
+
+
+
+
+
+
+
+
+
+
+ {/* Not found custom messages */}
@@ -213,8 +295,11 @@ export function Show() {
diff --git a/packages/shoreline/src/themes/sunrise/components/collection-view.css b/packages/shoreline/src/themes/sunrise/components/collection-view.css
index d879a5a148..5358f9a2df 100644
--- a/packages/shoreline/src/themes/sunrise/components/collection-view.css
+++ b/packages/shoreline/src/themes/sunrise/components/collection-view.css
@@ -5,11 +5,14 @@
[data-sl-collection-view] {
min-height: 23.75rem;
-
+
&:not([data-sl-collection-view-ready]) {
display: flex;
justify-items: center;
- align-items: center;
+ align-items: center;
}
}
+[data-sl-collection-view-heading] {
+ text-align: center;
+}