@placeholderco/placeholder-ui 1.0.12 → 2.0.0

package/dist/styles/utilities.css

@@ -1,523 +0,0 @@
-/**
- * Utility Classes
- * Minimal utility classes for common styling patterns.
- * Uses logical properties (start/end) for RTL support.
- */
-
-/* Display */
-.block { display: block; }
-.inline-block { display: inline-block; }
-.flex { display: flex; }
-.inline-flex { display: inline-flex; }
-.grid { display: grid; }
-.hidden { display: none; }
-
-/* Flex Direction */
-.flex-row { flex-direction: row; }
-.flex-col { flex-direction: column; }
-.flex-wrap { flex-wrap: wrap; }
-
-/* Flex Alignment */
-.items-start { align-items: flex-start; }
-.items-center { align-items: center; }
-.items-end { align-items: flex-end; }
-.items-stretch { align-items: stretch; }
-
-.justify-start { justify-content: flex-start; }
-.justify-center { justify-content: center; }
-.justify-end { justify-content: flex-end; }
-.justify-between { justify-content: space-between; }
-
-/* Flex Properties */
-.flex-1 { flex: 1 1 0%; }
-.flex-grow { flex-grow: 1; }
-.flex-shrink-0 { flex-shrink: 0; }
-
-/* Gap */
-.gap-1 { gap: var(--pui-spacing-1); }
-.gap-2 { gap: var(--pui-spacing-2); }
-.gap-3 { gap: var(--pui-spacing-3); }
-.gap-4 { gap: var(--pui-spacing-4); }
-.gap-6 { gap: var(--pui-spacing-6); }
-
-/* Position */
-.relative { position: relative; }
-.absolute { position: absolute; }
-.fixed { position: fixed; }
-.sticky { position: sticky; }
-
-/* Overflow */
-.overflow-hidden { overflow: hidden; }
-.overflow-auto { overflow: auto; }
-.overflow-y-auto { overflow-y: auto; }
-
-/* Width/Height */
-.w-full { width: 100%; }
-.h-full { height: 100%; }
-.min-h-screen { min-height: 100vh; }
-
-/* Text */
-.text-start { text-align: start; }
-.text-center { text-align: center; }
-.text-end { text-align: end; }
-
-/* ============================================
- * FONT SIZES
- * ============================================ */
-.text-xs { font-size: var(--pui-font-size-xs); }
-.text-sm { font-size: var(--pui-font-size-sm); }
-.text-md { font-size: var(--pui-font-size-md); }
-.text-lg { font-size: var(--pui-font-size-lg); }
-.text-xl { font-size: var(--pui-font-size-xl); }
-.text-2xl { font-size: var(--pui-font-size-2xl); }
-.text-3xl { font-size: var(--pui-font-size-3xl); }
-.text-4xl { font-size: var(--pui-font-size-4xl); }
-
-/* ============================================
- * FONT WEIGHTS
- * ============================================ */
-.font-thin { font-weight: var(--pui-font-weight-thin); }
-.font-light { font-weight: var(--pui-font-weight-light); }
-.font-normal { font-weight: var(--pui-font-weight-normal); }
-.font-medium { font-weight: var(--pui-font-weight-medium); }
-.font-semibold { font-weight: var(--pui-font-weight-semibold); }
-.font-bold { font-weight: var(--pui-font-weight-bold); }
-.font-extrabold { font-weight: var(--pui-font-weight-extrabold); }
-.font-black { font-weight: var(--pui-font-weight-black); }
-
-/* ============================================
- * LINE HEIGHTS
- * ============================================ */
-.leading-none { line-height: var(--pui-line-height-none); }
-.leading-xs { line-height: var(--pui-line-height-tight); }
-.leading-sm { line-height: var(--pui-line-height-snug); }
-.leading-md { line-height: var(--pui-line-height-normal); }
-.leading-lg { line-height: var(--pui-line-height-relaxed); }
-.leading-xl { line-height: var(--pui-line-height-loose); }
-
-/* ============================================
- * LETTER SPACING
- * ============================================ */
-.tracking-xs { letter-spacing: var(--pui-letter-spacing-tighter); }
-.tracking-sm { letter-spacing: var(--pui-letter-spacing-tight); }
-.tracking-md { letter-spacing: var(--pui-letter-spacing-normal); }
-.tracking-lg { letter-spacing: var(--pui-letter-spacing-wide); }
-.tracking-xl { letter-spacing: var(--pui-letter-spacing-wider); }
-.tracking-2xl { letter-spacing: var(--pui-letter-spacing-widest); }
-
-/* ============================================
- * FONT FAMILIES
- * ============================================ */
-.font-sans { font-family: var(--pui-font-family-sans); }
-.font-mono { font-family: var(--pui-font-family-mono); }
-
-/* ============================================
- * TEXT COLORS
- * ============================================ */
-
-/* Semantic text colors */
-.text-body { color: var(--pui-text-primary); }
-.text-subtle { color: var(--pui-text-secondary); }
-.text-muted { color: var(--pui-text-muted); }
-
-/* Brand text colors */
-.text-primary { color: var(--pui-color-primary); }
-.text-secondary { color: var(--pui-color-secondary); }
-.text-accent { color: var(--pui-color-accent); }
-
-/* Status text colors */
-.text-danger { color: var(--pui-color-danger); }
-.text-warning { color: var(--pui-color-warning); }
-.text-success { color: var(--pui-color-success); }
-.text-info { color: var(--pui-color-info); }
-
-/* Neutral text colors */
-.text-white { color: var(--pui-color-white); }
-.text-black { color: var(--pui-color-black); }
-.text-gray-50 { color: var(--pui-color-gray-50); }
-.text-gray-100 { color: var(--pui-color-gray-100); }
-.text-gray-200 { color: var(--pui-color-gray-200); }
-.text-gray-300 { color: var(--pui-color-gray-300); }
-.text-gray-400 { color: var(--pui-color-gray-400); }
-.text-gray-500 { color: var(--pui-color-gray-500); }
-.text-gray-600 { color: var(--pui-color-gray-600); }
-.text-gray-700 { color: var(--pui-color-gray-700); }
-.text-gray-800 { color: var(--pui-color-gray-800); }
-.text-gray-900 { color: var(--pui-color-gray-900); }
-
-/* Inherit/current */
-.text-inherit { color: inherit; }
-.text-current { color: currentColor; }
-
-/* ============================================
- * BACKGROUND COLORS
- * ============================================ */
-
-/* Brand backgrounds */
-.bg-primary { background-color: var(--pui-color-primary); }
-.bg-primary-hover { background-color: var(--pui-color-primary-light); }
-.bg-primary-dark { background-color: var(--pui-color-primary-dark); }
-.bg-secondary { background-color: var(--pui-color-secondary); }
-.bg-secondary-hover { background-color: var(--pui-color-secondary-hover); }
-.bg-accent { background-color: var(--pui-color-accent); }
-.bg-accent-hover { background-color: var(--pui-color-accent-hover); }
-.bg-accent-light { background-color: var(--pui-color-accent-light); }
-
-/* Status backgrounds */
-.bg-danger { background-color: var(--pui-color-danger); }
-.bg-danger-subtle { background-color: var(--pui-color-danger-subtle); }
-.bg-warning { background-color: var(--pui-color-warning); }
-.bg-success { background-color: var(--pui-color-success); }
-.bg-info { background-color: var(--pui-color-info); }
-
-/* Neutral backgrounds */
-.bg-white { background-color: var(--pui-color-white); }
-.bg-black { background-color: var(--pui-color-black); }
-.bg-gray-50 { background-color: var(--pui-color-gray-50); }
-.bg-gray-100 { background-color: var(--pui-color-gray-100); }
-.bg-gray-200 { background-color: var(--pui-color-gray-200); }
-.bg-gray-300 { background-color: var(--pui-color-gray-300); }
-.bg-gray-400 { background-color: var(--pui-color-gray-400); }
-.bg-gray-500 { background-color: var(--pui-color-gray-500); }
-.bg-gray-600 { background-color: var(--pui-color-gray-600); }
-.bg-gray-700 { background-color: var(--pui-color-gray-700); }
-.bg-gray-800 { background-color: var(--pui-color-gray-800); }
-.bg-gray-900 { background-color: var(--pui-color-gray-900); }
-
-/* Dark mode backgrounds */
-.bg-dark-100 { background-color: var(--pui-color-dark-100); }
-.bg-dark-200 { background-color: var(--pui-color-dark-200); }
-.bg-dark-300 { background-color: var(--pui-color-dark-300); }
-.bg-dark-400 { background-color: var(--pui-color-dark-400); }
-.bg-dark-500 { background-color: var(--pui-color-dark-500); }
-
-/* Special backgrounds */
-.bg-transparent { background-color: transparent; }
-.bg-inherit { background-color: inherit; }
-
-/* ============================================
- * BORDER COLORS
- * ============================================ */
-
-/* Brand borders */
-.border-primary { border-color: var(--pui-color-primary); }
-.border-secondary { border-color: var(--pui-color-secondary); }
-.border-accent { border-color: var(--pui-color-accent); }
-
-/* Status borders */
-.border-danger { border-color: var(--pui-color-danger); }
-.border-warning { border-color: var(--pui-color-warning); }
-.border-success { border-color: var(--pui-color-success); }
-.border-info { border-color: var(--pui-color-info); }
-
-/* Neutral borders */
-.border-white { border-color: var(--pui-color-white); }
-.border-black { border-color: var(--pui-color-black); }
-.border-gray-50 { border-color: var(--pui-color-gray-50); }
-.border-gray-100 { border-color: var(--pui-color-gray-100); }
-.border-gray-200 { border-color: var(--pui-color-gray-200); }
-.border-gray-300 { border-color: var(--pui-color-gray-300); }
-.border-gray-400 { border-color: var(--pui-color-gray-400); }
-.border-gray-500 { border-color: var(--pui-color-gray-500); }
-.border-gray-600 { border-color: var(--pui-color-gray-600); }
-.border-gray-700 { border-color: var(--pui-color-gray-700); }
-.border-gray-800 { border-color: var(--pui-color-gray-800); }
-.border-gray-900 { border-color: var(--pui-color-gray-900); }
-
-/* Dark mode borders */
-.border-dark { border-color: var(--pui-color-dark-border); }
-.border-dark-subtle { border-color: var(--pui-color-dark-border-subtle); }
-
-/* Default/semantic borders */
-.border-default { border-color: var(--pui-border-default); }
-.border-transparent { border-color: transparent; }
-.border-inherit { border-color: inherit; }
-
-/* Border width utilities */
-.border-0 { border-width: 0; }
-.border { border-width: 1px; border-style: solid; }
-.border-2 { border-width: 2px; border-style: solid; }
-.border-4 { border-width: 4px; border-style: solid; }
-.border-t { border-top-width: 1px; border-top-style: solid; }
-.border-r { border-right-width: 1px; border-right-style: solid; }
-.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
-.border-l { border-left-width: 1px; border-left-style: solid; }
-
-/* User Select */
-.select-none { user-select: none; }
-
-/* Cursor */
-.cursor-pointer { cursor: pointer; }
-.cursor-not-allowed { cursor: not-allowed; }
-
-/* Truncation */
-.truncate {
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
-/* Border Radius */
-.rounded { border-radius: var(--pui-radius-base); }
-.rounded-md { border-radius: var(--pui-radius-md); }
-.rounded-lg { border-radius: var(--pui-radius-lg); }
-.rounded-full { border-radius: var(--pui-radius-full); }
-
-/* Shadow */
-.shadow-sm { box-shadow: var(--pui-shadow-sm); }
-.shadow { box-shadow: var(--pui-shadow-base); }
-.shadow-md { box-shadow: var(--pui-shadow-md); }
-
-/* Screen Reader Only */
-.sr-only {
-	position: absolute;
-	width: 1px;
-	height: 1px;
-	padding: 0;
-	margin: -1px;
-	overflow: hidden;
-	clip: rect(0, 0, 0, 0);
-	white-space: nowrap;
-	border-width: 0;
-}
-
-/* Stack Utilities */
-.vstack {
-	display: flex;
-	flex-direction: column;
-	gap: var(--pui-spacing-4);
-}
-
-.hstack {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	gap: var(--pui-spacing-4);
-}
-
-.center {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-}
-
-/* Container */
-.container {
-	width: 100%;
-	margin-inline: auto;
-	padding-inline: var(--pui-spacing-4);
-}
-
-@media (min-width: 640px) {
-	.container { max-width: 640px; }
-}
-@media (min-width: 768px) {
-	.container { max-width: 768px; }
-}
-@media (min-width: 1024px) {
-	.container { max-width: 1024px; }
-}
-@media (min-width: 1280px) {
-	.container { max-width: 1280px; }
-}
-
-/* ============================================
- * Padding
- * ============================================ */
-.p-0 { padding: var(--pui-spacing-0); }
-.p-1 { padding: var(--pui-spacing-1); }
-.p-2 { padding: var(--pui-spacing-2); }
-.p-3 { padding: var(--pui-spacing-3); }
-.p-4 { padding: var(--pui-spacing-4); }
-.p-5 { padding: var(--pui-spacing-5); }
-.p-6 { padding: var(--pui-spacing-6); }
-.p-7 { padding: var(--pui-spacing-7); }
-.p-8 { padding: var(--pui-spacing-8); }
-.p-9 { padding: var(--pui-spacing-9); }
-.p-10 { padding: var(--pui-spacing-10); }
-.p-11 { padding: var(--pui-spacing-11); }
-.p-12 { padding: var(--pui-spacing-12); }
-.p-14 { padding: var(--pui-spacing-14); }
-.p-16 { padding: var(--pui-spacing-16); }
-.p-20 { padding: var(--pui-spacing-20); }
-.p-24 { padding: var(--pui-spacing-24); }
-
-.px-0 { padding-inline: var(--pui-spacing-0); }
-.px-1 { padding-inline: var(--pui-spacing-1); }
-.px-2 { padding-inline: var(--pui-spacing-2); }
-.px-3 { padding-inline: var(--pui-spacing-3); }
-.px-4 { padding-inline: var(--pui-spacing-4); }
-.px-5 { padding-inline: var(--pui-spacing-5); }
-.px-6 { padding-inline: var(--pui-spacing-6); }
-.px-7 { padding-inline: var(--pui-spacing-7); }
-.px-8 { padding-inline: var(--pui-spacing-8); }
-.px-9 { padding-inline: var(--pui-spacing-9); }
-.px-10 { padding-inline: var(--pui-spacing-10); }
-.px-11 { padding-inline: var(--pui-spacing-11); }
-.px-12 { padding-inline: var(--pui-spacing-12); }
-.px-14 { padding-inline: var(--pui-spacing-14); }
-.px-16 { padding-inline: var(--pui-spacing-16); }
-.px-20 { padding-inline: var(--pui-spacing-20); }
-.px-24 { padding-inline: var(--pui-spacing-24); }
-
-.py-0 { padding-block: var(--pui-spacing-0); }
-.py-1 { padding-block: var(--pui-spacing-1); }
-.py-2 { padding-block: var(--pui-spacing-2); }
-.py-3 { padding-block: var(--pui-spacing-3); }
-.py-4 { padding-block: var(--pui-spacing-4); }
-.py-5 { padding-block: var(--pui-spacing-5); }
-.py-6 { padding-block: var(--pui-spacing-6); }
-.py-7 { padding-block: var(--pui-spacing-7); }
-.py-8 { padding-block: var(--pui-spacing-8); }
-.py-9 { padding-block: var(--pui-spacing-9); }
-.py-10 { padding-block: var(--pui-spacing-10); }
-.py-11 { padding-block: var(--pui-spacing-11); }
-.py-12 { padding-block: var(--pui-spacing-12); }
-.py-14 { padding-block: var(--pui-spacing-14); }
-.py-16 { padding-block: var(--pui-spacing-16); }
-.py-20 { padding-block: var(--pui-spacing-20); }
-.py-24 { padding-block: var(--pui-spacing-24); }
-
-.pt-0 { padding-top: var(--pui-spacing-0); }
-.pt-1 { padding-top: var(--pui-spacing-1); }
-.pt-2 { padding-top: var(--pui-spacing-2); }
-.pt-3 { padding-top: var(--pui-spacing-3); }
-.pt-4 { padding-top: var(--pui-spacing-4); }
-.pt-5 { padding-top: var(--pui-spacing-5); }
-.pt-6 { padding-top: var(--pui-spacing-6); }
-.pt-7 { padding-top: var(--pui-spacing-7); }
-.pt-8 { padding-top: var(--pui-spacing-8); }
-
-.pe-0 { padding-inline-end: var(--pui-spacing-0); }
-.pe-1 { padding-inline-end: var(--pui-spacing-1); }
-.pe-2 { padding-inline-end: var(--pui-spacing-2); }
-.pe-3 { padding-inline-end: var(--pui-spacing-3); }
-.pe-4 { padding-inline-end: var(--pui-spacing-4); }
-.pe-5 { padding-inline-end: var(--pui-spacing-5); }
-.pe-6 { padding-inline-end: var(--pui-spacing-6); }
-.pe-7 { padding-inline-end: var(--pui-spacing-7); }
-.pe-8 { padding-inline-end: var(--pui-spacing-8); }
-
-.pb-0 { padding-bottom: var(--pui-spacing-0); }
-.pb-1 { padding-bottom: var(--pui-spacing-1); }
-.pb-2 { padding-bottom: var(--pui-spacing-2); }
-.pb-3 { padding-bottom: var(--pui-spacing-3); }
-.pb-4 { padding-bottom: var(--pui-spacing-4); }
-.pb-5 { padding-bottom: var(--pui-spacing-5); }
-.pb-6 { padding-bottom: var(--pui-spacing-6); }
-.pb-7 { padding-bottom: var(--pui-spacing-7); }
-.pb-8 { padding-bottom: var(--pui-spacing-8); }
-
-.ps-0 { padding-inline-start: var(--pui-spacing-0); }
-.ps-1 { padding-inline-start: var(--pui-spacing-1); }
-.ps-2 { padding-inline-start: var(--pui-spacing-2); }
-.ps-3 { padding-inline-start: var(--pui-spacing-3); }
-.ps-4 { padding-inline-start: var(--pui-spacing-4); }
-.ps-5 { padding-inline-start: var(--pui-spacing-5); }
-.ps-6 { padding-inline-start: var(--pui-spacing-6); }
-.ps-7 { padding-inline-start: var(--pui-spacing-7); }
-.ps-8 { padding-inline-start: var(--pui-spacing-8); }
-
-/* ============================================
- * Margin
- * ============================================ */
-.m-0 { margin: var(--pui-spacing-0); }
-.m-1 { margin: var(--pui-spacing-1); }
-.m-2 { margin: var(--pui-spacing-2); }
-.m-3 { margin: var(--pui-spacing-3); }
-.m-4 { margin: var(--pui-spacing-4); }
-.m-5 { margin: var(--pui-spacing-5); }
-.m-6 { margin: var(--pui-spacing-6); }
-.m-7 { margin: var(--pui-spacing-7); }
-.m-8 { margin: var(--pui-spacing-8); }
-.m-9 { margin: var(--pui-spacing-9); }
-.m-10 { margin: var(--pui-spacing-10); }
-.m-11 { margin: var(--pui-spacing-11); }
-.m-12 { margin: var(--pui-spacing-12); }
-.m-14 { margin: var(--pui-spacing-14); }
-.m-16 { margin: var(--pui-spacing-16); }
-.m-20 { margin: var(--pui-spacing-20); }
-.m-24 { margin: var(--pui-spacing-24); }
-.m-auto { margin: auto; }
-
-.mx-0 { margin-inline: var(--pui-spacing-0); }
-.mx-1 { margin-inline: var(--pui-spacing-1); }
-.mx-2 { margin-inline: var(--pui-spacing-2); }
-.mx-3 { margin-inline: var(--pui-spacing-3); }
-.mx-4 { margin-inline: var(--pui-spacing-4); }
-.mx-5 { margin-inline: var(--pui-spacing-5); }
-.mx-6 { margin-inline: var(--pui-spacing-6); }
-.mx-7 { margin-inline: var(--pui-spacing-7); }
-.mx-8 { margin-inline: var(--pui-spacing-8); }
-.mx-9 { margin-inline: var(--pui-spacing-9); }
-.mx-10 { margin-inline: var(--pui-spacing-10); }
-.mx-11 { margin-inline: var(--pui-spacing-11); }
-.mx-12 { margin-inline: var(--pui-spacing-12); }
-.mx-14 { margin-inline: var(--pui-spacing-14); }
-.mx-16 { margin-inline: var(--pui-spacing-16); }
-.mx-20 { margin-inline: var(--pui-spacing-20); }
-.mx-24 { margin-inline: var(--pui-spacing-24); }
-.mx-auto { margin-inline: auto; }
-
-.my-0 { margin-block: var(--pui-spacing-0); }
-.my-1 { margin-block: var(--pui-spacing-1); }
-.my-2 { margin-block: var(--pui-spacing-2); }
-.my-3 { margin-block: var(--pui-spacing-3); }
-.my-4 { margin-block: var(--pui-spacing-4); }
-.my-5 { margin-block: var(--pui-spacing-5); }
-.my-6 { margin-block: var(--pui-spacing-6); }
-.my-7 { margin-block: var(--pui-spacing-7); }
-.my-8 { margin-block: var(--pui-spacing-8); }
-.my-9 { margin-block: var(--pui-spacing-9); }
-.my-10 { margin-block: var(--pui-spacing-10); }
-.my-11 { margin-block: var(--pui-spacing-11); }
-.my-12 { margin-block: var(--pui-spacing-12); }
-.my-14 { margin-block: var(--pui-spacing-14); }
-.my-16 { margin-block: var(--pui-spacing-16); }
-.my-20 { margin-block: var(--pui-spacing-20); }
-.my-24 { margin-block: var(--pui-spacing-24); }
-.my-auto { margin-block: auto; }
-
-.mt-0 { margin-top: var(--pui-spacing-0); }
-.mt-1 { margin-top: var(--pui-spacing-1); }
-.mt-2 { margin-top: var(--pui-spacing-2); }
-.mt-3 { margin-top: var(--pui-spacing-3); }
-.mt-4 { margin-top: var(--pui-spacing-4); }
-.mt-5 { margin-top: var(--pui-spacing-5); }
-.mt-6 { margin-top: var(--pui-spacing-6); }
-.mt-7 { margin-top: var(--pui-spacing-7); }
-.mt-8 { margin-top: var(--pui-spacing-8); }
-.mt-auto { margin-top: auto; }
-
-.me-0 { margin-inline-end: var(--pui-spacing-0); }
-.me-1 { margin-inline-end: var(--pui-spacing-1); }
-.me-2 { margin-inline-end: var(--pui-spacing-2); }
-.me-3 { margin-inline-end: var(--pui-spacing-3); }
-.me-4 { margin-inline-end: var(--pui-spacing-4); }
-.me-5 { margin-inline-end: var(--pui-spacing-5); }
-.me-6 { margin-inline-end: var(--pui-spacing-6); }
-.me-7 { margin-inline-end: var(--pui-spacing-7); }
-.me-8 { margin-inline-end: var(--pui-spacing-8); }
-.me-auto { margin-inline-end: auto; }
-
-.mb-0 { margin-bottom: var(--pui-spacing-0); }
-.mb-1 { margin-bottom: var(--pui-spacing-1); }
-.mb-2 { margin-bottom: var(--pui-spacing-2); }
-.mb-3 { margin-bottom: var(--pui-spacing-3); }
-.mb-4 { margin-bottom: var(--pui-spacing-4); }
-.mb-5 { margin-bottom: var(--pui-spacing-5); }
-.mb-6 { margin-bottom: var(--pui-spacing-6); }
-.mb-7 { margin-bottom: var(--pui-spacing-7); }
-.mb-8 { margin-bottom: var(--pui-spacing-8); }
-.mb-auto { margin-bottom: auto; }
-
-.ms-0 { margin-inline-start: var(--pui-spacing-0); }
-.ms-1 { margin-inline-start: var(--pui-spacing-1); }
-.ms-2 { margin-inline-start: var(--pui-spacing-2); }
-.ms-3 { margin-inline-start: var(--pui-spacing-3); }
-.ms-4 { margin-inline-start: var(--pui-spacing-4); }
-.ms-5 { margin-inline-start: var(--pui-spacing-5); }
-.ms-6 { margin-inline-start: var(--pui-spacing-6); }
-.ms-7 { margin-inline-start: var(--pui-spacing-7); }
-.ms-8 { margin-inline-start: var(--pui-spacing-8); }
-.ms-auto { margin-inline-start: auto; }

package/dist/ui/Breadcrumbs.svelte

@@ -1,131 +0,0 @@
-<script lang="ts">
-	import type { Snippet } from 'svelte';
-	import Icon from '../icon/Icon.svelte';
-	import { iconChevronRight } from '../icon/index.js';
-
-	interface BreadcrumbItem {
-		label: string;
-		href?: string;
-		icon?: string;
-	}
-
-	interface Props {
-		items?: BreadcrumbItem[];
-		separator?: string | Snippet;
-		separatorMargin?: string;
-		class?: string;
-		children?: Snippet;
-	}
-
-	let {
-		items = [],
-		separator = undefined,
-		separatorMargin = '0.5rem',
-		class: classes = '',
-		children
-	}: Props = $props();
-</script>
-
-<nav aria-label="Breadcrumb" class="breadcrumbs {classes}">
-	<ol class="breadcrumb-list">
-		{#if children}
-			{@render children()}
-		{:else}
-			{#each items as item, index (index)}
-				{#if index > 0}
-					<li class="breadcrumb-separator" style="margin: 0 {separatorMargin};" aria-hidden="true">
-						{#if typeof separator === 'function'}
-							{@render separator()}
-						{:else if separator}
-							{separator}
-						{:else}
-							<Icon svg={iconChevronRight} size="14px" />
-						{/if}
-					</li>
-				{/if}
-				<li class="breadcrumb-item">
-					{#if item.href && index < items.length - 1}
-						<a href={item.href} class="breadcrumb-link">
-							{#if item.icon}
-								<Icon svg={item.icon} size="16px" />
-							{/if}
-							<span>{item.label}</span>
-						</a>
-					{:else}
-						<span class="breadcrumb-current" aria-current={index === items.length - 1 ? 'page' : undefined}>
-							{#if item.icon}
-								<Icon svg={item.icon} size="16px" />
-							{/if}
-							<span>{item.label}</span>
-						</span>
-					{/if}
-				</li>
-			{/each}
-		{/if}
-	</ol>
-</nav>
-
-<style>
-	.breadcrumbs {
-		width: 100%;
-	}
-
-	.breadcrumb-list {
-		display: flex;
-		align-items: center;
-		flex-wrap: wrap;
-		list-style: none;
-		margin: 0;
-		padding: 0;
-		font-size: var(--pui-font-size-sm);
-	}
-
-	.breadcrumb-item {
-		display: flex;
-		align-items: center;
-	}
-
-	.breadcrumb-link {
-		display: flex;
-		align-items: center;
-		gap: var(--pui-spacing-1);
-		color: var(--pui-color-gray-600);
-		text-decoration: none;
-		transition: color var(--pui-transition-fast) var(--pui-ease-in-out);
-	}
-
-	:global(.dark) .breadcrumb-link {
-		color: var(--pui-color-gray-400);
-	}
-
-	.breadcrumb-link:hover {
-		color: var(--pui-color-primary);
-		text-decoration: underline;
-	}
-
-	:global(.dark) .breadcrumb-link:hover {
-		color: var(--pui-color-secondary);
-	}
-
-	.breadcrumb-current {
-		display: flex;
-		align-items: center;
-		gap: var(--pui-spacing-1);
-		color: var(--pui-color-gray-900);
-		font-weight: var(--pui-font-weight-medium);
-	}
-
-	:global(.dark) .breadcrumb-current {
-		color: var(--pui-color-gray-100);
-	}
-
-	.breadcrumb-separator {
-		display: flex;
-		align-items: center;
-		color: var(--pui-color-gray-400);
-	}
-
-	:global(.dark) .breadcrumb-separator {
-		color: var(--pui-color-gray-600);
-	}
-</style>

package/dist/ui/Breadcrumbs.svelte.d.ts

@@ -1,16 +0,0 @@
-import type { Snippet } from 'svelte';
-interface BreadcrumbItem {
-    label: string;
-    href?: string;
-    icon?: string;
-}
-interface Props {
-    items?: BreadcrumbItem[];
-    separator?: string | Snippet;
-    separatorMargin?: string;
-    class?: string;
-    children?: Snippet;
-}
-declare const Breadcrumbs: import("svelte").Component<Props, {}, "">;
-type Breadcrumbs = ReturnType<typeof Breadcrumbs>;
-export default Breadcrumbs;