Describe the bug Skeleton element uses full available height even in basic example. Occures on both, device and XCode preview.

To Reproduce

Expected behavior Skeleton uses height of one line of text

Screenshots Uploaded in reproduction section

Desktop (please complete the following information):

• OS: macOS
• Version: 11.0.1 (20B29)

Smartphone (please complete the following information):

• Device: iPhone 8 Plus & XCode Preview
• OS: iOS 14.2 (18B92) Additional context

Issue Link :link:

The extension for TextField is causing an infinity loop in iOS15

Goals :soccer:

Make it work for iOS 15

Implementation Details :construction:

• Removing the extension and updating the tests

Issue Link :link:

#18 .primary color extension

Goals :soccer:

As the related issue mentions, the current implementation clashes with the built-in Color, so the goal of this PR is to address that.

Implementation Details :construction:

For what I can tell, the current usage is simple enough to warrant a simple struct instead of an extension, as one should be wary of extending core functionality inside a library.

Testing Details :mag:

No tests were added or removed in this PR.

Describe the bug Hi @CSolanaM . First of all, I would like to say thanks for your framework but, unfortunately, I've found one issue that blocks me from submitting my app to App Store. I would like to describe it. I have a screen with two main elements: some card that may be flipped by the user and a list of data for which I use SkeletonList. Both views inside the body of ContentView. Not more. SkeletonList is animated when the screen is appeared to start loading content, but when the user flipped a card SkeletonList stops its animation. The same issue for SkeletonForEach.

To Reproduce I put here the small piece of code that simulates my screen:

import SwiftUI
import SkeletonUI

struct CardContentView<Content>: View where Content: View {
    var content: () -> Content
    var body: some View {
        content()
    }
}

struct TopCardFronView: View {
    @Binding var anotherLoading: Bool
    var body: some View {
        VStack {
            Text("Tap me")
                .foregroundColor(.white)
                .font(.largeTitle)
                .onTapGesture {
                    anotherLoading.toggle()
                }
        }
        .frame(width: 150, height: 150)
        .background(Color.black)
    }
}

struct TopCardBackView: View {
    var body: some View {
        VStack {
            Text("Another text")
                .foregroundColor(.white)
                .font(.largeTitle)
        }
        .frame(width: 150, height: 150)
        .background(Color.black)
    }
}

struct User: Identifiable {
    let id = UUID()
    let name: String
}

struct ContentView: View {
    @State private var rotationAngle: Double = 0
    @State private var flipped = false
    @State private var anotherLoading = false
    @State var users = [User]()
    var body: some View {
        VStack {
            CardContentView {
                VStack {
                    Group {
                        if flipped {
                            TopCardBackView()
                                .rotation3DEffect(.degrees(rotationAngle),
                                                      axis: (x: 0.0, y: 1.0, z: 0.0))
                        } else {
                            TopCardFronView(anotherLoading: $anotherLoading)
                        }
                    }
                }
            }
            .rotation3DEffect(.degrees(rotationAngle),
                                  axis: (x: 0.0, y: 1.0, z: 0.0))
            .onChange(of: anotherLoading, perform: { value in
                withAnimation {
                    flipped.toggle()
                    rotationAngle += 180
                }
            })
            SkeletonList(with: users, quantity: 6) { loading, user in
                        Text(user?.name)
                            .skeleton(with: loading)
                            .shape(type: .rectangle)
                            .appearance(type: .solid(color: .red, background: .blue))
                            .multiline(lines: 3, scales: [1: 0.5])
                            .animation(type: .pulse())
                    }
                    .onAppear {
                        DispatchQueue.main.asyncAfter(deadline: .now() + 20) {
                            self.users = [User(name: "John Doe"),
                                          User(name: "Jane Doe"),
                                          User(name: "James Doe"),
                                          User(name: "Judy Doe")]
                        }
                    }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Expected behavior SkeletonList should continue to animate.

Screenshots

Desktop (please complete the following information):

• MacOS Catalina
• Version 10.15.7

Smartphone (please complete the following information):

• Device: iPhone SE 1st GEN & XCode Preview
• iOS 14.4

Additional context Add any other context about the problem here.

Thank you for starting this project! I'm excited to check it out!

Describe the bug While trying to do a new install of SkeletonUI, the pod install fails with the following error:

[!] Error installing SkeletonUI
[!] /usr/bin/git clone https://github.com/CSolanaM/SkeletonUI.git /var/folders/st/3lb8mpm938xfqktsrb3b62g80000gn/T/d20191029-96400-wf7mcw --template= --single-branch --depth 1 --branch 0.1.1

Cloning into '/var/folders/st/3lb8mpm938xfqktsrb3b62g80000gn/T/d20191029-96400-wf7mcw'...
warning: Could not find remote branch 0.1.1 to clone.
fatal: Remote branch 0.1.1 not found in upstream origin

To Reproduce Steps to reproduce the behavior:

1. Start with a fresh project that does not have SkeletonUI installed
2. Add SkeletonUI to the podfile
3. Attempt to install the pods with pod install
4. See error

Expected behavior SkeletonUI is installed.

Screenshots It's just the text above.

Desktop (please complete the following information):

• n/a

Smartphone (please complete the following information):

• n/a

Additional context none

Hi There,

I'm trying to use the example to animate my skeleton. However, it's not getting animated.

To Reproduce Steps to reproduce the behavior:

1. Use the following Code:

Text("Finished requesting users!")
                    .skeleton(with: true)
                    .appearance(type: .solid(color: .red, background: .blue))
                    .animation(type: .pulse())
                    .background(Color.black)

Expected behavior It should be animated

Screenshots

What could be happening?

Best Regards

If just normally presenting the view it works find, but if push the view using NavigationLink the animation effect would not working and only display a plain censored gray bar.

• iOS simulator: 15.2

Screenshots

Describe the bug bug when use scrollview with skeletonForeach.

To Reproduce Steps to reproduce the behavior:

1. in example project
2. change skeletonList to skeletonForeach
3. embed in scroolView
4. See error

Expected behavior working as skeletonList

Describe the bug I'm using SkeletonUI in my app and in one of the views I was having a bug that apparently was related to displaying the SkeletonUI View. The problem, after hours of debugging, was apparently caused by .navigationBarHidden(true) that was applied to a ZStack witch contained the Text View displaying the skeleton to prevent a UIHostingController from displaying the nav bar.

To Reproduce This is the main view.

    var body: some View {
        ZStack(alignment: .center) {
            Text("")
                .skeleton(with: true)
                .shape(type: .rectangle)
                .multiline(lines: 2, scales: [0: 0.8, 1: 0.6], spacing: 2.0)
                .appearance(type: .gradient(GradientType.linear, color: Color(UIColor(hex: 0xbdcbdb)), background: .white, radius: 0.7, angle: 0.0))
                .animation(type: .linear(delay: 0.0))
                .padding(.bottom, 20.0)
        }
        // Removing the next 2 lines will remove the bug.
        .navigationBarTitle("")
        .navigationBarHidden(true)
    }

Note: To reproduce this code you need to put this view in a UIHostingController.

Expected behavior A normal 2 lines gradient animation that does not move.

Screenshots Note: Updated Video. Screenshots

Additional context The Swift UI view is presented in a UIHostingController.

In the AppearenceInteractor file you declare an extension to the Color type. However this creates an error when I import this library in a file and in the same file use the stock Color.primary by Apple as there are two Color.primary and it is ambiguous. Please rename it.

public static var primary: Color {
        #if os(iOS)
            return Color(.systemGray4)
        #elseif os(tvOS)
            return Color(.tertiaryLabel)
        #elseif os(watchOS)
            return Color.secondary
        #elseif os(macOS)
            return Color(.alternateSelectedControlColor)
        #endif
    }
}

I got this error when running your example

SkeletonUI-macOS-iOS[1728:47422] Task <5ED5FF93-B549-451D-88B1-A54648BCBDA0>.<1> finished with error [-999] Error Domain=NSURLErrorDomain Code=-999 "cancelled" UserInfo={NSErrorFailingURLStringKey=https://rickandmortyapi.com/api/character/, NSLocalizedDescription=cancelled, NSErrorFailingURLKey=https://rickandmortyapi.com/api/character/}

Can you give it a look? Thanks

Issue Link :link:

Projects with a minimum target < iOS 13 receive errors when importing this library

Goals :soccer:

• Enable SkeletonUI to be imported and used by projects with a minimum target that is < iOS 13

Implementation Details :construction:

• Add available checks • Add #if arch(x86_64) || arch(arm64) checks

Describe the bug Using SkeletonForEach twice in a LazyVGrid causes the IDs to be duplicated which leads to several bugs.

To Reproduce

LazyVGrid(columns: gridLayout, spacing: 20) {
    SkeletonForEach(with: ..., quantity: 2) { (loading, item) in
        Text(item).skeleton(with: loading)
    }
    SkeletonForEach(with: ..., quantity: 2) { (loading, item) in
        Text(item).skeleton(with: loading)
    }
}

Expected behavior To be able to use two SkeletonForEach's.

Additional context

• iOS: 15
• Swift: 5.3
• Branch: develop

Goals :soccer:

SkeletonUI uses GeometryReader to read the views size. GeometryReader is greedy and tacks all the size it gets. If I have a typical Layout like: HStack { Text("a") VStack { Text("a") Text("a") }.skeleton(true).multiline(...) }

This causes VStack to take the complete height of the container. Also the multiline is "blown" up. You can work around by applying extra constraints when the skeleton is there, but that increases the complexity of the layout a lout.

A simple solution is to add a padding option to the multiline modifier, this enables more flexibility when adding the skeleton.

Testing Details :mag:

Added a new snapshot testtestCustomTextWithPadding